こんにちは。
シーサイドレーベルweb担当の飯野です。
今回は前回に引き続き、
HTML5について
お話させて頂きます。
今回は、基礎的な書き方について
説明させて頂きます。
まずは、先に全体的な記述を
書かせて頂きます。
本当に基礎の基礎くらいの
最低限の書き方です。
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>サイトのタイトル</title> </head> <body> コンテンツ内容をここに書きます。 </body> </html> |
では、順番に解説していきますね。
HTML5でのDOCTYPE宣言の書き方について
この部分は前回の記事でお話させて頂きましたが、
もう一度復習してみましょう。
XHTML1.0のDOCTYPE宣言の書き方は
下記のように記述していました。
|
1 2 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
HTML5でのDOCTYPE宣言は
|
1 |
<!DOCTYPE html> |
非常にシンプルになりました。
他のサイトなどのソースを見るときに、
<!DOCTYPE html>
が最初に記述されているサイトは、HTML5でマークアップされている
サイトだということが分かります。
html要素と文字のエンコーディングについて
・XHTML1.0
|
1 2 3 |
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
XHTML1.0の時の書き方はこの様な書き方でした。
・ HTML5
|
1 2 3 |
<html lang="ja"> <head> <meta charset="UTF-8"> |
html 要素は、XHTML1.0ではxmlns属性が必要でしたが、
HTML5の場合は、lang属性を指定します。
日本語のサイトの場合は<html lang=”ja”>という形です。
エンコーディングの指定部分ですが、
XHTML1.0の時も指定はしていたと思うので、
その部分では変わらないのですが、指定方法は短くなりました。
<meta charset=”UTF-8″>
これでOKです。
XHTML1.0では、空要素というものを記述していました。
例えば、こちらの部分の最後の「 /」の部分です。
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
HTML5では、あっても無くても問題ないようです。
その他の部分（tittle）などは従来と変わりません。
今回はここまでとさせて頂きます。
今回の基礎的な書き方を元に、
今後色々追加していきながら説明させて頂きたいと思います。
まずは、最低限のマークアップ方法を
しっかり覚えて下さいね。
では、また来週お会いしましょう。
●３年ぶりに帰ってきた「藤田哲也の個別コンサルティング」
