HTML入門トレーニング

head要素

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
HTMLがどのようにレンダリングされるべきか、外部スタイルやスクリプトへの参照はどうか、といった情報を含む、head要素について学びます。
講師:
07:20

字幕

このレッスンではHTMLがどうのように レンダリングされるべきか 外部スタイルやスクリプトへの参照はどうか と言った情報を含む`, ヘッド要素について学びます HTMLの開始タグの直後には 通常ヘッドタグを入力します このヘッドタグの中身には ブラウザは、ドキュメントを どのようにレンダリングすべきか と言った情報が入ります 画面ではサンプルファイルをコードエディタ ブラケッツで開いてる所です あなたがブラケッツ以外のエディタをお使いの 場合は、別のエディタで開いても構いません 現在、サンプルファイルには ドキュメントタイプ宣言が 入力されているところです そのため、次には、まず、 HTMLタグを入力しましょう 左向きの山型カッコと、HTMLと入力し 右向きの山型カッコでタグを閉じます ブラケッツのように、タグの保管が 効くコードエディタでは 開始タグを入力したと同時に、 対応するその終了タグが自動的に 入力されることがあります ここでは、開始タグを入力すると HTMLの終了タグが自動的に 入力されましたので ここで改行を入力しておきます これでHTMLタグが用意できましたが、 ここで、一つの属性を追加します 属性を追加するには、タグの名前の後に 山型カッコの前に半角スペースを入力し、 属性の名前を入力します ここでは属性の名前はラング(lang) 言語示すlangリッチ属性、 langを入力します ラングはこのHTMLがどのような 言語で書かれているか それを示すものです ここでは日本語で入力していきますので、 日本語を示すja、ジャパニーズの j a という文字を入力します これでHTMLが日本語の言語を使って、 書かれている、という指定になります 続いて、ヘッド要素を入力しましょう ヘッドも同じように 山型カッコで囲み、開始タグと 終了タグを入力します ヘッド要素の中では、このHTMLが どのような文字エンコーディングで 書かれているか ということを規定していきます ここではmetaタグを使います metaタグは同じように metaと入力した後に、スペースを入力し 文字エンコーディングを 指定する為には属性名として キャラセット、c h a r s e t という文字を入力し 先ほどのlang属性と同じように、 記号のイコールとダブルクォーテーション 2つで値を挟みます ダブルクォーテーションの間に入れる値は、 ここでは utf‐8 という値です タグを閉じるために山型カッコを入力するのも 忘れないようにしましょう utf‐8はその中に日本語でも、 英語でも、 あるいは、例えばロシア語でも、 様々な言語を含めることが 出来る文字エンコーディングです そのため、文字エンコーディングの事実上の 標準として用いられることが多くあります 文字エンコーディングについては サーバー側で指定することも出来ます しかし、HTMLの内部で指定しておけば、 このHTMLがどのような 文字エンコーディングで書かれているか ということが明らかになりますので、 HTMLの中にこのように metaタグを使って文字エンコーディングの 指定を含めることをお勧めします さて、通常、HTMLのタグは 開始タグと終了タグで構成されていました しかし、metaタグについては そのタグの中に何かの値を 持つわけではありませんので このように終了タグを省略して、 開始タグだけで表現することが出来ます metaタグのように、一部のタグでは 終了タグが不要なタグもあります このように、タグによって終了タグのあり、 無しは存在しますので、注意しましょう 次に、同じmetaタグを使って、 このページの概要を記述します ページの概要を指定するには、 同じようにmetaタグを使い 今度は属性に”ネーム”という属性を使います ここの値ではどのような概要を定義するか、 という情報を与えますので ”ディスクリプション”と入力します さらに、その後に、スペースを入力し、 実際の概要の値を入力します 概要の値はコンテンツと属性に入力します ここでは実際の値を基本的な HTMLドキュメントについて 学ぶページとしておきましょう 最後は、右向きの山型カッコで metaタグを閉じます このように記述することで、 このHTML全体の概要は 基本的なHTMLドキュメントについて 学ぶページであるという指定になります このディスクリプションに入力された値は 検索エンジンの結果などにも使われます そして、最後にタイトルタグを使って、 このページのタイトルを入力しましょう タイトルタグは通常のHTMLタグと同様に 開始タグと終了タグで構成します その間にタイトルを値として入力しましょう これは基本的な HTMLドキュメントと入力します こうすることで、このHTMLのタイトルは 基本的なHTMLドキュメントと、 という文字列に設定され、 実際にこのHTMLを表示する ブラウザーのタブなどに表示されます それでは、ここまで書いてきたHTMLを 実際にブラウザーで表示してみましょう ブラウザーで表示出来ました 実際には何も表示されていませんが、 先ほど入力したタイトルがブラウザーの タブに表示されるなどしています このようにヘッドタグの 内側に書かれた情報は、 このHTMLのタイトルやHTMLが どのようにレンダリングされるべきか と言った内部的な情報が 入っているということになります このレッスンでは行いませんでしたが、 外部ファイルのスタイルシートや javaスクリプトにリンクしたり、 読み込んだり、と言ったことも出来ます このレッスンではHTMLが どのようにレンダリングされるべきか、 外部スタイルやスクリプトへの参照はどうか、 と言った情報を含む、 ヘッド要素について学びました

HTML入門トレーニング

HTMLはWebページを作るうえでもっとも重要な言語です。これがきちんと定義されなければ、Webページは正しく表示されません。このコースではHTMLの成り立ちから基本的な構文の書き方、さまざまなタグの意味やその使い方まで幅広い内容を学ぶことができます。またHTMLと並んで重要な言語であるCSSやJavaScriptについても、それぞれその概要を説明します。

5時間43分 (48 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 3,990
発売日:2015年05月01日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。