HTML5に書き換えてみた
2.シンプルな宣言部とヘッダー部へ


IE11上で表示された現在のホームページです。

書き換え前画像クリックで実際のページ

このホームページのマークアップ記述の冒頭部分、DOCTYPE宣言文とhead要素は下の様になっています。

書き換え前

1行目は、XML宣言(「XMLで書いているよ」と宣言する)です。

2・3行目は、文書型宣言(「1.1Transitionで書かれているよ」と宣言する))です。

4行目は、ここからページ内の情報が書かれている事を示します。

5~11行目は、<head>と</headで囲まれたヘッダー部です。

 

HTMLでは、1~3行目の煩雑さが無くなり、とてもシンプルになりました。

<!DOCTYPE html>

と記述するだけです。

4行目のhtml要素は必要ですが、

<html lan="ja">

で充分です。

7・8行目の文字コード指定もシンプルになりました。 なお、今回の書き換えでは、文字コード指定をShift_JISからUTF-8に変えています。より汎用性が高いホームページにする為です。書き換え後は、

<meta charset="UTF-8">

となります。

5~11行目のヘッダー部では、他にもCSSやJavaScriptのtype属性が不要になったり、タグ内記述が簡略化されたりしました。

 

結果として、書き換え後は下の様になります。

書き換え後

この様にHTMLの宣言部とヘッダー部は、書きやすく判りやすくなりました。

 

本題HTML5から外れますが、私はウインドウズ「メモ帳」を使ってホームページの作成、編集を行っています。 今回は使用文字コードの変更を同時に行いましたが、これを完了する為には、文書の保存時に留意する点があります。

文字コード変更直後は「上書き保存」では無く、「名前を付けて保存」します。 何故なら保存時にも「文字コード」を指定する必要があるからです。 文書の保存画面の下部(下図参照)に文字コード指定欄がありますので、ここでUTF-8を選んだ後で「保存」をクリックします。

文字コード指定方法

次回からの保存、あるいはコピーした文書を保存する場合は、すでに文字コードはUTF-8になっているので、「上書き保存」で問題ありません。

ページトップ

前ページ←

→次ページ

コーナー