Yugien - 遊戯苑
テーマ

最低限必要なHTML

Minimum required HTML.

　「W3C Markup Validation Service」でチェックしたときにエラーとならない最低限必要な HTML タグです。ただ、ページの中身を何も書いていないので、まだ何も表示されない真っ白なページです。

sample.html ファイル


<!DOCTYPE html>

<html lang="ja">

<head>
	<meta charset="utf-8">
	<title>最低限必要なHTML</title>
</head>

<body>

</body>

</html>

＞＞ サンプルを表示する

sample.html ファイルの表示例

sample.html ファイルの表示例画像

＞＞ サンプルを表示する

<!DOCTYPE>
　この文書が HTML のどのバージョンで書かれているのかを表すものです（文書型宣言）。コンピュータに対してどのバージョンの HTML の構文を使うかを指示するための命令になります。　一般的には、HTML5 の文書型宣言を使用します。
<!DOCTYPE html>
html 要素
　この <html>～</html> タグの間に HTML 文書を書いていきます。　そして、この HTML 文書が日本語で書かれていること示すために lang 属性を使って「 lang="ja" 」としています。
<html lang="ja">
head 要素
　文書のヘッダ情報を <head>～</head> タグの間に書いていきます。ブラウザに対する指示を書く場所なので、人の目には見えていない（画面に表示されていない）情報が多いです。
meta 要素
　meta要素とは、その文書に関する情報（メタデータ）を指定するために使うのですが、ここでは、その中でも charset属性を使って文字エンコーディングを指定します。文字エンコーディングとはその文書が文字コードの何を使って書かれているのかをブラウザ等に知らせる役割があります。例えば同じ日本語でも「shift-jis」で書かれた文書を「utf-8」で表示しようとすると文字化けを起こしたりします。こういったトラブルを防止するためにも文字エンコーディングを指定する必要があります。
<meta charset="utf-8">

文字化けの修正例

文字化けしたタイトルの修正例画像
title 要素
　文書のタイトルを <title>～</title> タグの間に書きます。ブラウザのタイトルバーやお気に入り（ブックマーク）等に表示されます。この title要素は、<head>～</head> タグの間に書くルールになっていますので注意が必要です。

title 要素の表示例

<title>～</title> の表示例画像
body 要素
　文書の本文を <body>～</body> タグの間に書いていきます。ブラウザで人の目に見える（画面に表示される）部分です。ここのサンプルには <body>～</body> タグの間に何も書いていないので、サンプルページを見ても真っ白なページになっています。