6

プレゼンテーション タグに関する多くの記事で、さまざまな見解が見られました。すべてのタグがプレゼンテーション用であると考える人もいれば、そうではないと考える人もいます。

<small>例: HTML 5 仕様では、彼らは を表現的とは考えていません。

このタグのリスト (すべて HTML 5 でサポートされているもの) で、どのタグが表示的で、どのタグがそうでないのでしょうか? 

<abbr>

<address>

<area>

<b>

<bdo>

<blockquote>

<br>

<button>

<cite>

<dd>

<del>

<dfn>

<dl>

<dt>

<em>

<hr>

<i>

<ins>

<kbd>

<map>

<menu>

<pre>

<q>

<samp>

<small>

<span>

<strong>

<sub>

<sup>

<var>

どの HTML タグが表示的で、どの HTML タグがそうでないかを誰が決定しますか? また、どのようにその決定を行うのでしょうか? それは W3C のような特に大きなグループですか、それとも Web 開発者のグループ、つまり Web コミュニティに基づいていますか? また、この 2 つの中で、どのタグが表現的かを判断するために従うべきアドバイスはどれですか?

タグが W3C に従って承認された doctype に従って有効である場合、xhtmlどの観点から見てもタグを使用しないことの利点は何ですか?

ユーザー/ユーザビリティ/アクセシビリティの観点から

もっと多くの HTML タグを使用すると、CSS のないページがより良くなります。

開発者の視点で

HTML で使用可能なタグを使用する必要がない場合よりも多くのタグを使用する場合<span class=className">

HTML と CSS の両方のタグよりも、作成に時間がかかり、より多くのチャーター スペースを使用します。

例えば：

使用する代わりに:

<span class="boldtext">Some text<span>

.boldtext {font-weight:700}

以下を使用できます。

<b>Some text<b>

b  {font-weight:700}

見た目がすっきりし、使いやすくなり、使用する文字が少なくなり、ページサイズが小さくなり、ソースが読みやすくなります。また、コンテンツとプレゼンテーションの分離のルールを破ることもありません。

これを行うこともできます：

<b class="important">Some text<b>

b.important  {font-weight:700}

font-weight を変更したいときはいつでもcss、両方の例でのみ変更できます。

タグが、認識されている doctype で w3c によって有効であると見なされる場合、W3C または HTML 仕様によって直接認識されない X/HTML プレゼンテーション タグを使用しないことの利点は何ですか?

HTML を何も変更せずに、デザイン パラメータを変更できますか? これは、コンテンツとプレゼンテーションの分離という考え方に当てはまりますか?

HTML タグが分離の規則に違反している場合、cssプロパティContentも同様に違反していませんか?

この記事を参照してください。

HEIGHT要素のおよびWIDTH属性がIMG許可されているのはなぜですか? 分離のルールを破っていませんか？この問題に関する良い議論はここにあります。

4

3 に答える 3

8

W3C がタグのセマンティクスを決定します。HTML5 の仕様書には、各種タグの使用条件が記載されています。

HTML5

あなたの例を続けるために、次の<b>場合を除き、一部のテキストを太字にすることに問題はありません。

  • 太字になっているテキストは、タグによってすでに表されている単一のエンティティです。

    正しくない：
    <label for="name"><b>Name:</b></label>

    正: (CSS を使用して要素のスタイルを設定します)
    label { font-weight: bold; }
    <label for="name">Name:</label>

  • テキストは、テキスト ブロックのセクションまたは単語に強調と重みを加えるために太字になっています。

    正しくない：
    <p>HTML has been created to <b>semantically</b> represent documents.</p>

    正解: (を使用<strong>)
    <p>HTML has been created to <strong>semantically</strong> represent documents.</p>

以下は、<b>タグの適切な使用例です。

正しい：
<p>You may <b>logout</b> at any time.</p>

<strong>上記の例と適切な例として使用するものとの間に大きな違いはないように思われます。簡単に説明すると、単語は文中で意味的に重要な役割を果たしており、その強調は太字フォントで強化されていますが、ログアウトは単に表示目的で太字になっています。

以下は不適切な使用法です。

正しくない：
<p><b>Warning:</b> Following the procedure described below may irreparably damage your equipment.</p>

正しい: (これは強い強調を追加するために使用されるため、使用します<strong>)
<p><strong>Warning:</strong> Following the procedure described below may irreparably damage your equipment.</p>

使用<span class="bold">はマークアップ臭であり、許可されるべきではありません。この<span>要素は、一般的なプレゼンテーション タグが適用されない場合 (つまり、<b>適用されない場合) にインライン要素にスタイルを適用するために使用されます。たとえば、一部のテキストを緑にする場合:

正しくない：
<p>You will also be happy to know <span class="bold">ACME Corp</span> is a <span class="eco-green">certified green</span> company.</p>

正: (以下の説明)
<p>You will also be happy to know <b>ACME Corp</b> is a <em class="eco-green">certified green</em> company.</p>

<em>ここで、緑という言葉とは対照的に使用したい理由は、ACME Corp が認定された環境に優しい企業であることを強調<span>するために、ここで緑という色が使用されているためです。

<span>以下は、タグの使用の良い例です。

正しい：
<p>You may press <kbd>CTRL+G</hbd> at any time to change your pen color to <span class="pen-green">green</span>.</p>

<em>この例では、単語 green は、強調 ( ) または強い強調 ( )を追加するためではなく、単に色を反映するために緑でスタイル設定されています<strong>。

于 2010-02-14T05:38:01.980 に答える
7

私の意見では、「プレゼンテーション」要素と「構造」要素の違いは常識の問題であり、W3C や他の誰かによって定義されたものではありません。:-P

(見た目ではなく) 内容を記述する要素は、構造要素です。他のすべては、定義上、構造的ではなく、したがってプレゼンテーション要素です。

さて、私はあなたの投稿の 2 番目の部分に答えます。これが論争の的となるトピックであることは理解していますが、とにかく私の考えを話します。

よくできた HTML は、それがどのように見えるべきかを気にするべきではありません。それがスタイルシートの仕事です。スタイルシートに任せるべき理由は、デスクトップ コンピューター用に 1 つのスタイルシートを提供し、ネットブック、スマートフォン、「ダムフォン」(より適切な用語がないため)、Kindles、および (アクセシビリティを気にする場合は、スクリーン リーダーを使用する必要があります。

HTML でプレゼンテーション マークアップを使用すると、これらのさまざまな種類のメディアすべてに特定の「外観」が強制され、そのようなデバイスに最適な外観をデザイナーが選択できなくなります。これは最悪のマイクロマネジメントであり、デザイナーはあなたを嫌うでしょう。:-)

を使用する代わりに、あなたの例を使用するには、大胆さが何を表現することになっているのか<b>を自問する必要があります。セクション タイトルを表現しようとしている場合は、いずれかのヘッダー タグ ( ～) を使用します。強い強調を表現しようとしている場合は、 を使用します。あなたはアイデアを得る。どのようにではなく、何を表現するか。方法はスタイルシートの設計者に任せてください。<h1><h6><strong>

</ソープボックス>

于 2010-02-14T05:37:22.933 に答える
0

プレゼンテーション要素を避けるべきというわけではありません。マークアップは可能な限り意味のあるものにするべきです。ドキュメント構造を設計する場合、デフォルトのスタイル設定は二次的な影響と見なす必要があります。要素が表示のためだけに使用される場合、どの要素が使用されても、それはセマンティックではありません。

の使用例<b>はセマンティックではありません。意味がないから<b>です。<span class="boldtext">また、セマンティックではありません。そのため、それらの使用法は、プレゼンテーションを構造に混ぜ合わせることです。

于 2010-02-14T05:46:51.810 に答える