亜細亜ノ蛾 - Weblog

script と img

「それを言うのはお前で100万人目だ！」（by. 絶望先生: 『100万回言われた猫』）──なネタですが……。

こっちは正しいのに:

<img src="hoge.jpg" alt="alt の内容" />
<script type="text/javascript" src="fuga.js"></script>

これはダメ:

<img src="hoge.jpg">alt の内容</img>
<script type="text/javascript" src="fuga.js" />

──というのがイライラ。

まぁ、「空要素タグ」か どうか、ということを把握しておけば間違いはないのですが、なんとなく直感に反する感じ。

dl dt dd

こっちは、自分の認識があっているか、自信がないですが……。

たとえば、こういった定義リストが あったとして:

<dl>
  <dt>定義 1 のタイトル</dt>
  <dd>定義 1 の中身</dd>
  <dt>定義 2 のタイトル</dt>
  <dd>定義 2 の中身</dd>
</dl>

「タイトル」と「中身」は一対一で対応している、と思いますよね。つまり、こんな感じだと:

[dl]
  |
  +--[dt]--[dd]
  +--[dt]--[dd]

──しかし、実際は上のようなツリー構造には なっていません。こうですね:

[dl]
  |
  +--[dt]
  +--[dd]
  +--[dt]
  +--[dd]

要するに、dt と dd は「dl 要素の直下にある」というだけの関係です。

なので、こう書いても問題ありません:

<dl>
  <dt>定義 1 のタイトル</dt>
  <dt>定義 2 のタイトル</dt>
  <dd>定義 1 の中身</dd>
  <dd>定義 2 の中身</dd>
</dl>

そのあたりが気持ち悪い自分は、こうやって定義したりします:

<div class="define">
  <dl>
    <dt>定義 1 のタイトル</dt>
    <dd>定義 1 の中身</dd>
  </dl>
  <dl>
    <dt>定義 2 のタイトル</dt>
    <dd>定義 2 の中身</dd>
  </dl>
</div>

または、ul と li で書いています:

<ul class="define">
  <li>定義 1 のタイトル
    <ul>
      <li>定義 1 の中身</li>
    </ul>
  </li>
  <li>定義 2 のタイトル
    <ul>
      <li>定義 2 の中身</li>
    </ul>
  </li>
</ul>

うーん、このあたり、ベストプラクティスは あるのでしょうか……。

MT タグ

これも「100 万回」シリーズですが……。こんなコードもイライラ:

<a href="<$MTEntryPermalink$ encode_url="1">">
  <$MTEntryTitle encode_html="1"$>
</a>

──え、どこが？ と言う人も多いと思いますが……。

<> と "" が、ネストネストしているのが気分悪い。

そもそも、MT タグなんて独自タグなんだから、(X)HTML を真似る必要は無かったと思いますね。

たとえば、こんな書き方もサポートしたらいいのに（それ Plu）:

<a href="{MT:EntryPermalink encode_url="1"}">
  {$MT:EntryTitle encode_html="1"$}
</a>

まとめ

──え、もう終わり？ という感じですが、書いている内に長くなったので、これくらいに します。

全然、情報を追いかけていないですが、HTML5 や XHTML2.0 では、どうなるんでしょうね？ もっと、正しい (X)HTML を誰でも書けるようになると、良いですね。