Revizeは下記のコーディング規約に基づいて制作されています。Revizeをベースにしたテーマ、Revizeに対応したプラグインを制作するには同様のコーディング規約に倣う必要があります。
文書型にはTrasitionalを採用します。 XHTML化機能へ対応するためには、変換後にXHTML 1.0 Transitionalの基準を満たすHTMLを記述する必要があります。
原則として、サイト名と記事などを含むメインブロックは、XHTML 2.0のsection要素に倣い、下記の構造に基づいてマークアップします。
<div class="section story featured story-featured">
<h2 class="title story-title">メインブロックのタイトル - レベル1</h2>
<div class="text story-text">
(メインブロックの内容 - レベル1)
</div>
</div>
<div class="section story">
<h2 class="title story-title">メインブロックのタイトル - レベル1</h2>
<div class="text story-text">
(メインブロックの内容 - レベル1)
</div>
<div class="section">
<h3 class="title">メインブロックのタイトル - レベル2</h3>
<div class="text">
(メインブロックの内容 - レベル2)
</div>
</div>
</div>
Heading(見出し)要素はサイト名とメインブロックのタイトル以外では使用しません。
クラス名が複数ある場合は、CSS2のセレクタに未対応のユーザーエージェント(IE等)にも配慮するため、「section」以外のそれぞれのクラス名を「-」(ハイフン)でつなげたクラス名も指定します。また、子要素は、必要に応じて、親要素のクラス名の一部と子要素のクラス名を「-」(ハイフン)でつなげたクラス名も指定します。
原則として、左右ブロックなどを含むサブブロックは、1つのブロックごとに下記の構造に基づいてマークアップします。
<dl class="utility user_block"> <dt class="title">ブロックタイトル - ブロック1</dt> <dd class="text">ブロックの内容 - ブロック1</dd> </dl> <dl class="utility admin_block"> <dt class="title">ブロックタイトル - ブロック2</dt> <dd class="text">ブロックの内容 - ブロック2</dd> </dl>
原則として、ページナビゲーションなどを含むナビゲーションは、1つのナビゲーションごとに下記の構造に基づいてマークアップします。
<ul class="navigation page navigation-page"> <li class="first"><a href="first.html">最初のナビゲーション</a></li> <li><a href="normal.html">通常のナビゲーション</a></li> <li class="current"><strong>選択中のナビゲーション</strong></li> <li class="last"><a href="last.html">最後のナビゲーション</a></li> </ul>
クラス名が複数ある場合は、CSS2のセレクタに未対応のユーザーエージェント(IE等)にも配慮するため、それぞれのクラス名を「-」(ハイフン)でつなげたクラス名も指定します。
原則として、全てのフォームは下記の構造に基づいてマークアップします。
あるいは
<form action="action.php" method="post" id="FormAction">
<fieldset>
<legend>フィールド名</legend>
<dl class="field">
<dt><label for="FormAction-Field1">ラベル</label></dt>
<dd><input type="text" name="field1" value="" id="FormAction-Field1" class="text"></dd>
</dl>
<ul class="submit">
<li><input type="hidden" name="name" value="value"><input type="submit" value="{lang_register}" class="submit"></li>
</ul>
</fieldset>
</dl>
<form action="action.php" method="post" id="FormAction">
<fieldset>
<legend>フィールド名1</legend>
<dl class="field">
<dt><label for="FormAction-Field1">ラベル</label></dt>
<dd><input type="text" name="field1" value="" id="FormAction-Field1" class="text"></dd>
</dl>
</fieldset>
<fieldset>
<legend>フィールド名2</legend>
<dl class="field">
<dt><label for="FormAction-Field2">ラベル</label></dt>
<dd><input type="text" name="field2" value="" id="FormAction-Field2" class="text"></dd>
</dl>
</fieldset>
<ul class="submit">
<li><input type="hidden" name="name" value="value"><input type="submit" value="{lang_register}" class="submit"></li>
</ul>
</dl>
form要素のid属性値は「Form」から始まるアッパーキャメルケースにします。
input要素・textarea要素には、label要素のfor属性用にid属性を付けます。id属性値は、form要素のid属性値とinput要素・textarea要素のname属性値の1文字目を大文字にしたものを「-」(ハイフン)でつなぎます。
また、CSS2のセレクタに未対応のユーザーエージェント(IE等)にも配慮するため、input要素にはtype属性値と同じ値をclass属性値として追加します。
原則として、全てのシステムメッセージは下記の構造に基づいてマークアップします。
<dl class="message">
<dt class="title message-title">システムメッセージのタイトル</dt>
<dd class="text message-text">
<p>システムメッセージの内容</p>
</dd>
</dl>
CSS2のセレクタに未対応のユーザーエージェント(IE等)にも配慮するため、子要素は、必要に応じて、親要素のクラス名の一部と子要素のクラス名を「-」(ハイフン)でつなげたクラス名も指定します。
原則として、規則集合は次のように記述します。
selector,
selector
{
property: value;
property: value;
}
セレクタはセレクタごとに改行し、宣言ブロックの開始と終了を表す「{」・「}」の前後には改行を入れます。宣言(プロパティと値)は宣言ごとに改行し、プロパティの後ろには「:」と1つの半角スペースを入れ、値の後ろには「:」を入れます。
原則として、規則集合はspecificityが低い順に記述します。
element
{
property: value;
}
element>element,
element+element,
element[attr]
{
property: value;
}
また、CSS2のセレクタに未対応のユーザーエージェント(IE等)にも配慮するため、未対応セレクタ(子セレクタ・隣接兄弟セレクタ・属性セレクタ等)を含む規則集合は通常の規則集合と分けて記述します。セレクタの結合子(「>」・「+」等)の前後には空白文字は入れません。
原則として、プロパティはCascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specificationに出現する順序で記述します。