Blazor SEOメタデータ
Blazor の SEO メタデータを 1 つのコンポーネントで管理
タイトル、説明、正規 URL、hreflang リンク、Open Graph タグ、ロボット ディレクティブ、および JSON-LD を 1 つの再利用可能な Blazor コンポーネントに保持します。
サンプルを確認し、独自のアプリで同じパターンが必要な場合は、約 ¥925 の完全な実装を購入してください。
概要
ページごとに 1 つのメタデータ ソースを使用する
Blazor アプリは、同じレイアウトから多くのページをレンダリングできます。中央のメタデータ コンポーネントは、各ページのタイトル、説明、正規 URL、言語リンク、ソーシャル プレビュー、およびスキーマ ペイロードを調整した状態に保ちます。
適合確認
中央のメタデータはコピー&ペーストされたヘッドマークアップに勝ります
head タグをすべてのページにコピーすることは、しばらくの間は機能しますが、その後、小さな違いにより、重複したタイトル、古い正規 URL、不足している hreflang リンク、または表示されているページと一致しないスキーマが作成されます。コンポーネントはルールを 1 か所に保持します。
ページが SEO ルールを共有する場合はコンポーネントを使用する
- 多くのページが同じタイトル、説明、正規、hreflang、Open Graph、およびロボット ルールを共有しています。
- ローカライズされたページには、一貫したカルチャ リンクと x デフォルトの処理が必要です。
- 記事、FAQ、製品、またはソフトウェアのページには、表示されているコンテンツと一致する JSON-LD が必要です。
- 編集者または開発者は、レイアウト マークアップを編集せずにメタデータを更新する必要があります。
散在するヘッドマークアップを避ける
- 各ページは独自の head タグを手動で書き込みます。
- H1、タイトル、メタディスクリプションは同じ文を繰り返します。
- 正規 URL は、ページ移動後の古いルートを指します。
- 表示されている FAQ が削除された後も、FAQ スキーマはオンラインのままです。
目次
SEOシグナル
ページのアイデンティティの一貫性を保つ
検索エンジン、ソーシャル プラットフォーム、AI クローラーはすべて、わずかに異なるシグナルを読み取ります。同じページを簡単な言葉で説明する必要があります。
ページに明確な名前を付ける
H1 を一字一句コピーせずに、主要なトピックを含む短いタイトルを使用してください。
次のアクションを促す
利点を説明し、ユーザーに開封、レビュー、または購入する理由を与える自然なメタディスクリプションを作成します。
優先 URL を 1 つ選択してください
正規 URL は、トラッキング リンク、リダイレクト、または古いルートではなく、インデックスを作成するページを指す必要があります。
言語バージョンをリンクする
カルチャーを意識したページには、実際の URL と一致し、適切な x-default ページを含む hreflang リンクが必要です。
共有プレビューを制御する
ソーシャル プレビューでは、残りのメタデータと同じページ タイトル、説明、正規 URL、および準備された画像を使用する必要があります。
クロールルールを意図的に設定する
ページごとにロボットと AI ディレクティブを使用して、インデックス作成、スニペット、アーカイブ、AI の使用法がコンテンツ ポリシーに一致するようにします。
構造化データ
同じページのメタデータからスキーマを生成
JSON-LD は、ページとは異なるストーリーを伝えるべきではありません。表示されている記事で既に使用されているのと同じタイトル、説明、正規 URL、公開日、画像、パンくずリスト、および FAQ データを使用します。
記事スキーマ
ページに実際の見出し、公開日、変更日、画像、セクション構造がある場合は、Article スキーマを使用します。
FAQ スキーマ
FAQPage は、ページ上に同じ質問と回答が表示される場合にのみ使用してください。
BreadcrumbList
ユーザーがリンクやナビゲーションを通じて理解できるのと同じ階層からブレッドクラムを構築します。
ソフトウェアまたは製品
価格、オファー、名前、説明がユーザーに表示される場合にのみ、製品またはソフトウェアのスキーマを追加します。
よくある間違い
メタデータのバグのほとんどは小さな不一致です
このコンポーネントは、繰り返されるチェックを 1 つの繰り返し可能なパターンに変えるので便利です。目標はタグを増やすことではありません。目標は矛盾を減らすことです。
H1 をタイトルと説明にコピーしないでください
タイトル、H1、およびメタディスクリプションで同じトピックを使用できますが、それぞれに異なるジョブを割り当てる必要があります。
翻訳された URL を忘れないでください
ページが複数のカルチャに存在する場合、メタデータと hreflang は一致するカルチャ ルートを指す必要があります。
古い共有イメージを再利用しないでください
Open Graph および JSON-LD 画像は、コンポーネントを使用した最後の記事ではなく、このページを表す必要があります。
非表示のコンテンツをマークアップしないでください
FAQ と製品スキーマでは、ユーザーが実際にページ上で見ることができるコンテンツを説明する必要があります。
実装
コンポーネントを一度ワイヤリングしてから、ページ データをフィードします。
パターンは意図的に退屈なままです。ページのメタデータ オブジェクトを定義し、レイアウトまたはページでコンポーネントをレンダリングし、ページに構造化データが必要な場合に一致する JSON-LD を渡します。
ページメタデータの定義
var metadata = new PageMetaData(culture)
{
Name = PageLinks.BlazorSEOMetaDataComponent,
Title = "Blazor SEO Metadata Component for Blazor Apps",
Description = "Keep title, description, canonical, hreflang, Open Graph, and JSON-LD aligned.",
ImageUrl = "/images/blazor/metadatacomponente/opengraph/hero-1200.png",
Url = PageLinks.BlazorSEOMetaDataComponent,
Robots = RobotsMetaTagExtensions.Join(RobotsMetaTagEnum.Index, RobotsMetaTagEnum.Follow),
AllowAiIndexing = true
};レイアウトでメタデータを表示
@inherits LayoutComponentBase
<MetadataComponent MetaData="@PageMeta"
JsonLd="@Schema?.JsonLd"
RenderArticleMeta="@Schema?.RenderArticleMeta" />
@BodyJSON-LDをページに添付します
@page "/{Culture}/guide/"
@inherits PageBase
<MetadataComponent MetaData="@PageMeta"
JsonLd="@Schema?.JsonLd"
RenderArticleMeta="@Schema?.RenderArticleMeta" />
<ArticleFaq Id="faq" FAQ="@FAQs" />検証
公開する前に出力を確認する
メタデータ コンポーネントは、レンダリングされた HTML が正しい場合にのみ役立ちます。リリース前に、ページ ソースを検査し、共有プレビューをテストし、スキーマを検証し、ローカライズされた URL をクロールします。
ソースを見る
Razor ファイルだけでなく、レンダリングされた HTML ヘッドも確認してください。クローラーは最終応答を読み取ります。
スキーマの検証
リッチリザルトまたはスキーマ検証を実行し、表示されているコンテンツが欠落していることを示す警告を修正します。
テストの共有
ソーシャル プレビュー デバッガーを使用して、タイトル、説明、画像、キャッシュの動作をチェックします。
クロールロケール
カルチャ URL をクロールして、リリース前に破損した正規リンク、hreflang、または x-default リンクを検出します。
はじめる
メタデータ ルールが繰り返されるときにコンポーネントを購入する
すでに同じタイトル、正規のオープン グラフ、JSON-LD ロジックを複数のページに記述している場合は、約 ¥925 の完全な実装を購入し、ルールを 1 か所に保管してください。
関連リソース
Blazor SEO メタデータの次のガイド
ルーティング、構造化データ、ソーシャル プレビュー、または Blazor プラットフォーム自体についてさらに詳細が必要な場合は、これらのガイドを使用してください。
よくある質問
Blazor メタデータ コンポーネントは何をしますか?
1 つの型指定されたソース (タイトル、説明、正規 URL、hreflang リンク、Open Graph タグ、ロボット ディレクティブ、およびオプションの JSON-LD) からページ メタデータをレンダリングします。
タイトル、H1、メタディスクリプションが異なる必要があるのはなぜですか?
彼らはさまざまな場所に現れます。タイトルは検索とブラウザのタブに役立ち、H1 は表示されるページに名前を付け、説明は次のアクションを促す必要があります。
コンポーネントは重複コンテンツを防止しますか?
これは、正規 URL と hreflang リンクの一貫性を保つのに役立ちます。異なる目的や言語を対象とするページには、独自のページ コピーと説明が依然として必要です。
JSON-LD はコンポーネントにどのように適合しますか?
このページは、記事、FAQ、ブレッドクラム、製品、またはソフトウェア セクションで使用されるものと同じメタデータと表示コンテンツから JSON-LD を構築します。
AI クローラーのタグをページごとに制御できますか?
はい。ページレベルのロボットと AI オプションを使用して、インデックス作成、スニペット、アーカイブ、noai、および noimageai ルールがそのページのコンテンツ ポリシーに一致するようにします。
これを Blazor WebAssembly で使用できますか?
はい、ただし、SEO メタデータは、タグが最初の HTML 応答に存在する場合に最も強力になります。通常は、サーバー レンダリングまたはプリレンダリングの方が安全な選択です。