5

サイトの「拡張フッター」<aside>またはのどちらのマークアップが意味的に優れているでしょう<footer>か?

「拡張フッター」とは、このサイトの拡張フッターのようなものを指しています(著作権表示を含む一番下の「実際の」フッターとは対照的に、連絡先の詳細と営業時間を含みます)。「拡張フッター」のコンテンツは一般的で、サイト全体に適用され、サイトのページのコンテンツに特に関連するものではありません。

HTML5Doctor で引用されている仕様によると:

フッター要素は、最も近い祖先のセクション化コンテンツまたはセクション化ルート要素のフッターを表します。通常、フッターには、誰がそれを書いたか、関連文書へのリンク、著作権データなど、そのセクションに関する情報が含まれています。

私は次のようなものを実装する傾向があります

<footer>
    <div id="extended-footer"> <!-- Sitemap, latest posts, contact details, etc. --> </div>
    <div id="bottom-footer"> <!-- Copyright notice etc. --> </div>
</footer>

ただし、HTML5Doctor サイト自体は、以下の抜粋のようなものを使用していることに注意してください。

<aside id="extended-footer"> ... </aside>
<footer> <!-- similar to id-footer --> <footer>

ただし、HTMLDoctor の「拡張フッター」は実際の記事/コンテンツ (つまり、「関連投稿」セクションを介して) と何らかの関連があるように思われるため、おそらく<footer>withinとして実装できることに注意して<main>ください。

4

1 に答える 1

5

HTML5 CR は、このfooter要素をフッターを表すものとして定義しています。いくつかの例でフッターを特徴付けていますが、それ以上の実際の定義はありません。ただし、行間には 2 つの「フッター」の概念が絡み合っていることがわかると思います。サイトのすべてまたはほとんどのページに表示される定型文としてのフッター。ページ固有の変更が加えられている可能性があります。

いずれにせよ、たとえばソーシャル メディアのボタンはaside要素に属しているように見えます。これは、実際には (サイトまたはページの) コンテンツに「接線的に関連している」だけだからです。それでも、通常はすべてのページで繰り返されるため、論理的には「ボイラープレート」の意味でフッターの一部になります。

解決策は単純に見えます:aside要素内にネストされたfooter要素を使用します。

<footer>
  © 2013 ACME • <a href=map.html>Sitemap</a>
  <aside><a href="https://www.facebook.com/acme">
  <img src=fb.png alt=Facebook></a></aside>
</footer>

このような場合にマークアップを選択しても、少なくとも現時点では、実際的な影響はほとんどありません。ブラウザ、検索エンジン、およびその他の関連ソフトウェアはfooter、 、aside、および友人を特定の方法で処理しません。いつの日かそうなるかもしれませんし、要素に「接線的に関連する」コンテンツと ( and)要素asideに「ボイラープレート」コンテンツを含めることが重要になるかもしれません(たとえば、スクリーン リーダーを使用しているユーザーがサイトのボイラープレートを聞いた後に簡単にスキップできるようにするため)一度）。headerfooter

PS 「意味的に優れている」には明確な意味がありません。つまり、空ではないにしても、意味的にあいまいです。ほとんどの場合、HTML コンテキストでは、「意味論的」は実際には「構造的」を意味します。つまり、物事の意味ではなく、ページの構造に関連するものです。実際には、問題は次のように思われます: HTML5 ドラフト (および/または WHATWG HTML) の構造的で、時には学術的な記述をどのように解釈すべきでしょうか?

于 2013-09-24T06:28:11.140 に答える