メタタグとは?
検索エンジンやブラウザなどのシステムに、Webページのタイトルや説明文などの情報を、伝えるためのHTMLタグのことです。HTMLファイルの<head>~</head>要素の中に記入します。サイト画面に表示されるものではありません。
使い方
ページタイトルと説明文を入力し、必要に応じてcharset、viewport、favicon、GA4タグを追加します。生成されたタグをHTMLの<head>内に貼り付けます。
注意点
ページタイトル<title>
非常に重要です。同ドメイン内で被りがないようにしてください。
meta description(メタディスクリプション)
非常に重要です。検索結果に表示されるサイトの説明文になります。70から120文字前後が収まりが良くなります。
charset
文字コードの指定です。HTML5の推奨はUTF-8です。文字化けや不具合の原因となるので正しく。このサイトのデフォルトでOKです。
viewport
スマホでの表示に関わる指定です。Google推奨は『initial-scale=1』。このサイトのデフォルトでOKです。
user-scalable(ズーム操作)
閲覧者がズーム出来るかを設定します。通常はデフォルトでONになっています。このサイトのデフォルトでOKです。
format-detection
スマホ表示時に、電話番号をタップでそのまま電話を掛けられるようにします。このサイトのデフォルトでOKです。
favicon
ブラウザのタブなどに表示されるアイコンです。適切なサイズのアイコンを作成してサーバーにアップ。そのURLを指定してください。
apple-touch-icon
アップルタッチアイコンとは、スマホのホーム画面に追加した時に表示される、アイコン画像です。
よくあるミス
全ページで同じtitleを使う、descriptionが長すぎる、viewportを削除する、faviconのURLが404になる、といったミスがよくあります。