私的HTMLコーディング規約

私が普段心がけているHTMLのコーディング規約(というほど大層なものでもありませんが)を記しておきます。いつかは文書化しなければ…と思っていたので。先日のなんか流行っているみたいなのでデフォルトCSSを公開してみる - devworksと合わせてみると効果的かも。

ツッコミ歓迎してます。間違い、もしくは不適切な記述がありましたらコメントかトラックバックでお知らせ下さい。

前提

HTMLの要素及び属性は全て小文字で記述する。

何故かというとXHTMLへの将来の移行を前提としている為です。しかし、現時点ではXHTMLの移行は時期尚早と私は考えています。*1

DOCTYPE宣言

HTML 4.01 Transitional URL 付きで記述する。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

要は標準モードにしましょうというわけです。

head要素

次章のmeta要素・title要素を参照して下さい。

meta要素

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">

title要素

省略することはできません。必ず記述すること。

html要素

<html lang="ja">

lang要素属性を忘れずに！

body要素以下諸々

HTMLの本文部分であるbody以下の要素のマークアップする際の注意点を記述します。

見出しはhx要素を

見出しレベルに合わせてh1～h6を記述すること

段落にはp要素を

段落にはp要素を使用すること。下記は×です。

文章文章文章文章文章<br>
文章文章文章文章文章<br>

引用にはblockquote要素を使用すること

出典のURIがある場合はcite属性にURIを記述して下さい。その際にtitle属性も記述して下さい。

インライン要素での引用はq要素、またはcite要素を使用して下さい。

リストを記述した場合はul liまたはol li要素を使用すること

下記のような記述はNG

・リスト1
・リスト2
・リスト3

1.リスト1
2.リスト2
3.リスト3

下記のように記述すること

<ul>
    <li>リスト1</li>
    <li>リスト2</li>
    <li>リスト3</li>
</ul>

<ol>
    <li>リスト1</li>
    <li>リスト2</li>
    <li>リスト3</li>
</ol>

定義リストはdl dt dd要素を使用すること

<dl>
    <dt>定義</dt>
    <dd>説明</dd>
</dl>

b,iなどの物理要素を記述しないこと

テキストに何らかの装飾を加えたい場合はCSSに記述すること

強調したい場合はemもしくはstrong要素を使用すること

em要素は強調。strong要素はより強い強調を表します。

img要素を記述する際は必ずalt属性を指定すること

img要素のalt属性は必須です。画像が表示されない環境にあるブラウザではalt属性は代替テキストとして機能します。

最後に

思いつくのはこんなものだけど、何か~~忘れている気がする…。~~実体参照を書き忘れていたので追記

2006/10/07追記

実体参照

"→&quot;
&→&amp;
<→&lt;
>→&gt;

Permalink | コメント(0) | トラックバック(1) | 23:05

*1：IE6はxml宣言を記述すると互換モードと扱うためです

トラックバック - http://d.hatena.ne.jp/devworks/20060905/1157465119

主に言語とシステム開発に関して - HTMLとスタイルシート（CSS）の...

リンク元

devworks

2006-09-05