あなたのHTMLタグと属性セマンティック

あなたのHTMLタグと属性セマンティック

プレゼンテーションから構造を分離するもう一つの重要な側面は、文書の内容を構造化するために、セマンティックマークアップを使用しています。それは、コンテンツの一部は、構造の対応するセンスでマークされていることを意味XHTMLの要素があり、他のマーカーを使用する理由はありません。言い換えれば、そのようなの<div>の代わりに<p>タグのタイトルとして、他のHTML要素のようなHTML要素の外観を、作るためにCSSをさせてください。

まず、個人的に、私は彼の主な目的は、誰もが直感的にタグ（マークアップ）と属性（属性）のを知っているようにと思い、デフォルトのスタイルは、いくつかの共通のタグブラウザ設定の現れである、セマンティクス（意味論）とデフォルトのスタイルの違いについてです目的と効果は、彼らが大胆かつ大きなフォントサイズを持っているので、Hxのシリーズは、タイトルによく似ていることは明らかです。他の文字と区別するための<strong>、<em>の、強調役割を果たしました。リストやテーブルに関しては、明らかに彼らが何をしているかを教えてくれ。

第二に、最も重要なのは、検索エンジンフレンドリーで、Webコンテンツの優れた構造と意味が簡単に自然な検索エンジンをクロールされ、あなたのウェブサイトを宣伝セマンティックWebのメリットは、多くの労力を節約することができるようになります。

具体的な意味と、XHTML1.0タグが参考文献に記載されているでの使用には、いくつかの簡単には忘れたり、TAGSと補足プロパティを混同することがあるでしょう。

<Hxを>

<H1>、<H2>、 <H3>、<H4>、<H5>、<H6>、 タイトルとして使用され、重要度の降順。<H1>は最高の評価です。
例えば：

CODE：
<H1>ドキュメントのタイトル</ H1>
<H2>二次タイトル</ H2>

代わりに
<DIV CLASS =「タイトル」>ドキュメントのタイトル</ DIV>、<スパンクラス=「タイトル」>ドキュメントのタイトルまたは</スパン>。後者の場合には、検索エンジンは、彼が向かっているということではないことは明らかです。

<P>

段落記号は、段落として、新しい行を使用しない<P>を知って、それが<BR/>は、段落と段落を区別する必要はありません。<P> </ P>はテキストが折り返され、その効果はラップ<BR>よりも優れています。段落と段落の間のギャップにも簡単に、コントロールにCSSを使用して明確に段落と段落を区別することができます。容易に高いライン（行高さ）を使用して走行距離を定義し、ドロップキャップと他の効果を定義では、それは非常に完全です。
例えば：

CODE：
<メインコンテンツと通信するために設計されたWeb開発、ウェブサイトの作成技術を導入するために、P-構築するサイトの設計と開発スタッフの家へ。そのうまく作られたウェブサイトのコンテンツは、ヘルプのユーザーが実行するだけでなく、多くのデザインコンペを開催し、現在も毎日多くのWebアプリケーションで使用される手順の数を開発し無私無欲に、チュートリアル精巧なリリースのメンバーが存在します。専門家のメディアの注目と賞賛の数だけでなく、設立され、自分の社会的地位からの作業とレビューの分布、そのネットワークの同僚のバッチ後のバッチは、最大クラスのサイトのデザインになるために青色のビジョンに参加します1。 
</ p型>
<p型>は長年にわたり、常に青の理想の内容を豊かに、それはあまりにもよく知られているサイトで、伝統的なメディアのハイライトの数となっている、と他のはグーグル、Baiduの、ヤフー、捜狐、シーナ、エキサイトや他の主要検索サイトでしたコレクションとGoogle、百度、簡体字中国語の文字のキーワード「Webデザインと開発」には3つの主要検索エンジンYahooは検索ランキングは最初のもので、現在は国内および専門のウェブサイトの開発のために設計された、最も影響力のある青色の理想的なサイトへと発展してきました1。<

<UL>、<OL>、<LI>

<UL>順不同リスト、それは<オール>順序付きリスト、広く使われているすべての人に共通しているにも非常に一般的です。ウェブ標準化プロセスでは、<UL>また、複数のナビゲーションバーのために、ナビゲーションバーはもともとリストで、これは完全に正しい、とするとき、あなたのブラウザがCSSをサポートしていない、とナビゲーションリンクはまだ良いですそう、それは非常にきれいな側面ではありません。
例えば：

CODE：
<UL>
    <LI>プロジェクト</ LI>
    <LI>プロジェクトII </ LI>
    <LI>プロジェクトIII </ LI>
</ UL>

CODE：
<OL>
    <LI>章</ LI>
    <LI>章</ LI>
    <LI>章</ LI>
</ OL>

あなたのHTMLタグと属性セマンティック

プレゼンテーションから構造を分離するもう一つの重要な側面は、文書の内容を構造化するために、セマンティックマークアップを使用しています。それは、コンテンツの一部は、構造の対応するセンスでマークされていることを意味XHTMLの要素があり、他のマーカーを使用する理由はありません。言い換えれば、そのようなの<div>の代わりに<p>タグのタイトルとして、他のHTML要素のようなHTML要素の外観を、作るためにCSSをさせてください。

まず、個人的に、私は彼の主な目的は、誰もが直感的にタグ（マークアップ）と属性（属性）のを知っているようにと思い、デフォルトのスタイルは、いくつかの共通のタグブラウザ設定の現れである、セマンティクス（意味論）とデフォルトのスタイルの違いについてです目的と効果は、彼らが大胆かつ大きなフォントサイズを持っているので、Hxのシリーズは、タイトルによく似ていることは明らかです。他の文字と区別するための<strong>、<em>の、強調役割を果たしました。リストやテーブルに関しては、明らかに彼らが何をしているかを教えてくれ。

第二に、最も重要なのは、検索エンジンフレンドリーで、Webコンテンツの優れた構造と意味が簡単に自然な検索エンジンをクロールされ、あなたのウェブサイトを宣伝セマンティックWebのメリットは、多くの労力を節約することができるようになります。

具体的な意味と、XHTML1.0タグが参考文献に記載されているでの使用には、いくつかの簡単には忘れたり、TAGSと補足プロパティを混同することがあるでしょう。

<Hxを>

<H1>、<H2>、 <H3>、<H4>、<H5>、<H6>、 タイトルとして使用され、重要度の降順。<H1>は最高の評価です。
例えば：

CODE：
<H1>ドキュメントのタイトル</ H1>
<H2>二次タイトル</ H2>

代わりに
<DIV CLASS =「タイトル」>ドキュメントのタイトル</ DIV>、<スパンクラス=「タイトル」>ドキュメントのタイトルまたは</スパン>。後者の場合には、検索エンジンは、彼が向かっているということではないことは明らかです。

<P>

段落記号は、段落として、新しい行を使用しない<P>を知って、それが<BR/>は、段落と段落を区別する必要はありません。<P> </ P>はテキストが折り返され、その効果はラップ<BR>よりも優れています。段落と段落の間のギャップにも簡単に、コントロールにCSSを使用して明確に段落と段落を区別することができます。容易に高いライン（行高さ）を使用して走行距離を定義し、ドロップキャップと他の効果を定義では、それは非常に完全です。
例えば：

CODE：
<メインコンテンツと通信するために設計されたWeb開発、ウェブサイトの作成技術を導入するために、P-構築するサイトの設計と開発スタッフの家へ。そのうまく作られたウェブサイトのコンテンツは、ヘルプのユーザーが実行するだけでなく、多くのデザインコンペを開催し、現在も毎日多くのWebアプリケーションで使用される手順の数を開発し無私無欲に、チュートリアル精巧なリリースのメンバーが存在します。専門家のメディアの注目と賞賛の数だけでなく、設立され、自分の社会的地位からの作業とレビューの分布、そのネットワークの同僚のバッチ後のバッチは、最大クラスのサイトのデザインになるために青色のビジョンに参加します1。 
</ p型>
<p型>は長年にわたり、常に青の理想の内容を豊かに、それはあまりにもよく知られているサイトで、伝統的なメディアのハイライトの数となっている、と他のはグーグル、Baiduの、ヤフー、捜狐、シーナ、エキサイトや他の主要検索サイトでしたコレクションとGoogle、百度、簡体字中国語の文字のキーワード「Webデザインと開発」には3つの主要検索エンジンYahooは検索ランキングは最初のもので、現在は国内および専門のウェブサイトの開発のために設計された、最も影響力のある青色の理想的なサイトへと発展してきました1。<

<UL>、<OL>、<LI>

<UL>順不同リスト、それは<オール>順序付きリスト、広く使われているすべての人に共通しているにも非常に一般的です。ウェブ標準化プロセスでは、<UL>また、複数のナビゲーションバーのために、ナビゲーションバーはもともとリストで、これは完全に正しい、とするとき、あなたのブラウザがCSSをサポートしていない、とナビゲーションリンクはまだ良いですそう、それは非常にきれいな側面ではありません。
例えば：

CODE：
<UL>
    <LI>プロジェクト</ LI>
    <LI>プロジェクトII </ LI>
    <LI>プロジェクトIII </ LI>
</ UL>

CODE：
<OL>
    <LI>章</ LI>
    <LI>章</ LI>
    <LI>章</ LI>
</ OL>

<DL>、<DT>、<DD>

DLは「定義リスト」です。例えば、辞書の説明内部の言葉が、あなたは、このようなAリストの定義を使用することができます。
例えば：

CODE：
<DL>
<DT>犬</ DT>
<DD> A肉食哺乳類家族のイヌ科</ DD>
</ DL>

CODE：
<DL>
    <DT>ビーチでの</ DT>
    <DD>これは1980年に撮影された、香港の「浜」は最も古典的なドラマ、テレビの歴史の中で最も成功したと呼ばれます。
    香港での放送年後、巨大な話題になります。</ DD>
    <DT>（チョウ・ユンファ）</ DT>
    <DD>とチョウ・ユンファのようにすべての偉大な映画スターは時代、香港映画の黄金時代を確認。
ウインドブレーカーサングラス、冷血銃、晴れた笑顔は、フィルムに封入されている、我々は戻って見て時間を見つけることを願っていたときに、チョウは、時代を調整するカットされています。</ DD>
</ DL>

<引用>、<Q>、<BLOCKQUOTE>、引用

フォーラムとは、多くの場合、<Q>マークを簡単に1行の参照を持つ他人の言葉に関連して使用されるブログ。Webブラウザが自動的に<Q>の間でコンテンツを識別します。残念ながら、IEが認識されない、そして時には、<Q>は、いくつかの問題アクセシビリティ（アクセス）が発生することができます。このため、一部の人々は<Q>を使用しないことをお勧めし、手動で基準マークを挿入します。<span>を参照されるコンテンツの適切なクラスを含む単一の行に参加し、その後、あなたはリファレンスデザインにスタイルにCSSを使用することができますが、これは意味論上の意味がありません。あなたはマーク・ピルグリムは（でQタグを書いて読むことができますhttp://diveintomark.org/archives/2002/05/04/the_q_tag  プロセス<Q>関連問題に関する）見解。
長さで引用された段落または複数の段落の方のために、あなたは<BLOCKQUOTE> A使用する必要があります。CSSはスタイルの参照を定義するために使用することができます。記事のセクションでは、<BLOCKQUOTE>、コンテンツ参照はまた、通常、<P>、要素内に含まれていなければならない上に直接ではないことに注意してください。引用属性は一緒に<Q>で使用することができる、また、<BLOCKQUOTE>、送信元アドレスが提供される参照コンテンツに使用されていると共に使用することができます。あなたが<span>の代わりに<Q>タグ参照の内容を使用している場合、その後、あなたが属性を引用使用することはできません。例えば：

CODE：
</引用> Web標準を使用した設計を<引用>ジェフリー・ゼルドマンによって優れた本です。

CODE：
<P> </引用>孔子<アウフ引用>読み：何も考えずに<Q>は無用な学習で、学習のない思考が危険な</ Q> </ P>です 。

CODE：
W3Cがそれを言う<P> <qは= "http://www.w3.org/TR/REC-html40/引用
構造体/ text.html＃H-9.2.1を">句要素のプレゼンテーションは
に依存ユーザエージェント。</ Q>。</ P>

CODE：
<BLOCKQUOTEアウフ引用=「http://www.w3cn.org/」>
    <p型>＆＃8220;私たちのほとんどは、我々は単にサイト上に作成し、ブラウザの主流のバージョンがアップグレードするたびに深い経験を、持っています時代遅れになることがあり、
我々は再びアップグレードする必要があるか、再工事現場。例えば1996-- 1999典型的な「ブラウザ戦争」は、
NetscapeとIEとの互換性があるように、サイトには、両方のブラウザのために異なるコードを書かなければなりませんでした。同様に、
新しいネットワーク技術や双方向サービスの出現は、我々はまた、新しいバージョンを作成する必要があるたびに、この新しい技術や新しい機器をサポートしなければならない
、そのようなWAPモバイルインターネット技術のためのサポートとして。同様の問題がたくさんある：ウェブサイトのコードは、肥大化した複雑なコスト私たちに多くの帯域幅、
潜在的な顧客の一部を遮蔽し、ブラウザのDHTML効果のいくつかの種類のために、コードを使用することは容易ではなく、障害を持つ人々は、閲覧ウェブサイトできません。
これは、悪循環である巨大な廃棄物です。＃8221＆; </ P>
</ BLOCKQUOTE>

<em>の、<強いです>

<EM>は強調するために使用される、の<strong>強調の焦点として使用されています。それはコンテンツ重視、最良の方法は、彼らのパフォーマンスを定義するためにCSSを使用する方法を決定することである場合、コンテンツに重点を表示大胆なコンテンツを強調するためにイタリック体のほとんどのブラウザでは、しかし、これは必要ありません。あなたが本当にしたい場合は、視覚効果で、ストレスを使用しないでください。あなたが強調するだけでなく、大胆な感じにしたいか、イタリックは何の視覚効果は、良いので、中国のために特にイタリック体でない場合と、あなたは結果を達成するため強調するために、他の多くの目を引くスタイルの数を定義することができます。
例えば：

CODE：
<P> <EM>強調</ em>のテキストは、通常はイタリックで表示されている、
しかし、の<strong>通常は太字で表示</ strong>を強調しました。</ P>

<TABLE>、<TD>、<TH>、<キャプション>、要約

XHTMLテーブルがレイアウトで使用すべきではありません。我々はマークデータのリストにある場合は、あなたは、テーブルを使用する必要があります。<番目>表の見出しのために、プロパティは、テーブルヘッドの説明省が主導要約、<キャプション>タグ、<THEAD>タグをsummar、<TBODY>タグは、テーブルの終わりのための主要なコンテンツ、<TFOOT>タグを形成します。
スコープ属性ヘッダを置換するために使用することができる場合、以下のように各値の内容であり、それは、ヘッダ情報を含むセルをマーキングも使用することができる：
　行は、セルの現在の行を含むヘッダーに関連する情報を提供し、現在のセルを示しています。
　指定された列によれば、現在のセルの対応するヘッダ情報を提供するために、現在のセルを示すCOL、。
　現在のセルを示すrowgroupは、現在のセルを含むヘッダ行グループの残りの部分に関連する情報を提供します。
　現在のセルで指定された残りの列グループに応じて対応するヘッダ情報を提供するために、現在のセルを示すCOLGROUP。
プロパティが定義されていない場合、セルの内容は、省略形をデフォルトになり、セル内のヘッダのために定義された省略名を略称。
例えば：

 

コード：

<表には、ID = "mytableは" CELLSPACING = "0"要約= "アップルのPowerMac G5シリーズの技術仕様">
<キャプション>表1：のPower Mac G5の技術仕様</キャプション>
  <TR>
    <番目のスコープ= "COL "略称="設定」クラス= "nobg">設定</目>

    <TH範囲= "COL"略称= "デュアル1.8">デュアル1.8GHzの</番目>
    <TH範囲= "COL"略称= "デュアル2">デュアル2GHz </番目>
<TH範囲= "COL"略称= "デュアル2.5">デュアル2.5GHz帯</番目>
  </ TR>
  <TR>
    <TH範囲= "行"略称= "モデル"クラス= "スペック">モデル</番目>
    <TD> M9454LL / A </ TD>

    <TD> M9455LL / A </ TD>
    <TD> M9457LL / A </ TD>
  </ TR>
  <TR>
    <TH範囲= "行"略称= "G5プロセッサ"クラス= "specalt"> G5プロセッサ</第>
    <TDクラス= "ALT">デュアル1.8GHzののPowerPC G5 </ TD>
    <TDクラス= "ALT">デュアル2GHzのPowerPC G5 </ TD>

    <TDクラス= "ALT">デュアル2.5GHz帯のPowerPC G5 </ TD>
  </ TR>
  <TR>
    <TH範囲= "行"略称= "フロントサイドバス"クラス= "スペック">フロントサイドバス</番目>
    < </ TD>プロセッサあたりTD> 900MHzの
    <TD> 1GHzのプロセッサ当たり</ TD>
    <TD>プロセッサあたり1.25GHz </ TD>

  </ TR>
  <TR>
    <TH範囲= "行"略称= "L2キャッシュ"クラス= "specalt">レベル2キャッシュ</番目>
    <TDクラス= "ALT">プロセッサあたり512K </ TD>
    <TDクラス= "ALT"> </ TD>プロセッサあたり512K
    <TDクラス= "ALT">プロセッサあたり512K </ TD>
  </ TR>

</ TABLE>

<DFN>

CODE：
<P> <DFNタイトル= "MicrosoftのWebブラウザ"> Internet Explorerが</ DFN>水中を使用される最も人気のあるブラウザです。</ P>。

<イン>、<デル>

デルのノウハウは、再利用、<S>デル明確に、よりセマンティックを持つ行を削除しません。しかし、また、デルで引用し、日時削除理由を示すために、時間の削除。インが挿入され、また、そのような特性を有します。新しいビルドフロントエンドの学習qun438905713、グループのほとんどは、ゼロベースの学習者である、私たちはお互いにお答えし、また学習教材の多くを準備するために、お互いを助けるには、為替のゼロベースのジュニアパートナーを歓迎しました。

例えば：

CODE：
。<P>これは本当に<イン引用= "rarara.html"日時= "20031024">非常に</イン>よかった。</ P>
<コード>

表現は、コンピュータコードです。戦いのためのデフォルトのフォントスタイル。フォーラムやブログしばしば遭遇。
例えば：

CODE：
<コード> P {マージン：2ピクセル0;} </コード>

<略称>、<略語>

<略称>タグは頭字語を取るために、<acronym>のタグ、Webページ上に呼ばれています。（注：これは略称別の用語と略語、略称より大きい短距離、頭字語の収縮である
ライト<略語>タグに）以下IE6.0ブラウザのWindowsは、<略語>タグをサポートしていません。IEでは、あなたは、<acronym>のにCSSを使用することができますが、<略称>タグに適用することができない、
title属性<acronym>のタグディスプレイ用のIEの意志プロンプトが、<略称>タグを無視します。