ホームページ > 記事 > ウェブフロントエンド > HTML ヘッダー tag_html/css_WEB-ITnose
HTML head ブラウザによる Web ページのレンダリングや SEO などに関わる head 部分には多くのタグや要素があり、ブラウザカーネルや国内ブラウザメーカーごとに独自のタグ要素があり、多様性の。モバイルインターネットの時代では、モバイル端末のヘッド構造とメタ要素がさらに重要になります。各タグの意味を理解し、自分のニーズに合った head タグを作成することがこの記事の目的です。この記事は Yishi の記事に基づいており、一般的に使用される head 内の各タグと要素の意味と使用シナリオを紹介するために拡張された概要を提供します。
DOCTYPE (ドキュメント タイプ)、この宣言はドキュメントの先頭、html タグの前にあり、このタグはドキュメントが使用する HTML または XHTML 仕様をブラウザーに伝えます。
DTD (Document Type Definition) 宣言は で始まり、大文字と小文字は区別されず、先頭にコンテンツはありません (スペースを除く) 他のコンテンツがある場合、ブラウザーは IE での Quirks モードのレンダリングを有効にします。ウェブページ。パブリック DTD、名前の形式は、registration //organization // type tag // language です。登録は、組織が国際標準化機構 (ISO) によって登録されているかどうかを指します。+ ははい、- はいいえを意味します。 「組織」は、W3C などの組織の名前です。通常、タイプは DTD です。タグは、指定されたパブリック テキストの説明、つまり、参照されるパブリック テキストの一意の説明名であり、その後にバージョン番号を続けることができます。最終言語は、英語の場合は EN、中国語の場合は ZH など、DTD 言語の ISO 639 言語識別子です。 XHTML 1.0 では 3 つの DTD タイプを宣言できます。それぞれ厳密バージョン、移行バージョン、フレームベースの HTML ドキュメントを表します。
XHTML
1
|
|
HTML 4.01 フレームセット |
|
1
< ;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
JavaScript
1
|
|
書類の有効性を確認します。
1
<メタcharset= "utf-8">
|
XHTML |
1
これら 2 つは同等です、詳細 と のように段階的に読み取ることができるため、覚えやすい短いものを使用することをお勧めします。 。
简体中文
|
|
1
繁体字中国語
XHTML
1
|
|
最新バージョンの IE と Chrome を使用することをお勧めします
XHTML
1
| <メタ http- equiv= "X-UA-Practical" content="IE=edge,chrome=1" />
|
360 ブラウザはこのラベルを取得した後、すぐに に切り替えます。対応するスピードコア。 さらに、念のため追加してください
XHTML
1
|
このように記述することで得られる効果は、Google Chrome Frame がインストールされている場合、GCF がページのレンダリングに使用されます。GCF がインストールされていない場合、IE カーネルの最新バージョンがレンダリングに使用されます。 関連リンク: ブラウザ カーネル制御 メタ タグのドキュメント Baidu はトランスコーディングを禁止していますBaidu 携帯電話で Web ページを開くと、Baidu は Web ページをトランスコードし、服を脱いで体に貼り付ける可能性があります 犬の皮膚絆創膏の広告の場合、
XHTML
SEO 最適化部分 ページ タイトル |
1
| <タイトル> title
|
XHTML
| ページの説明コンテンツの説明
|
meta name="description" content="your description">
XHTML
1 |
|
XHTML
1
|
|
viewport を使用すると、モバイル ブラウザーでのレイアウト表示を改善できます。 通常は
XHTML
|
|
width ビューポートの幅 (値/デバイスの幅)
height ビューポートの高さ (値/デバイスの高さ)
XHTML
| <メタname= "viewport" content="width=device-width、initial-scale=1、minimal-ui">
1
|
|
iPhone 6 および iPhone 6plus に適応させるには、次のように記述する必要があります:
>
iOS デバイス
ホーム画面に追加後のタイトル (iOS 6 の新機能)
|
|
WebApp フルスクリーン モードを有効にするかどうか
XHTML
1 |
ステータスバーの背景色を設定します
XHTML
content パラメータ: defaultデフォルト値。
XHTML
iOS アイコン rel パラメータ: apple-タッチアイコン画像に角丸やハイライトなどの効果を自動で加工します。 apple-touch-icon-precomposed は、システムがエフェクトを自動的に追加することを禁止し、元のデザインを直接表示します。 iPhone および iTouch、デフォルトは 57×57 ピクセル、必須です
1
<リンク相対="apple-touch-icon-precomused" href="/apple-touch-icon-57x57-precommoted.png" />
| Retina iPhone および Retina iTouch、114×114 ピクセル、オプションですが推奨 XHTML
1
XHTML
に追加する必要があります。
iPad の起動画面にはステータスバー領域は含まれません。 iPad ポートレート 768 x 1004 (標準解像度)
XHTML
iPad 横長 2048×1496 (Retina)
|
iPhone/iPod Touch 竖屏 640×960 (Retina)
XHTML
XHTML
XHTML
XHTML
1 2
|