ちょっと、間が空いてしまいましたが。。。
前回は「リンク」のお話をしました。
覚えてますか??
少しおさらいをしておきましょう。
WWWの一番の醍醐味が、この「リンク」の仕組みです。
HTMLをよりよい文書にするには、欠かせない機能なのです。
それぞれの文書をつなげることができる。
それが「リンク」の役割なのです。
また「リンク」のもうひとつの用法として「関係性を示す」というものがあります。
このあたりは、Vol.15のメルマガを読み返してみてください。
途中から読んでいただいている方は、仕様書をどうぞw
ということで。
前回の内容を踏まえて、下記をもう一度みておきましょう。
- HTMLを構成する7つの基本構成要素
-
- 見出し(ブロック要素)
- 段落(ブロック要素)
- リスト(ブロック要素)
- 表組み(ブロック要素)
- 画像(インライン要素)
- リンク(インライン要素)
- グループ化(ブロック要素・インライン要素)
さて、今回で「HTMLを構成する7つの基本構成要素」のお話が終わります。
長期にわたり、簡単にですが説明をしてきました。
みなさんのお役に立っているでしょうか。
すぐに、成果が出るようなものでもないので、じわじわ勉強していただければと思います。
では、本日は「グループ化(ブロック要素・インライン要素)」についてです。
グループ化
「グループ化」は、主にレイアウト構造を保持するために利用します。
要素としては「DIV」と「SPAN」があります。
それぞれ、何が違うかと言うと、「ブロック要素」か「インライン要素」かの違いです。
「DIV」が「ブロック要素」で、「SPAN」が「インライン要素」になります。
これらを踏まえて、仕様書(日本語訳)を見ていきましょう。
仕様書には、こう書かれています。
DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する。各々、内容が行内であるか(SPAN)ブロックレベルであるか(DIV)は定めるが、
他のプレゼンテーション的語彙を示すことはない。
従って著者は、この両要素をスタイルシートやlang属性等と併用することで、
HTMLを自身の必要や好みに応じられるようにできる。
つまり、DIVとSPAN自体には文書構造的な意味はないんですね。
レイアウトやグループ化するための「箱」と考えてもらえれば理解しやすいと思います。
ただし、気をつけて欲しいのは、何でもかんでもDIVやSPANで囲うのも問題ありです。
階層が増えると、レンダリングするのに時間がかかります。
かつ、意味のない要素が増えると、HTML文書的にも良い文書とは言えないのです。
CSSレイアウトが出回り始めたときは、このDIVを多用したサイトが横行していました。
そのDIVを多用してマークアップする方々を「div厨」と呼んでいました。
この言葉は、元々は掲示板「2ちゃんねる」で使われ始めたと言われています。
DIVの使いすぎには注意しましょう!
以上で説明おわり!
これで、あなたもプロフェッショナル!
※HTML4.01をベースにお話をしています。
※WWWとは、World Wide Web の略です。