web-dev-qa-db-ja.com

「意味的に正しい」とはどういう意味ですか？

私はそれをCSSトークでたくさん見ました。意味的に正しいとはどういう意味ですか？

htmlcssterminology
30
johnny

正しくラベル付けする

それはあなたがそれが実際に何であるかを何かと呼んでいることを意味します。古典的な例は、何かがtableである場合、データの行と列を含める必要があるというものです。これをレイアウトに使用することは意味的に正しくありません。そうでない場合は「これはテーブルです」と言っています。

別の例：リスト（<ul>または<ol>）は、通常、類似したアイテム（<li>）をグループ化するために使用する必要があります。あなたcouldグループにdivを使用し、各アイテムに<span>を使用し、各spanを箇条書きの別々の行に配置します、そしてそれはあなたが望むように見えるかもしれません。しかし、「これはリストです」はより多くの情報を伝えます。

HTMLの背後にある理想に適合

HTMLは "HyperText Markup Language"の略です。その目的は、コンテンツをマークアップまたはラベル付けすることです。正確にマークアップすればするほど良いです。 HTML5には、ヘッダーやフッターなどの一般的なWebページパーツをより正確にラベル付けするための新しい要素が導入されています。

それをより便利にします

このセマンティックラベリングはすべて、マシンがコンテンツを解析するのに役立ち、ユーザーに役立ちます。例えば：

  • あなたの要素が何であるかを知ることareブラウザはそれらがどのようにあるべきかについて賢明なデフォルトを使用することができます見た目と振る舞い。つまり、カスタマイズ作業が少なくて済み、さまざまなブラウザで一貫した結果が得られる可能性が高くなります。
  • ブラウザはCSS（Cascading Style Sheets）を正しく適用して、各タイプのコンテンツがどのように見えるかを記述できます。別のスタイルを提供することも、ユーザーが独自のスタイルを使用することもできます。要素に意味的にラベルを付けている限り、「見出しを大きくしたい」などのルールを使用できます。
  • 視覚障害者向けのスクリーンリーダーは、論理セクションがfieldsetsに分割され、各セクションに1つのlegendがある場合、フォームに簡単に入力できるようになります。目の見えないユーザーは、legendのテキストを聞いて、目の見えるユーザーが読むのと同じように、「ああ、このセクションをスキップできます」と判断できます。
  • 携帯電話は、type="tel"（電話番号用）のフォーム入力を見ると、数字キーボードに切り替えることができます。
46
Nathan Long

意味論は基本的に「意味の研究」を意味します。

通常、人々がコードが意味的に正しいことについて話しているとき、彼らは何かを厳密に説明するコードを指します。

（x）HTMLには、含まれるコンテンツに意味を与える特定のタグがあります。例えば：

H1タグは、含まれるデータをレベル1の見出しとして記述します。 H2タグは、含まれるデータをレベル2の見出しとして記述します。この背後にある暗黙の意味は、H1の下の各H2が何らかの方法で関連していることです（つまり、見出しと小見出し）。

セマンティックな方法でコーディングする場合、基本的には、記述しているデータに意味を与えます。

セマンティックVS非セマンティックの次の2つのサンプルを検討してください。

<h1>Heading</h1>
<h2>Subheading</h2>

VS非意味的同等物：

<p><strong>Heading</strong></p>
<p><em>Subheading</em></p>

時々、「あなたは今セマンティクスを話しているだけです」と議論している人々を聞くかもしれません、そしてこれは通常他の人と同じ意味を言うが異なる言葉を使う行為を指します。

20
Jamie Dixon

"要素の意味的に正しい使用法は、要素が意図された目的に使用されることを意味します。つまり、表形式のデータにはテーブルを使用しますが、レイアウトには使用しないことを意味します。つまり、リストを使用することを意味します。物事をリストするため、テキストを強調するためのstrongとemなど。 "

差出人： http://www.codingforums.com/archive/index.php/t-53165.html

10
cakeforcerberus

HTML要素には意味があります。 「意味的に正しい」とは、要素が平均想定されていることを意味します。

たとえば、定義リストはコード内の<dl>リストで表され、省略形は<abbr>sなどです。

2
Triptych

これは、HTML要素が適切なコンテキストで使用され（テーブルが設計目的で使用されるのとは異なり）、CSSクラスに人間が理解できる方法で名前が付けられ、ドキュメント自体がスクリーンなどの非ブラウザークライアントで処理できる構造を持っていることを意味します。 -リーダー、ドキュメントから情報とその構造を抽出しようとする自動パーサーなど。

たとえば、リストを使用してメニューを作成します。このようにして、障害者向けのスクリーンリーダーは、これらのリストアイテムが同じメニューレベルの一部であることを認識し、ユーザーが選択できるように順番に読み取ります。

1
user151323

純粋なCSSのコンテキストでは聞いたことがありませんが、CSSとHTMLについて話すときは、適切なタグを使用し（たとえば、非表形式のデータにtableタグを使用しないようにする）、クラスに適切な値を提供することを意味します含まれているデータが何であるかを識別するid（および必要に応じて microformats を使用）など。

人間（すべてが適切に表示される）とコンピューター（すべてが適切に識別され、マークアップされる）がデータを理解できるようにすることがすべてです。

0
Thomas Owens