HTMLとは
HTMLとは、ウェブページを作成するためのマークアップ言語です。以下のようなタグを階層的に記述することでウェブページ内の文章と構造が指定されます。
詳しい要素の解説は「HTML・XHTMLリファレンス」をご覧ください。
- html
- head … 画面に表示する内容以外の情報
- title(タイトル)
- meta(メタデータ)
- link(CSSへのリンク)
- style(JavaScriptへのリンク)
- body … 本文を構成する情報
- h1~h6(見出し)
- p(段落)
- ul、ol、li(リスト)
- その他
HTML・XHTMLの書き方のルール
HTML・XHTMLの文書構造はタグで記述され「要素名」を小なり記号「<」と大なり記号「>」で囲った開始タグと終了タグで表わされます。HTMLでは要素名は小文字でも大文字でもよいとされていますが、XHTMLでは必ず半角・小文字で書きます。
空要素とは
内容を持たない要素で終了タグは不要です。
XHTMLでは、<要素名 />という形式で記述します。
詳しく見る
インライン要素とは
行内の一部になっているような要素です。インライン要素にはインライン要素をもつことはできますが、ブロックレベル要素は含めることができません。主な要素は以下のとおりです。
ブロックレベル要素とは
ひとつの独立したまとまりで構成する要素です。ブロックレベル要素にはさらにブロックレベル要素やインライン要素を含めることができます。主な要素は以下のとおりです。
- h1~h6要素(見出し)
- p要素(段落)
- ul要素(箇条書きリスト)
- ol要素(番号リスト)
- dl要素(定義型リスト)
- table要素(表)
- div要素(グループ化)
- hr要素(横罫線)
- address要素(作者情報)
- blockquote要素(引用文)
- pre要素(整形済テキスト)
絶対パスと相対パス
パスには、絶対パス、ドキュメント相対パス、サイトルート相対パスの3種類があります。
1. 絶対パス
使用するプロトコル(http://)からファイル名まで、リンクされたドキュメントの完全な URL を表す。他のサーバ上のドキュメントまたは画像などにリンクする際は、絶対パスを使用する。ローカルリンクを絶対パスで指定した場合、他のドメイン内にサイトを移動するとすべてリンク切れになる。一方、ローカルリンクで相対パスを使用すると、サイト内でファイルを移動した場合でも柔軟に対応できる。
◆記述例:
"http://www.weinfo.info/service/contents.html"
2. ドキュメント相対パス
現在のドキュメントからリンクされたドキュメントまでのパスをフォルダ階層を通して指定する。他のフォルダーのドキュメントまたは画像などにリンクできる。現在のドキュメントとリンク対象のドキュメントまたはアセットのパスで異なる部分だけを指定し、両方に共通する絶対パスの部分は省略する。
◆記述例:
"sub.html" "img/line.jpg" ../index.html" "../products/list.html"
- root
- service
- contents.html【1】
- sub.html【2】
- img
- line.jpg【3】
- products
- list.html【5】
- index.html【4】
- 【1】から sub.html【2】へのリンク = "sub.html"
- 【1】から line.jpg【3】へのリンク = "images/line.jpg"
- 【1】から index.html【4】へのリンク = "../index.html"
- 【1】から list.html【5】へのリンク = "../products/list.html"
3. サイトルート相対パス
サイトのルートフォルダからドキュメントまでのパスを指定し「スラッシュ」から始まる。例えば、"/service/contents.html" はサイトのルートフォルダのサブフォルダ [service] にある contetns.html へのサイトルート相対パスを表す。複数のサーバを使用する、または複数のサイトを持つサーバを使用する大規模なウェブサイトを構築している場合、サイトルート相対パスが適している。ただし、ドキュメントを移動または名前変更する場合、ドキュメント間の相対パスが変わっていない場合でもリンクの更新が必要となる。
◆記述例:
"/service/contents.html"
MIMEタイプとは
Multipurpose Internet Mail Extension の略。
MIME(マイム)タイプは、ファイルの形式を表す文字列のことで、サーバやブラウザはMIMEタイプからどんなファイルかを判断しています。MIMEタイプの指定はmeta要素を使います。主なMIMEタイプは以下のとおりです。
- ● text/html: HTML
- ● application/xhtml+xml: XML
- ● text/css: CSS
- ● text/javascript: JavaScript
- ● text/plain: 単純テキスト(※)
- ● image/png: PNG
- ● audio/midi: MIDIサウンド
- ● video/mpeg: MPEG
- ● application/pdf: PDF
- ● application/atom+xml: ATOM
- ● application/rss+xml: RSS
- ● application/rdf+xml: RDF
- ※ ウェブサーバの送信するContent-Typeが"text/plain"の場合、HTMLのソースコードがそのまま表示される。