僕は僕でだれかじゃない

ビジネスとテクノロジーと健康についてあれこれ

MENU

【HTMLのお勉強】HTMLを構成する7つの基本構成要素:リスト

今回は、、、

「リスト」のお話をしたいと思います。

その前に。

前回のおさらい

前回「段落」のお話をしました。

覚えていますか?

ちょっと、おさらいをしておきましょう。

「段落」は「ブロックレベル要素を内容とすることはできない。」

とお伝えしました。

覚えてますか?

HTMLで大事なのは、この入れ子関係。

親と子の関係を理解できないと、正しいHTMLを書くことができません。

詳しくはDTDの文書に記述されています。

興味のある方は、調べてみてください。

これらを踏まえて、今回のお話に行きましょう。

リスト(ブロック要素)

リスト。要素で言うと「UL」「OL」「LI」「DL」「DT」「DD」です。

仕様(日本語訳)では下記のように定義されています。

http://goo.gl/shgOl

HTMLは著者に対して、リスト情報を指定するための幾つかの

メカニズムを提供する。どのリストも、1つ以上のリスト要素を

含まねばならない。リストには、次の内容が含まれ得る。

・順不同の情報。

・序列のある情報。

・定義。

「リスト」は奥が深い要素です。

色々と使い道があります。

極端なことを言うと、サイト全体の構造をリストでも表せるんじゃないかと思っています。

良いか悪いかは別として。

で、もうひとつ大事なことがあります。

3つのリスト形式の実際のプレゼンテーションは、ユーザエージェント依存である。

本仕様は、著者に、単にテキストの字下げ目的でリストを用いないよう求める。

字下げはスタイル上の問題であり、スタイルシートによって適切に扱われる。

とあります。

当たり前なお話なんですが、見栄えはCSSで調整しましょうということです。

これは、どの要素にも当てはまることですね。

「リスト」は色々と活用できる要素です。

デザイン上では、リストっぽくないけど、文書構造的にはリストだよね。

っていうのが良くあります。

このあたりも、しっかりと見極めれるようになりましょう。

そういう意味でも、デザイナーに正しいHTMLの知識を持ってもらうことが必要になってきます。

マークアップをしていて、おかしいな?とか気になるな?とか思うことがあれば、

デザイナーと話をする機会を持つことをおすすめします。

お互いの意見を分かり合い、お互いできることをやっていくことが、スキルアップにも繋がります。

いかがでしたか?

「リスト」は様々な所で活用できます。

気になるサイトがあれば、ソースをじっくりと眺めてみてください。

どういう構造になっているのか?を考えながらソースを見てもらうとより理解が深まると思います。

たくさんのサイトのソースを見て、学ぶ!

これは普段から実践できることなので是非やってくださいね!

実践あるのみです!

これで、あなたもプロフェッショナル!

それでは、また次回!

※HTML4.01をベースにお話をしています。