「<HEAD>に何を書くの?」の編集履歴(バックアップ)一覧はこちら
「<HEAD>に何を書くの?」(2013/04/18 (木) 01:11:24) の最新版変更点
追加された行は緑色になります。
削除された行は赤色になります。
<p> </p>
<p><strong><span style="font-size:larger;"><HEAD>について考えてみよー</span></strong></p>
<div> </div>
<div>ひとまず、</div>
<div>HTMLにてホームページ(HTML)が作成できるように</div>
<div>なったけど・・・</div>
<div><HEAD>等に何を書いたらいいのかよくわからん。。。</div>
<div> </div>
<div>っというので調査してみる。。。</div>
<div> </div>
<div><span style="font-size:larger;"><strong>0.<head>の前に...</strong></span></div>
<div> </div>
<div><strong>0-1 DOCTYPE(ドキュメントタイプ)について</strong></div>
<div>HTMLは現在一般的に普及しているのはHTML4.01らしいが、</div>
<div>作成するホームページにおいて</div>
<div>どのバージョンのHTMLで記述されているかをDOCTYPEにて宣言する必要がある。</div>
<div> </div>
<div>また、このDOCTYPE宣言により、各種ブラウザのレンダリングモードが異なります。</div>
<div>レンダリングモードには大きく3種類分かれます。</div>
<div> </div>
<div>標準モード … CCSなどの指定を仕様どおりに解釈し、表示するモード</div>
<div>互換モード … CSS普及していなかった頃との互換のためにあえて標準モードと異なる解釈し、表示するモード</div>
<div>中間モード … 上記2つの中間。</div>
<div> </div>
<div>(ちなみにレンダリングモードとはコンピュータがソースを解釈し描画することです。)</div>
<div> </div>
<div>上記を参考にすると</div>
<div>標準モードで表示させればいいわけなので・・・</div>
<div>HTMLクイックリファレンス</div>
<div>http://www.htmq.com/htmlkihon/302.shtml</div>
<div>を参考にして以下でOK?かな??</div>
<div> </div>
<div>例)HTML4.01 フレームセット</div>
<div><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd"></div>
<div> </div>
<div> </div>
<div><strong>0-1 使用言語(主言語)を指定しよう</strong></div>
<div>HTML4.0から導入されている"lang"属性にて使用する言語を指定しよう。</div>
<div>"lang"属性には</div>
<div>・使用言語</div>
<div>・国コード</div>
<div>を指定する必要があります。●●-▲▲の形式にて指定することが可能です。</div>
<div>(●●=使用言語、▲▲=国コード)</div>
<div> </div>
<div> </div>
<div>例) 日本で使われている(国コード)、日本語。</div>
<div><html lang="ja-jp">~</html></div>
<div>(※ちなみに日本で使われるの当たり前なので<html lang="ja">の様に省略することも可能です。)</div>
<div> </div>
<div>なお、</div>
<div>Google翻訳等の自動翻訳では上記の"lang"属性を確認し、翻訳に使用しているので</div>
<div>海外を意識するような場合は特に注意が必要です。</div>
<div> </div>
<div> </div>
<div><strong><span style="font-size:larger;">1.
<meta>タグを使用しよう</span></strong></div>
<div> </div>
<div><meta>タグはその文書に関する情報(メタ情報)を指定して、 </div>
<div>ブラウザや検索ロボットに知らせるためのタグです。</div>
<div>制作者やキーワード等の情報をname属性で定義して、 content属性でその値を指定します。</div>
<div> </div>
<div><strong>1-1 メタ情報って</strong></div>
<div>メタ情報(データ)とは情報に関する情報。</div>
<div>メタとは...例を挙げる方がわかり易いので以下に記載します。</div>
<div>例)</div>
<div>メタ学習 ... 学習をするための学習(勉強の取り組み方等を勉強するとか...)</div>
<div>メタ理論 ... 理論を理解するための理論(前提となる理論とか...)</div>
<div> </div>
<div><strong>1-2 検索ロボットって</strong></div>
<div>検索ロボット(クローラ)とは</div>
<div>全文検索型のサーチエンジンの検索データベースを作成するために</div>
<div>Webページの情報を回収するプログラムのこと(なかなかのネームセンスwww)。</div>
<div> </div>
<div>つまり、この検索ロボットに正しく情報を提供することによって検索データベースに登録され</div>
<div>ユーザの検索に対する要求に応答しているってこと?(たぶん)。</div>
<div> </div>
<div>以下を参照。</div>
<div>http://pst.co.jp/powersoft/html/index.php?f=5331</div>
<div> </div>
<div><strong>1-3 <meta>を記載しよう</strong></div>
<div><meta>を使用するにあたり最低限必須と思われる内容を記載します。</div>
<div>・文字コードの指定</div>
<div>例) HTML文書がシフトJISだったら</div>
<div><meta http-equiv="Content-Type" content="text/html;
charset=shift_jis"></div>
<div> </div>
<div>・文書の説明・キーワードの指定</div>
<div>例)HTML入門ページなら・・・キーワードは・・・</div>
<div><meta name="description" content="HTML入門用ページ"></div>
<div><meta name="keywords" content="HTML,CSS,CUNIT"></div>
<div> </div>
<div>・文書の作成者</div>
<div>例)wildbadgerさんが作成。</div>
<div><meta name="author" content="wildbadger"></div>
<div> </div>
<div>・その他</div>
<div>キャッシュの制御・有効期限や検索ロボットの制御等が行えます。</div>
<div>(ただし、対応するものだけっぽい。。。)</div>
<div> </div>
<div>本日は以上!!</div>