← ブログ一覧

はてなブログで、SEO改善のために構造化データ(JSON-LD)を追加・変更する方法

SEO

はてなブログでSEOを改善するには、管理画面の「<head>要素にメタデータを追加する」欄でJavaScriptコードを設定し、構造化データをArticleからBlogPostingに変更します。

この記事のまとめ

変更内容

  • @typeをArticleからBlogPostingに変更
  • authorプロパティを追加
  • リッチリザルトテストで確認
  • はてなブログの設定画面で1分程度の作業で設定可能
  • コピー&ペーストだけで実装できる

期待される効果

  • Googleの公式データによると、構造化データを正しく設定した企業ではクリック率が25-82%増加

構造化データ(JSON-LD)とは？

構造化データは、検索エンジンがWebページの内容を正確に理解できるようにするための、標準化された形式です。

Googleの公式ドキュメントによると、構造化データを追加することで「異なるサイト間で使用できる形式で詳細情報を提供」できます。

具体的には、ページの<head>や<body>にJSON-LD形式でデータを記述することで、検索エンジンに以下のような情報を伝えられます。

  • 記事のタイトル
  • 著者名
  • 公開日
  • 更新日
  • 記事の本文内容

JSON-LD形式とは？

JSON-LD（JavaScript Object Notation for Linked Data）は、構造化データを記述するための形式の1つで、Googleが推奨している方式です。

Googleの公式ドキュメントによると、JSON-LD形式には以下の特徴があります。

  • ページの<head>や<body>内の<script>タグに埋め込む
  • HTMLの表示テキストと混在させる必要がない
  • ネストされたデータ項目（入れ子構造）を簡単に表現できる
  • 実装と管理が最も簡単で、ユーザーエラーが少ない

なぜ構造化データが必要なのか？

構造化データを設定すると、検索結果での表示が改善され、クリック率や滞在時間が向上します。

Googleの公式ドキュメントによると、実際に以下のような成果が報告されています。

  • Rotten Tomatoes：クリック率が25%増加
  • Food Network：トラフィックが35%増加
  • 楽天：構造化データを含むページでユーザーの滞在時間が1.5倍に
  • Nestlé：リッチリザルトが表示されたページでクリック率が82%向上

これらの数値からわかるように、構造化データは検索エンジンでの視認性を高め、結果的にブログへの訪問者数を増やす効果があります。

ブログ記事に最適な構造化データとは？

ブログ記事にはBlogPostingという種類の構造化データが最適です。

Schema.orgの公式ドキュメントによると、BlogPostingはArticleのより専門的なサブクラスで、ブログ投稿専用に設計されています。

BlogPostingの推奨プロパティ

Googleの公式ドキュメントによると、必須プロパティはありませんが、以下のプロパティが推奨されています。

  • headline：記事のタイトル
  • author：著者情報（PersonまたはOrganization）
  • datePublished：公開日（ISO 8601形式推奨）
  • dateModified：更新日（ISO 8601形式推奨）
  • image：記事を表す画像URL
  • articleBody：記事の本文
  • keywords：記事のタグや説明用語
  • wordCount：記事の文字数
  • inLanguage：記事の言語

特にauthor、datePublished、dateModifiedは、Googleが記事の信頼性と鮮度を理解するために重要です。

ArticleとBlogPostingの比較

項目

Article

BlogPosting

用途

汎用的な記事

ブログ投稿専用

Schema.orgでの位置づけ

基本クラス

Articleのサブクラス

検索エンジンへの伝わり方

記事であることは伝わる

ブログ記事であることが正確に伝わる

はてなブログのデフォルト

✓

-

推奨設定

-

✓

必要な作業

設定不要

JavaScript追加が必要

SEO効果

標準

より最適化される可能性がある

推奨：BlogPostingを設定することで、検索エンジンにコンテンツの種類をより正確に伝えられます。

構造化データが設定されているか確認する手順

はてなブログに構造化データが正しく設定されているかは、Googleのリッチリザルトテストで確認できます。

確認手順

  1. Googleリッチリザルトテストにアクセス
  2. 確認したいブログ記事のURLを入力
  3. 「URLをテスト」ボタンをクリック
  4. 数秒待つと、構造化データの検出結果が表示される 構造化データの検出結果(改善前)

確認するポイント

  • @typeがArticleまたはBlogPostingになっているか
  • headline（タイトル）が設定されているか
  • author（著者）が設定されているか
  • datePublished（公開日）が設定されているか
  • dateModified（更新日）が設定されているか
  • image（画像）が設定されているか
  • エラーや警告が表示されていないか

はてなブログで構造化データを変更する手順

先ほどの確認手順により、デフォルト設定では、@typeがArticleになっており、authorプロパティが設定されていないことがわかりました。なので、今回は @typeをBlogPostingに変更し、authorプロパティを追加します。 この方法で、僕も実際に構造化データを書き換えました。

設定には1分程度かかります。コピー&ペーストだけで完了します。

手順1：はてなブログ設定画面にアクセス 1. はてなブログにログイン 2. 画面左メニューの「設定」->「詳細設定」をクリック 詳細設定画面の開き方

手順2：スクリプトを追加する

  1. 詳細設定ページを下にスクロール
  2. 「<head>要素にメタデータを追加」という欄を見つける メタデータ追加欄
  3. 以下のコードを「<head>要素にメタデータを追加」欄にコピペ
  4. ページ下部の「保存する」ボタンをクリック
<script>
  (function () {
    var path = window.location.pathname;
    var jsonLdScript = document.querySelector(
      'script[type="application/ld+json"]',
    );

    if (!jsonLdScript) return;

    var structuredData = JSON.parse(jsonLdScript.innerText);

    // @contextをHTTPSに統一
    structuredData["@context"] = "https://schema.org";

    // パスで判定
    if (path.startsWith("/entry/")) {
      // 記事ページ: Article → BlogPosting に変更
      structuredData["@type"] = "BlogPosting";

      // authorを追加
      var authorName = document.documentElement.getAttribute("data-author");
      if (authorName) {
        structuredData["author"] = {
          "@type": "Person",
          name: authorName,
        };
      }
    }

    // 修正したデータで上書き
    jsonLdScript.innerText = JSON.stringify(structuredData);
  })();
</script>

手順3：設定を確認

  1. Googleリッチリザルトテストにアクセス
  2. 自分のブログ記事のURLを入力
  3. @typeがBlogPostingかつauthorが設定されていることを確認 構造化データ(改善後)

所要時間：1分

まとめ

はてなブログで構造化データを変更する方法を紹介しました。

設定内容

  • @typeをArticleからBlogPostingに変更
  • authorプロパティを追加

期待される効果

  • Googleの公式ドキュメントによると、構造化データを正しく設定した企業では、クリック率が25-82%増加、トラフィックが35%増加した事例がある
  • ブログ記事であることを検索エンジンに正確に伝えられる

はてなブログの<head>要素にメタデータを追加する機能を使えば、JavaScriptで既存の構造化データを上書きできます。

Q&A

最後に、この記事を読んで多くの方が抱くであろう疑問について、Q&A形式でお答えします。

構造化データを変更したら、すぐに検索結果に反映されますか？

いいえ、すぐには反映されません。

Googleが再クロールして構造化データを認識するまでに、数日から数週間かかる場合があります。Google Search Consoleの「URL検査」機能で、インデックス登録をリクエストすると、少し早く認識される可能性があります。

Articleのままではダメですか？BlogPostingに変更する必要はありますか？

Articleのままでも問題はありませんが、BlogPostingに変更したほうが正確です。

Schema.orgの公式ドキュメントによると、BlogPostingはArticleのサブクラスで、ブログ投稿専用に設計されています。検索エンジンにコンテンツの種類をより正確に伝えることで、適切な検索結果に表示される可能性が高まります。

このJavaScriptコードを追加すると、ページの表示速度は遅くなりますか？

ほとんど影響ありません。

このコードは非常にシンプルで、既存の構造化データを読み込んで一部を書き換えるだけです。ページの読み込みが完了した後に実行されるため、ユーザーが体感できるレベルでの速度低下はありません。

構造化データを変更したら、アクセス数は本当に増えますか？

必ず増えるとは限りませんが、増える可能性はあります。

Googleの公式ドキュメントによると、構造化データを正しく設定した企業では、クリック率が25-82%増加、トラフィックが35%増加した事例があります。ただし、これらはあくまで事例であり、記事の内容やキーワードの競合状況によって結果は異なります。

はてなブログの無料プランでもこの方法は使えますか？

はい、使えます。

<head>要素にメタデータを追加する機能は、はてなブログの無料プランでも利用できます。ただし、設定画面の場所や利用できる機能は、プランによって異なる場合があるので、はてなブログの公式ヘルプで確認してください。

このコードを追加したら、既存の構造化データが完全に消えてしまいませんか？

いいえ、消えません。

このコードは既存の構造化データを読み込んで、一部のプロパティ（@type、@context、author）だけを変更または追加します。他のプロパティ（headline、datePublishedなど）はそのまま残ります。

リッチリザルトテストでエラーが出た場合、どうすればいいですか？

エラーの内容を確認して、コードを修正します。

リッチリザルトテストでは、エラーの種類と内容が表示されます。例えば、「authorが必要です」というエラーが出た場合は、コードのauthor部分が正しく動作していない可能性があります。エラーメッセージをよく読んで、該当する箇所を確認してください。

構造化データを変更したら、はてなブログの他の機能に影響はありますか？

影響はありません。

このコードは、検索エンジンが読み取る構造化データのみを変更します。はてなブログの管理画面や、記事の表示、コメント機能などには一切影響しません。

参考

関連

mayogames.hatenablog.com

mayogames.hatenablog.com

mayogames.hatenablog.com