titleについてhtmlプロパティ解説

概要

<title> タグは、HTML文書のタイトル（ページの名前）を定義する要素です。
この内容はブラウザのタブ名や、検索エンジンの検索結果に表示されるため、SEOやユーザビリティにおいて非常に重要です。

基本的な使い方

See the Pen headについて by 西野, WEBデザイン (西野 誠) (@-WEB-the-vuer) on CodePen. 

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTF-8">
    <title>サービス紹介 | 株式会社サンプル</title>
  </head>
  <body>
    <h1>サービス紹介</h1>
  </body>
</html>

<title> タグは <head> 内に1つだけ記述し、そのページを表す簡潔で具体的なタイトルを設定します。

出力される内容の例

<title>お問い合わせ | サンプル株式会社</title>

役割とメリット（定義リスト形式）

ブラウザのタブに表示
ユーザーが開いているページの名前としてブラウザのタブに表示されます。
SEOに効果的
検索結果のタイトルとして使用されるため、クリック率に影響します。
ページの識別
複数タブやブックマーク時にページを判別しやすくします。
共有時のタイトル
SNSなどで共有された際に、ページタイトルとして表示される場合があります。

注意点

  • <title> タグは1ページに1つだけ配置してください（複数あると無効になることがあります）。
  • タイトルは「ページ名 | サイト名」のように構造化するとわかりやすくなります。
  • タイトルが長すぎると、検索結果で途中で切れてしまうことがあります（全角30文字以内推奨）。
  • <head> タグ内に配置する必要があります。

まとめ

<title> タグは、HTML文書におけるタイトルを定義し、SEO・ユーザビリティ・共有性などに大きく影響する重要な要素です。
短く明確にページ内容を表すよう心がけ、1ページに1つだけ適切に記述することが基本です。