<これはHTMLファイルです> <ここからHTMLです> <ここからヘッダです> <ここからタイトルです>～タイトル～<ここまでタイトルです> <ここまでヘッダです> <ここから本文です> ～～～本 文～～～ <ここまで本文です> <ここまでHTMLです>
HTMLファイルを作る
HTMLファイルの作り方は非常に簡単です。
HTMLファイルの中身はただのテキストファイルなので、Windowsに標準搭載されているメモ帳でも作ることができます。
ファイルを保存するときにファイル名の最後（拡張子）に".html"とつけるだけで作れます。
HTMLファイルで書いています！宣言「DOCTYPE宣言」
HTMLファイルを作るときに、まず最初にHTMLファイルがHTMLで記述していることを宣言しなくてはいけません。
宣言方法はとても簡単、HTMLファイルの先頭に
と記述するだけです。
HTMLで記述しています「html要素」
DOCTYPE宣言の次は「ここからここまでがHTMLです」と示す必要があります。
HTMLファイルの情報や文章はすべて<html>から</html>内に書きます。
書き方は、
HTMLファイルの情報・文章
</html>
のようになります。
HTMLファイルの情報を記述「head要素」
HTML文章には本文だけではなく、ヘッダ情報というものを付け加えることができます。
たとえば、HTLMファイルの「タイトル」をヘッダ情報として入れられます。
ヘッダ情報の書き方は、以下のようになります。
ヘッダ情報(タイトルなど)
</head>
タイトル「title要素」
上記で説明したようにHTML文章にはタイトルを含めることができます。
タイトルはヘッダ情報の中に入れる必要があります。
ヘッダ情報の中にタイトルを含めるには、以下のような書き方になります。
<title>タイトル</title>
</head>
HTML本文を記述する「body要素」
ヘッダ情報を書き終えたらついに本文です。
本文はウェブブラウザに表示される部分で、文章のほかに、図表や画像等、様々な表現方法で書き表すことができます。
本文の書き方は、以下のような書き方になります。
ここに本文を書きます。
</body>
「要素」と「タグ」
このように、<html>から</html>で囲まれた部分や<body>から</body>で囲まれた部分を「要素」といいます。
一方、<と>で囲まれた部分を「タグ」といいます。
<html>や<body>のように始まりを示すタグを「開始タグ」、</html>や</body>のように終わりを示すタグを「終了タグ」といいます。
HTMLファイルサンプル
作り方だけではわかりにくいと思いますので、サンプルソースコードとサンプルファイルを作っておきます。
サンプルソースコード
ここでは、タイトルに"Title"、本文に"Hello!"と表示すだけの簡単なソースコードを記載します。
<!DOCTYPE html> <html> <head> <title>Title</title> </head> <body> Hello! </body> </html>
サンプルファイル
サンプルソースコードのHTMLをそのままHTMLファイルにしたものをサンプルファイルにしてみました。
http://sample.thinkreatesoft.net/html/html/index.html にジャンプすれば以下のようなサンプルファイルが表示されます。
次回記事は文字化け防止のおまじない
ウェブサイトを見ていると、たまに何が書いているのかわからない「文字化け」したサイトに出くわしたことがありませんか？
自分で作ったウェブサイトを文字化けさせたくはありませんよね？
次回はその原因と解消法を説明します。
以上、当サイト管理人のAsterismでした。