ホームページ作成講座ページタイトル

  1. HOME
  2. ホームページ作成講座
  3. ページタイトル

ではこれからテキストをブラウザで表示させる方法について見ていきましょう。 しかし最初は、ページのタイトルを付ける所から始めたいと思います。

その前に準備として、HomePageフォルダの中に、「text」という名前のフォルダを作っておいて下さい（下図）。 このフォルダの中にHTMLファイルを作っていきます。

textフォルダ

タイトルタグ

ページタイトルは、ヘッダ部分にある<title></title>の間に書きます。

<title>～</title>
ページのタイトルを指定します。

では、以前に作ったtemp.htmlを開いて、textフォルダの中にlesson1.htmlという名前で保存しましょう（下図）。

lesson1.htmlの作成

このファイルは、既にHTMLの骨組みが書き込まれていると思います。 ではヘッダ部分のタイトルタグの間に、以下のように記入してみましょう。

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <title>1.ページタイトル</title>
</head>
<body>

</body>
</html>

これで上書き保存し、ブラウザで表示してみましょう。 ブラウザのタブに、titleタグの間に書いた文字が表示されていると思います。

タイトルの表示

ページタイトルは、検索エンジンに情報を読み取ってもらう非常に重要な部分です。 タイトルは必ず入れましょう。

ブラウザに表示される部分

さて、タイトルタグに文字を指定しても、ブラウザ上には何も表示されなかったと思います。 ブラウザに表示されるのは、<body>～</body>の間に書かれた部分です。

<body>～</body>
この間に書かれたものがブラウザで実際に表示されます。

試しに以下のようにbodyタグ内に書き足してみて下さい。

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <title>1.ページタイトル</title>
</head>
<body>
ここに書かれた文字が、
ブラウザで表示されます。
</body>
</html>

ブラウザの画面に、以下のように表示されたと思います↓

実際に表示してみると分かりますが、改行が無視されて1行目と2行目が繋がっていると思います。 HTMLでは改行は無視されます。意図的に改行させるには、改行タグというものを使います。

では次のページから、テキストを入力する時に用いる様々なHTMLタグを見ていくことにしましょう。

INDEXへ