[1] htmlファイル
You are here
htmlは,HyperText Markup Languageの略です.HyperTextとは,複数の文章が関連づけられた仕組みを指します.webページは通常の書籍と違い,リンクによって次々と別のページに飛んでいくことができます.これがHyperTextであるという意味です.
markup languageは,文章表示の指定をテキストに埋め込む様式の言語です.それを記述するのが,tagと呼ばれるもので,下記のコード例中,<h1></h1>,<p></p>などがそれにあたります.tagについては,
- <>で囲む.
- tagの有効範囲は<>~</>までの範囲(例外あり).
という約束になっています.
ここで,
- "<h2>お知らせ</h2>"をh2要素
- "h2"を要素名
と呼びます.
htmlやcssの規則は,W3C (World Wide Web Consortium)が勧告しており,コンテンツ制作者はそれに順じてコードを記述します.html文は,その約束ごとが面倒と感じるかもしれませんが,文章を構造的に記述するという意味で非常に優れています. ホームページは沢山のページの集合であり,一つのページ内にも,意味としての階層性があります.html文を上手く使いこなせば,そのような階層性を全ホームページに渡って統一的に表現することが出来るようになります.
公式ドキュメントなどでは,章や節が厳密に記述されますが,それと同様です.例えば,
- h1:タイトル
- h2:章
- h3:節
- h4:文中小見出し
のように内容の階層性を要素で分けていけば,ページが遷移しても,階層性がはっきりするのでとてもみやすいコンテンツとなります.
sample(htmlソース): index1.html
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
<title>株式会社ACORDOからのお知らせ</title>
</head>
<body>
<h1>株式会社ACORDO</h1>
<div class="section">
<h2>お知らせ</h2>
<div class="section">
<h3>2009-4-1 音楽配信事業開始</h3>
<p>mp3フォーマットによる音楽配信事業を開始いたしました.新サイト:<a href="http://acordomusic.com">Shall We Ensemble?</a> に是非アクセス下さい.</p>
</div> </div>
<div class="section">
<h3>2011-6-4 日本ロービジョン学会発表</h3>
<p>守山正樹, 鎌田幹夫, 岩井梢, 触覚を用いたリスクコミュニケーション・ゲームの開発と試行, 第12回 日本ロービジョン学会, P-29, 2011.6.4, 北九州国際会議場</p>
</div>
<br />
<div class="section">
<div class="section">
<h3>お問い合わせ先</h3>
<ul>
<li>ACORDO Corporation,Kamakura, Japan </li>
<li>Mail: contact@acordo.jp</li>
</ul>
</div>
</div>
</body>
</html>
» 続きへ
