HTMLメタタグを生成する方法

入力した情報からHTMLメタタグを作る

ページにタイトルや説明などのメタデータを設定し、HTMLのメタタグ用マークアップをまとめて用意したいときに使います。ページタイトル、説明、キーワード、作成者の値は任意で入力できます。ビューポートとrobotsのテキストも指定できるため、ページの基本設定を入力値から組み立てる用途に向いています。既存ページを読み取って調べる機能ではなく、入力したテキストをもとにマークアップを生成するためのツールです。

メタタグを生成する手順

1. ページタイトル、説明、キーワード、作成者を、必要な項目だけ入力します。空欄の項目は追加のメタデータとして出力されません。タイトルを入力した場合は、タイトル要素とタイトルのメタ要素が生成対象になります。

2. ビューポートとrobotsのテキストを確認し、必要に応じて変更します。初期値はビューポートが width=device-width, initial-scale=1.0、robotsが index, follow です。

3. 生成を実行し、返されたマークアップを確認します。ビューポート、robots、文字コードのマークアップは、任意のページメタデータを空欄にしても含まれます。生成結果ではタグが改行ごとに分かれて表示されます。

4. 入力した値が意図した内容かを確認してから、対象ページのHTMLへ組み込みます。入力値はマークアップへ挿入される前にエスケープされますが、タイトルや説明の内容、robotsの指定がページの目的に合っているかは利用者が確認してください。

生成結果の見方と注意点

結果には、標準的にビューポート、robots、文字コードに関するマークアップが含まれます。任意のページメタデータは入力した項目だけが追加されるため、空欄がある場合に対応する項目が見当たらなくても異常とは限りません。タイトルを入力した場合は、タイトル要素に加えてタイトルのメタ要素も確認できます。

改行された各行を見ながら、入力した説明やキーワード、作成者の値が想定した位置に入っているかを確認してください。これは入力値からHTMLメタタグ用マークアップを作る機能であり、生成された内容が検索結果やSEO上の成果を保証するものではありません。また、既存のウェブページを取得して内容を検証する機能ではないため、ページ全体との整合性は別途確認が必要です。

使用例

商品ページ用の基本的なメタタグを、タイトルと説明だけ指定して用意します。

商品ページのタイトルとして「春のキャンペーン」、説明として「新商品と開催期間を紹介します」を入力し、ビューポートとrobotsは初期値のまま生成します。

入力したタイトルに対応するタイトル要素とタイトルのメタ要素が含まれ、ビューポート、robots、文字コードのマークアップが改行ごとに並ぶ形になります。

制限事項

• 入力したテキストからHTMLメタタグ用マークアップを生成する機能であり、既存ページの取得・検証や、SEO成果の保証を行うものではありません。

よくある間違い

• 任意項目を空欄にしたまま、対応するメタデータが出力されないことを不具合だと判断することがあります。空欄の項目は追加されず、ビューポート、robots、文字コードのマークアップは別に含まれるため、入力内容と出力対象を分けて確認してください。

よくある質問

どのメタデータを入力できますか？

ページタイトル、説明、キーワード、作成者は任意のテキスト値として入力できます。入力した項目だけが追加され、空欄の項目は追加されません。

ビューポートとrobotsの設定は変更できますか？

初期値は width=device-width, initial-scale=1.0 と index, follow です。用途に合わせてビューポートとrobotsのテキストを変更できます。

任意項目を入力しなくても結果は生成されますか？

任意のページメタデータが空欄でも、ビューポート、robots、文字コードのマークアップは含まれます。ただし、検索順位やSEO上の成果を保証するものではありません。