Web サイト Meta Tags ジェネレーター
フォームを入力するだけで標準 HTML Meta tag を即座に生成します。Open Graph、Twitter Card、Canonical URL など主要な SEO 要素に対応し、ワンクリックでコピーして貼り付けられます。
すべての data はブラウザ内だけで処理され、server へ upload されません。
Meta Tag FAQ
• Title Tag: 検索結果の青い title は、SEO で非常に重要な要素の 1 つです。
• Meta Description:search result の summary text で、click-through rate に影響します。
• Open Graph / Twitter Card:SNS 上の共有プレビューを制御します。
• Canonical URL:duplicate content issue を防ぎ、search engine が正しい page を index できるようにします。
適切な Meta タグ設定は、検索結果での見え方、ソーシャル共有時の露出、ユーザーのクリック意欲を改善するのに役立ちます。
• og:title: 共有タイトルをカスタマイズし、40~60 文字程度に収めることを推奨します。
• og:description: share description は 2~4 sentence、200 character 以内を推奨します。
• og:image: 画像を共有する場合は 1200×630 pixel を推奨します。クリック率の向上につながりやすいサイズです。
• og:type:Content type(website、article、product など)は platform が正しく表示する助けになります。
正しい OG tag を設定すると、SNS 上で Web サイトリンクを見栄えよく表示でき、魅力が高まり、social traffic の増加につながります。
• summary_large_image: large image mode。content Web site や blog に適しています。
• 概要: 小画像モード。個人情報ページやシンプルなページに適しています。
2 つの違い:
• OG は Facebook、LINE、LinkedIn、Slack など多くのプラットフォームで広く対応しています。
• Twitter Card が影響するのは X 上の共有プレビューのみです。
• ベストプラクティス: すべての platform で最適な共有表示を得るため、両方を設定してください。Twitter Card を設定していない場合、X は OG 情報を自動利用しますが、表示効果が弱くなることがあります。
なぜ重要なのですか?
• duplicate content による SEO penalty を防ぎます。
• 検索ランキング評価を 1 つの URL へ集中させます。
• 一般的な例:https と http、www と non-www、UTM パラメーター付き URL、印刷版、ページネーションなど。
使用:
<link rel="canonical" href="https://example.com/original-page/" />重複コンテンツの問題がない場合でも、各ページに自己参照 canonical URL を設定することはベストプラクティスです。
Google は 2009 年、Keywords Meta Tag をランキング要因として使用しないことを公式に発表しました。このタグが長年 SEO 業者によって乱用され、キーワード詰め込みに使われてきたためです。
• Bing / Yahoo: Keywords タグをランキング参考情報の一つとして利用する検索エンジンが残っている可能性はありますが、重みは非常に低いと考えられます。
• Yandex(Russia):Keywords は場合によって参照価値があるとされています。
• Baidu(中国):Keywords を補助的なシグナルとして使用する場合があります。
推奨事項:Keywords tag は残しても問題ありませんが(害はありません)、最適化に時間をかける必要はありません。Title、Description、コンテンツ品質、UX に注力するほうが正しい SEO 戦略です。
1. ブラウザー開発者ツール: Right click → Inspect → Look at the <head> area.
2. Web ページのソースコードを表示します:Ctrl+U(Windows)または Cmd+U(Mac)で HTML source code を直接表示できます。
3. ToolHub のツールを使う:
• SEO Meta チェッカー — HTML を貼り付けるだけで、すべての Meta タグと SEO スコアをすぐに分析できます。
• Web サイト SEO 監査 — Web サイト全体の SEO health を詳しく分析します。
4. ソーシャルプラットフォームのデバッグツール:
• Facebook Sharing Debugger
• Twitter Card Validator
• LinkedIn Post Inspector
ベストプラクティス:
• 完全な Open Graph タグを設定します(ほとんどのプラットフォームが対応)。
• Twitter Card tag も追加し、X platform 向けに最適化します。
• Twitter Card の値は OG と同じでも、異なる値でも構いません。
注意事項:
• Twitter Card タグがない場合、X は OG タグをフォールバックとして使用しますが、表示の最適化度は下がります。
• 両方が設定されている場合、Twitter は Twitter Card タグを優先します。
• Facebook、LINE、LinkedIn などは OG タグを使用し、Twitter Card の影響を受けません。
このジェネレーターでは必要なフィールドへ入力するだけで、両方に対応する完全なラベルを自動生成します。
Meta タグについて詳しく見る
Meta Tag 完全ガイド
基礎から応用まで、HTML Meta tag の種類、用途、推奨設定を包括的に解説します。Title、Description、Keywords、Viewport など主要 tag の詳しい説明を含みます。
Open Graph 最適化ガイド
最適な OG タグの設定方法を学び、Facebook、LINE、LinkedIn などのソーシャルプラットフォームで Web サイトのリンクを魅力的に表示しましょう。ソーシャル共有からの流入とクリック率向上にもつながります。
Twitter Card 設定チュートリアル
Twitter Card の4種類(summary、summary_large_image、app、player)を理解し、X での共有に適した設定を確認できます。
Canonical ラベル付けのベストプラクティス
Canonical URL の仕組み、代表的な利用場面、301 redirect との違い、多言語 Web サイトでの扱いを詳しく解説します。
Web サイトの Meta 情報を最適化する方法
Web サイトの meta 情報を総合的に最適化する戦略です。Title の書き方、クリックを促す Description、OG image の設計ポイントまで、重要事項をまとめて確認できます。
Robots Meta Tag と SEO
Robots Meta Tag の各指示(index、follow、archive、snippet など)の意味と、検索エンジンのクロール・インデックス動作を正しく設定する方法を確認できます。