こんばんは
今回は『HTML5』( 読みは「エイチティーエムエルファイブ」)を記述してみましょう。
と、その前にHTML5の簡単な紹介をします。
HTML5とは、皆さんが普段googleやyahoo、safariで閲覧している
Webページを構成しているコンピュータ用の言語の事を指します。
具体例をあげれば、yahooのページを
HTML5でみると…
こんな感じに文字だらけです。
こういった文字をWeb屋さんがせっせと書くことで、Webページが作られているのです。
さて、前置きが長くなりましたが今回はHTML5を使って、Webサイトを記述してみましょう。
< 準備物 >
・PC
・テキストエディタ(Windowsならメモ帳とか)
・ウェブブラウザ(safariとかgoogleとか普段webをみるときに使っているやつ)
以上
テキストエディタに下の文字を打って、名前を付けて拡張子を.htmlで保存します。
<!doctype html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Webのタブの名前だよ!</title> </head> <body> Hello world! </body> </html>
htmlで保存したファイルをブラウザ開くと…
こんな感じに見れるのです。感動ですよね~。
文字の役割をまとめるとこうなります。
<!doctype html> | htmlで記述 |
<html lang=”ja”></html> | htmlは日本語で記述 |
<head></head> | titleとかmetaとかはこの中に書く |
<meta charset=”UTF-8″> | 文字化け防止とか(私も分かってない) |
<title>Webのタブの名前だよ!</title> | タブに名前を付けられる |
<body>Hello world!</body> | bodyの中にWebサイトの中身を書く |
案外、簡単に自分の作ったものを見れましたね。
ではまた。
ps
htmlのソースをブラウザ上で見れるようにするほうが面倒だったな…
しかもかっこ悪い… ⇒ 10/28日にちょっとましになった