ブラウザのしごと
前回 マークアップした、
<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>ゆう子の日記</title> </head> <body>四郎くんは「こんなもの本当の寿司じゃない」と言いました。</body> </html>
というhtmlファイルをもとに解説します。
上記ファイルをブラウザで開くと、
こんな感じになります。
それはブラウザにこんな感じで、文章の意味を伝えることができたからです。
<!DOCTYPE html><!--「今からHTML5を書かせて頂きます。」--> <html><!--この文章はhtml要素です。--> <head><!--この文章はhead要素です。--> <meta charset="UTF-8" /><!--文字コードはUTF-8です。--> <title>ゆう子の日記</title><!--この文章はtitle要素です。--> </head> <body><!--この文章はbody要素です。--> 四郎くんは「こんなもの本当の寿司じゃない」と言いました。 </body> </html>
ブラウザはこの指示に従ってレンダリングしてくれたのです。
そう。htmlファイルはブラウザに対する指示書のようなものなのです。
ブラウザの個性
Google Chrome、Firefox、Safari、InternetExplorer、Operaなどなど、世の中にWEBブラウザはたくさんあります。
同じhtmlファイルを渡しても、ブラウザによって若干解釈が違うこともありますが、それは個性です。
おんなじ古典落語でも、噺家が違えば印象はがらりと変わる。
多分きっとそんな感じです。
すべてのブラウザで表示を合わせたい場合は、
それぞれのブラウザの解釈に合わせたマークアップが必要になるときもあります。
それは非常に骨が折れる（こともある）ので、本ブログでは基本的にはGoogle Chromeをつかって表示を確認していこうと思います。
コメント
先ほどの解説内にしれっと登場しましたがhtml内で、
<!--
から、
-->
の間に書かれた文章は、基本的にはブラウザの表示結果に関係しません。
そう。基本的にオフレコです。
なのでブラウザに表示したくない文章、例えば、
- ブラウザに向けてではなくソースコードを読む人に向けた文章
- ほかのひとに読まれるとトラブルになりそうな文章
などは、
<!--フォアグラよりもあん肝のほうが美味しい-->
というような感じでコメントアウトしておきましょう。ブラウザには表示されません。
※ htmlファイルのソースコードを見られるとがっつりバレるので、"ほかのひとに読まれるとトラブルになりそうな文章"を書くのはやめておきましょう。
今回は以上です。
次回 はタグをいくつか紹介します。
