THE HAM MEDIA BLOG

最近僕の周りで、「HTMLやCSSを勉強し始めた」
という人が何人かいました。
まだ僕も勉強の身なので、偉そうなことはいえないですが、
HTMLとCSSを勉強するためのポイントを書いておこうと思います。

Web標準って？

Web標準(Web Standards)ってのは、
「Webで標準的に利用される技術の総称」であって、
主にW3Cが規定している。

昔は「テーブルレイアウト」って言われる、
テーブルタグをフルに用いてサイトを構築しているとことがおおかったけど、
今ではWeb標準を採用した正しいHTMLとCSSで構築していく傾向にある。
Web標準でいることがアクセシビリティやユーザビリティ、
SEOやメンテナンスなどに活かしていきやすいからである。

Web標準でのHTMLとCSS

Web標準でサイトを作るということは、
文書構造と視覚表現は分離して設計する。
つまり、HTMLとCSSは分けろよってこと。

HTMLでは、文書を構造化させ、
CSSでは構造を元に視覚化して表現する。

だからHTMLの中には、視覚化をさせるタグもあるけど、
それらは使ってはならないということにもなる。

初心者が覚えるべき大まかな４つのポイント

長々書くのが大変なので、まとめてざっと書いてみる。

• １、基本用語はおさえる
• ２、XHTML1.0 Strictでのタグ付け
• ３、文書の構造化とタグ
• ４、装飾はすべてCSSで

１は基本なので省略。
勉強していくと用語とかたくさん出てくるから、
基本的な用語は覚えておく。

２は、いろんな意味をまとめて
「XHTML1.0 Strictでのタグ付け」とした。
標準的な作成をするのがStrictであるから、
Strictでは使えないタグとかは標準的ではないということになる。
だからStrictのルールやタグをまず覚えたほうがいい。

ここはいろんな意味を含んでいて、
例えば、
・タグは小文字で書く。
・必ず終了タグを入れる。
・空要素も終了のスラッシュを必ず入れる。
などの意味を含んでいます。
コレはある程度慣れが必要なこと。
僕も未だにimgの閉じを忘れたり。。。

３は、ページを作成するには、
文書を構造化させなくてはならない。
そして構造化させるには
タグを覚えていないことにはタグをつけられない。
なので、２も踏まえたタグを押さえる。
個人的な意見になるが、
タグを日本語で考えたらかなり楽に覚えられると思う。

４は、CSS全般。HTMLと分離して作成しようってこと。
例えば、font要素やstyle="○○"は
XHTML文書のなかに表示指定が入るわけなので、
使用は避けるべきということである。

オススメ参考書

上記の４つなんて、本当にXHTMLの基礎だし、
大雑把すぎて、ちょっと伝わりにくかったかも・・・
スミマセン。

なので、おすすめの参考書を２つほどあげておきます。

Web標準テキスト(3) HTML/XHTML (Web標準テキストシリーズ 3)
大藤 幹


Web標準の教科書―XHTMLとCSSでつくる“正しい”Webサイト
益子 貴寛


一つ目のは、最近お世話になっている大藤さんの書籍。
僕はこの本、実は大藤さんからいただいてしましました。
ありがとうございます！！！

この本は、HTMLをこれから勉強する人や、
基礎を押さえたい！って人向けの本だと思います。
HTMLのことだけが書かれているのですが、
本当にわかりやすかった！
これは本当にオススメの一冊です。

二冊目は、益子さんの本。
余談ですが益子さん、本当にグルメですよね。
一日にどれだけグルメの内容をアップしているのでしょう。。。
ブログの更新頻度が高くて感心します。
（参考サイトをみてください）

と、話はいきなりそれてしましましたが、
益子さんのこの本は中級〜上級者向けの本。
CSSやハックについてなども内容が盛りだくさん。
ブラウザでの気をつけるべき点などもかいてあるので、
基礎を押さえた人は必ず読むべき教本だと言えます。

あ〜、なんか言いたいことがまとまらなかった。
もう一つエントリー書こうかな（笑）