:aboutページのHTML構造2 ―― 改良の提案

ということで修正案です。

現在のプロフィールページのHTMLは次のような構造になっています。

<h1>日記のタイトル</h1>
<div class="hatena-body">

  <div class="day">
    <h2><span class="title">id</span></h2>
    <div class="body">

      <div class="section">
        <img src="写真.jpg" alt="id" class="photo" />
        <h3 class="subtitle">一行紹介</h3>
          <p>一行紹介欄のテキスト</p>
      </div>

      <div class="section"><h3 class="subtitle">プロフィール</h3></div>

      <div class="section">
        詳細なプロフィール欄のテキスト
      </div>

      <div class="section">
        <h3 class="subtitle">はてなダイアリー登録情報</h3>
          <p>ユーザー登録日時：200x-xx-xx xx:xx:xx</p>
          <p>ユーザー登録から本日までに日記をつけた日数：xx日</p>
          <p>本日までの最終更新日：200x-xx-xx</p>
          <p>はてなダイアリー市民：ＸＸＸ</p>
          <p>有料オプション：ＸＸ</p>
       </div>
    </div>
  </div>

  <div class="footer">Copyright ……</div>
</div>

これを、以下のようなHTML構造に直すといいんじゃないでしょうか。

<h1>日記のタイトル</h1>
<div class="hatena-body">

  <div class="day">
    <h2><span class="title">id</span></h2>
    <div class="body">
      <p>一行紹介欄のテキスト</p>
    </div>
  </div>

  <div class="day">
    <h2><span class="title">プロフィール</span></h2>
    <div class="body">
      <img src="写真.jpg" alt="id" class="photo" />
      <div class="section">
        詳細なプロフィール欄のテキスト
      </div>
    </div>
  </div>

  <div class="day">
    <h2><span class="title">はてなダイアリー登録情報</span></h2>
    <div class="body">
      <div class="section">
        <dl>
          <dt>ユーザー登録日時</dt><dd>200x-xx-xx xx:xx:xx</dd>
          <dt>ユーザー登録から本日までに日記をつけた日数</dt><dd>xx日</dd>
          <dt>本日までの最終更新日</dt><dd>200x-xx-xx</dd>
          <dt>はてなダイアリー市民</dt><dd>ＸＸＸ</dd>
          <dt>有料オプション</dt><dd>ＸＸ</dd>
        </dl>
      </div>
    </div>
  </div>
</div>

ひょっとしたらどっかにタグの閉じ忘れとかミスがあるかもしれないけど、修正点の中で肝心なのは次の点なので、これだけは落とさないで見てくれれば嬉しいと思った。

• 「プロフィール」などのシステムが付ける見出しを<h2>要素に格上げ。
• そうすると「一行紹介」と「id名の見出し」が連続して<h2>要素になるので、これをひとつにまとめてしまって、「一行紹介」という見出しを捨てる。

あと、ついでに上の改良案では以下の3点も修正してます。

• 画像の場所を「一行紹介」から「プロフィール」の中に移した。
  • その方が見栄えがいい（プロフィール欄の方が広いから）
• 「はてなダイアリー登録情報」を定義リストにした。
• プロフィールはユーザーが書いてるので、フッタの「(c) hatena」を外した。

というようなことをはてなダイアリーへの要望として挙げさせていただきます。

ご検討ください＞id:hatenadiaryさま