Seo on qwerty.work

Cloudflare Workers + Prerender.io で CSRサイトを SEO 対応する方法

Sat, 19 Apr 2025 00:09:27 +0900

このページの概要

Javascriptを多用したサイトや、ノーコードツールで制作したサイトがGoogle Search ConsoleではGoogleにインデックスされましたが、Bing Webmaster Toolsに登録してもBingにインデックスできないことが多々あります。Bingでは最初は空ページで、Javascriptが後からコンテンツを読み込んでくるページは認識しないみたいです。そこで、事前にレンダリングされた静的ページのキャッシュを用意し、検索エンジンのクローラーからのアクセスはそのキャッシュに誘導してページコンテンツを認識させるといった方法があったのでメモ。

目的

- クライアントサイドレンダリング（CSR）で動作するJavaScriptサイトを Google や Bing にインデックスさせる
- クローラー（bot）にだけ静的HTMLを返す仕組みを構築する

必要なもの（すべて無料で始められます）

- [Cloudflare](https://www.cloudflare.com/) アカウント
- [GitHub](https://github.com/) アカウント
- [Prerender.io](https://prerender.io/) アカウント
- 対象ドメインのDNSを Cloudflare DNS に変更すること
- コマンド実行環境（Windows: PowerShell / macOS/Linux: ターミナル）

ざっくりとした仕組みの流れ

Prerender.ioで静的ページのキャッシュを作成し、CloudFlareのWorkersを使って検索ボットのアクセスはPrerender.ioのキャッシュに誘導し、それ以外のアクセスは通常サイトが配信されるようにします。これを行うためにはCloudFlare Workersに登録するスクリプトをGitHubまたはGitLabに置き、それを読み込ませます。

手順

- Prerender.io に登録し、APIトークンを取得
- Cloudflare にドメインを追加（ネームサーバー変更）
- GitHub に新しいリポジトリを作成（例: `cf-prerender-multisite`）
- 以下の 2 ファイルを作成して GitHub に push

src/index.js

export default {
  async fetch(request, env, ctx) {
    const url = new URL(request.url)
    const pathname = url.pathname
    const userAgent = request.headers.get("user-agent") || ""
    const isBot = /bot|crawl|spider|slurp|bing/i.test(userAgent)

    // .xml や .txt で終わるパスは除外（Prerender.ioを経由させない）
    const isStaticFile = pathname.endsWith(".xml") || pathname.endsWith(".txt")
    if (isStaticFile) {
      return fetch(request)
    }

    const token = "YOUR_API_TOKEN"

    if (isBot) {
      const prerenderUrl = `https://service.prerender.io/https://${url.hostname}${url.pathname}${url.search}`
      return fetch(prerenderUrl, {
        headers: {
          'X-Prerender-Token': token
        }
      })
    }

    return fetch(request)
  }
}

wrangler.toml

name = "prerender-multisite"
main = "src/index.js"
compatibility_date = "2024-04-15"

[[routes]]
pattern = "example.com/*"
zone_name = "example.com"

- Cloudflare Pages に GitHub を接続して「空のWorker」としてデプロイ
- Cloudflare DNS の A レコードで ☁️（プロキシ）を ON にする
- Cloudflare の「SSL/TLS」を フル（Strict） に変更（リダイレクトループ回避）
- Cloudflare の対象ドメイン選択した中の Wokers＆Pages の編集で「リクエスト制限失敗モード」と「失敗オープン (続行)」に変更（504エラー対応）
- Cloudflare Caching 構成 で Crawler Hints を ON にする（Index Now 対応）

デバッグ方法（PowerShell / ターミナルで実行）

- Googlebot になりすましてHTMLを取得

curl -A "Googlebot" https://example.com/

- ヘッダーのみを取得してステータス確認

curl -A "Googlebot" -I https://example.com/

- Prerender.io に直接アクセスしてHTMLを確認

curl -H "X-Prerender-Token: YOUR_API_TOKEN" "https://service.prerender.io/https://example.com/"

- Cloudflare ダッシュボードの「Workerログ」でリクエスト確認
- Chromeのデベロッパーツールで User-Agent を Googlebot に変更して動作確認
- [Prerender.io Dashboard](https://prerender.io/dashboard) の「Recently Cached Pages」を確認

成功時のレスポンス例

HTTP/1.1 200 OK
Server: cloudflare
X-Prerender-Requestid: xxxxxxxx
X-Prerender-External-Lb: haproxy-private-cache

まとめ

- Cloudflare Worker + Prerender.io の組み合わせで SEO に強い構成が実現
- 通常ユーザーには動的なSTUDIOサイト、Botには高速なHTMLを返す
- すべて無料で始められ、Cloudflare上で完結するため保守も簡単

結果

Bing検索のインデックスに成功しました。トータルで約1週間ほどかかりました。経過として、この方法でBing Webmaster Toolsで改めて「URL検査」メニューから「インデックス作成を要求」を実行して、4～5日後にステータスが「正常にインデックスが付きました」に変わりました。しかし、すぐにはBing検索の結果に表示されず、それから約3日後に検索結果として表示されるようになりました。

その他の選択肢

- 
  [Cloudflare Browser Rendering](https://developers.cloudflare.com/browser-rendering/)  
  公式のヘッドレスブラウザ機能。Cloudflare Workersと統合可能ですが、Prerender.ioよりやや設定が複雑です。

- 
  [Rendertron](https://github.com/GoogleChrome/rendertron)  
  Google製のオープンソースレンダラー。自前でデプロイが必要（[Google Cloud Run](https://cloud.google.com/run) などを使用）。

- 
  Firebase Hosting + SSR や Next.js の Incremental Static Regeneration（ISR）など、フレームワーク側でのSEO対策も手段の一つです。

その後の実験

無事にBingに登録されましたが、登録後にDNSサーバーを元に戻し、Cloudflare WorkersとPrerender.ioの仕組みを外した場合、Bingボットが改めてページをクロールしたらどうなるか実験したいと思います。数ヶ月かかるかもしれないので、履歴を書いておきます。

2025-04-25　Bing Webmaster ToolsのURL検索で表示が「正常にインデックスが付きました　URL は Bing に表示できます」となった
2025-04-26　Bing検索で検索結果に表示されたのを確認
2025-04-28　DNSサーバーをお名前ドットコムに戻した

STUDIOで制作したサイトがBingにインデックスされない問題

Tue, 15 Apr 2025 08:57:22 +0900

Bing Webmaster Toolsに登録してもインデックスされない

ウェブサイト制作のノーコードプラットホーム「STUDIO」で作成したサイトをBingウェブマスターツールに登録しても検索エンジンBingにインデックスされなくなりました。

以前はヘルプデスクに日本語から英文に翻訳した文章で問い合わせしたら、2023年頃は手動で解決してくれていたのですが、2024年のいつ頃からか対応してくれなくなりました。

発見されましたがクロールされていません URL は Bing に表示できません

検査された URL は Bing に認識されていますが、いくつかの問題があるためにインデックス作成が妨げられています。Bing Web マスターガイドラインに従って、インデックス作成の機会を増やすことを推奨します。

以前は以下のページにある方法でBing Webマスターサポートに問い合わせして解決できていました。

https://qwerty.work/blog/2022/05/bing-webmaster-tools-request-index.php

インデックスされない理由

Bing Webmaster Toolsには以下の理由が表示されていました。

H1タグが見当らない
DESCRIPTIONが見当たらない

STUDIOで制作したどのサイトもBing WebmasterToolsに登録すると、このエラーが出ます。もちろん制作時にH1やサイトの概要は設定していますが、どうやらここが問題ではなさそうです。

原因はJavascriptによる仕組？

何がいけないのか調べたところ、Javascriptにより動的に吐き出しているサイトがダメで、STUDIOの仕組み上に問題があるっぽいです。

このことについてはBingのヘルプにも説明があります。

JavaScript: Bing はJavaScript を処理できますが、HTTP リクエスト数を最小限に抑えながら大規模な JavaScript を処理するには限界があります。Bing では、 Bingbot などの特定のユーザーエージェント、特に大規模なウェブサイトでは、クライアント側でレンダリングされたコンテンツと事前レンダリングされたコンテンツを切り替えるために、ダイナミックレンダリングを推奨しています。

（参考 https://www.bing.com/webmasters/help/webmasters-guidelines-30fba23a

STUDIO Communityでも触れられていました。

動的サイトといってもPHPのようにサーバーサイドでHTMLを吐き出すものはいいのですが、Javascriptでもクライアントサイドで動くものがダメみたいです。

Bingのシェアは10%台で低いとは言え、クライアントから「検索に結果にヒットしない」と言われると困ります。

そろそろ無視できないレベルにきていますので、BingもSTUDIOも早く対応して欲しいです。

Bing Webmaster Toolsがエラーで開けないとき

Tue, 16 Jan 2024 00:00:00 +0000

「ご希望のページは利用できません」というエラー

Bingに新しく制作したサイトを登録しようとして、Bing Webamaster Toolsを検索エンジンやブックマークから開こうとすると以下のようなエラーページが表示され、管理画面に入れませんでした。2～3日ほど日を置きましたが状況は変わらず。

ご希望のページは利用できません

現在サービスの復旧に努めています。
お試しください
更新ページ — 一時的な問題が発生している可能性があります。
このメッセージが再度表示された場合は、後でもう一度確認してください。

クッキー削除で解決

サイトにトラブルがあるのかな？こんなに何日も復旧できないとかおかしくない？と、モヤモヤしていたのですが、原因はクッキーでした。ブラウザからcookieを削除したら解決できました。

ブラウザからクッキーを削除する方法

Google Chromeの場合

ブラウザメニューから**「閲覧履歴を消去」**またはCtrl+Shift+Delで表示される以下の画面から削除実行する。

Microsoft Edgeの場合

ブラウザメニューから**[設定]-[プライバシー、検索、サービス]の画面から、[閲覧データをクリアする]にある「クリアするデータの選択」**またはCtrl+Shift+Delで表示される以下の画面から削除実行する。

【Bing】クロールを待たずにインデックスさせるIndexNowの使い方と登録方法

Wed, 14 Sep 2022 22:31:59 +0900

新しいサイトを制作した際、GoogleとYahooはすぐに検索エンジンに登録されますが、Bingはなかなかクロールしてくれず、登録に1ヶ月近くかかることがあります。どうやったらBingに早くインデックスさせることができるか調べていると、IndexNow（インデックスナウ）とい仕組みがあることを知りました。

IndexNowとは

2021/10/18にMicrosoft Bing と Yandex はともに、IndexNow（インデックスナウ）という名称の、検索エンジンのインデックスのための新しい仕組みが公開されました。

https://blogs.bing.com/webmaster/october-2021/IndexNow-Instantly-Index-your-web-content-in-Search-Engines https://blogs.bing.com/webmaster/october-2021/IndexNow-Instantly-Index-your-web-content-in-Search-Engines

通常、検索エンジンの検索結果にWEBページが表示されるようにするためには、Google Search ConsoleやBing Webmaster Toolsなどからインデックス作成を要求して、検索ロボットのクロールを待たなければなりませんが、IndexNow を利用すると、クロールを必要とせずに、コンテンツの追加・更新・削除を検索エンジンに即座に通知できます。

https://www.indexnow.org/ja_jp/index https://www.indexnow.org/ja_jp/index

Googleは対応も予定も今のところなさそうです。

IndexNowで通知できる検索エンジン

この記事を投稿した現在では、検索エンジンではBingとYandexだけのようです。今後、他の検索エンジンにも広がりを見せるかもしれません。

Bingへの通知方法

通知方法はAPIキーを記載したURLにアクセスするだけです。

リクエストURL例

一つのURLをBingにインデックスに登録を通知する場合は以下のようになります。実際にブラウザからアクセスした場合、正常であっても異常であっても真っ白な画面が表示されるだけです。

https://www.bing.com/IndexNow?url=https://example.com/index.html&key=your-api-key

通知したいURLのhttps://は無くてもいいみたいです。

複数のURLをまとめて送信する方法も存在します。以下の公式サイトのページにその方法が記載されています。

https://www.indexnow.org/ja_jp/documentation https://www.indexnow.org/ja_jp/documentation

通知のリクエストを送信するための準備

IndexNowのプロトコルを使用してリクエストを送信するためには以下の2つの準備が必要です。

APIキーの取得
認証ファイルの設置

APIキーの取得

Bingに通知をしたい場合、APIキーを取得する方法は以下の2つがあります。

Bing.com内のIndexNowのページから取得する方法
Bing Webmaseter Toolsの設定から取得する方法

認証ファイルの設置

APIキーを取得して通知を承認しても、承認ができないをBingが受付してくれません。簡単な方法としてはサイトのルートにべリファイファイルをアップロードすることです。APIキーを名前にしたテキストファイル（中身は空でOK）をアップロードします。

例

例えば取得したAPIキーがa12345146aae4bcfac00eaba54c*****だった場合。

a12345146aae4bcfac00eaba54c*****.txt

具体的なAPIキー取得からリクエストまでの手順

Bing.com内のIndexNowのページから取得する場合

以下のページにアクセス。

https://www.bing.com/indexnow https://www.bing.com/indexnow

**[Generate API Key]**からべリファイファイルをダウンロード

**「f7fd134664864a6e8bc13885a4*******.txt」**というファイルがダウンロードされます。 

キーの値を変更したいときは**[Generate]**ボタンで変更できます。

ダウンロードしたファイルを管理しているサイトのルートディレクトリにアップロード。

「f7fd134664864a6e8bc13885a4*****.txt」**をアップロード。
リクエストURLを作成してブラウザからアクセスしたらIndexNowに通知完了。

例えば、https://exmaple.com/***.htmlだった場合、

https://www.bing.com/indexnow?url=https://example.com/product.html&key=f7fd134664864a6e8bc13885a4*******

あとはBingに登録されるのを待つ。

以上。

Bing Webmaseter Toolの設定から取得する場合

Bing.com内のIndexNowのページを開く。
*[設定]メニューから[APIアクセス]を選択。
**[APIキー]**を選択。

まだAPIキーが発行されていなかったら**「キー生成」と表示されますが、既にAPIキーを発行していた場合は「APIキーを表示」**となっています。
**[APIキーを生成]**ボタンを押す。
APIキーをコピー。
サイト認証用のベリファイファイルを作成。

APIキー.txt

48535c8d4ce74*******************.txt

ベリファイファイルをサイトのルートディレクトにアップロード。
リクエストURLを作成してブラウザからアクセスしたらIndexNowに通知完了。

例えば、https://exmaple.com/***.htmlだった場合、

https://www.bing.com/indexnow?url=https://example.com/product.html&key=48535c8d4ce74*******************

以上。

通知を受け取ってもらえたか確認する方法

Bing Webmaseter Toolsを使用している場合はIndexNowのメニューから確認ができます。

リンクを開いて通知を送信した場合はソースの欄に「Self」と表示されます。送信が失敗している時は以下のような画面になっていると思います。

簡単に使うプラグイン等

CMSなどブログシステムやクラウドサービスによっては標準でIndexNowに更新通知を行ってくれるものもあるようです。有名なところではWordpressのIndexNowプラグインや、CDNにCloudFlareを使っている場合は、**[Caching]-[構成]の画面にある[Crawler Hints]**をオンにすることで、自動的に複数のインデックス通知が送信されます。

ちなみに**[Crawler Hints]**から送信されたときのBing Webmaseter Toolsの画面は以下のようになっています。

その他IndexNow対応サービス

以下のマイクロソフトBingブログによると、WixやAkamaiも対応の予定があるようです。Googleの対応は予定も今のところなさそうです。ただ、Googleでは同じような仕組みのIndexing APIがありますが、Index Nowのような簡単さではないようです。

まとめ

今まで時間がかかっていたBingの登録も、これで早くなる気がします。

Background-imageの画像をLozad.jsで遅延表示させる方法

Mon, 05 Sep 2022 15:54:04 +0900

Background-imageの画像をLazyload

WEBページの表示の高速化させるために画像を遅延表示させるLazyloadのJSがいろいろありますが、軽量で使いやすいと言われているLozad.jsを使用しています。IMGタグやIFLAMEタグにclass="loazad"を加えれば簡単に使えるのですが、LighthouseなどのベンチマークでCCSのBackground-imageで指定した画像を遅延表示した方がよいとアドバイスを受けることがありました。

Background-imageの画像も遅延表示できる

そもそもBackground-imageで指定した画像を遅延表示できるのか？と疑問に感じていましたが、できることが分かりました。Lozad.jsでできる見たいです。やり方については以下のページを参考にさせていただきました。

参考ページ

https://qiita.com/ChiJ_SeaW/items/40e8d05b8c0c5f920752 https://qiita.com/ChiJ_SeaW/items/40e8d05b8c0c5f920752

https://paralux.co.jp/blog/397 https://paralux.co.jp/blog/397

ソース例

AタグやDIVなど、IMGタグやIFLAMEタグ以外でも、CSSでBackground-imageを設定しているタグにclass="loazad"とstyle="background-image: url();"とdata-background-image="img.jpg"を加えればいいみたいです。

<div class="lozad" style="background-image: url();" data-background-image="img.jpg">

私の場合、class="loazad"を加えるだけでスコアの改善ができました。

検索エンジンでドメインのインデックス登録があるか確認する検索書式

Fri, 06 May 2022 22:25:53 +0900

新しいサイトが登録されたか確認したい

新しく取得したドメインでサイトを公開し、Google Search ConsoleやBing Webmaster Toolsでサイトの登録を行ったあと、検索エンジンで検索ヒットするかどうか確認したいとき、以下の書式で検索すると確認できます。

GoogleとYahoo

site:qwerty.work

Bing

url:https://qwerty.work

Bingで「url:https://qwerty.work」を検索

Bing Webmaster Toolsでページに問題がないのにインデックスされないとき

Fri, 06 May 2022 21:43:32 +0900

Bingにインデックスされず困った

Google Search Consoleでは問題なくインデックスされ、GoogleでもYahooでも検索でヒットするようになったページをBing Webmaster Toolsで、**「サイトマップ」の送信や「URL送信」をしても20日くらい待ちましたが、「ページに問題があります」**と表示されたままインデックスされませんでした。

他のサイト制作においても以下の内容が表示されることがありました。

インデックスが付きましたが、サービスを提供できません

URLはBingに表示出来ませんページのソースをどう見ても問題がなさそうで、**「URL検査」から「インデックスを要求する」**をしても変化がありませんでした。

サポートに連絡

Bingの検索エンジン登録についていろいろ調べると、

1ヶ月待ったらインデックスされた
3ヶ月～半年はかかる
数か月かかるの当たり前

みたいな情報が目についたので、**「もうしばらく待つか…。」**とも思いましたが、しびれを切らしてBing Webマスターサポートに連絡することにしました。

Bing Webマスターサポートは英語で問い合わせで、返事も英語のメールが届きます。

https://www.bing.com/webmasters/help/webmasters-support-24ab5ebf https://www.bing.com/webmasters/help/webmasters-support-24ab5ebf

連絡方法

Bing Webmaster Tools内から「Bing Webマスターのサポート」ページに行き、**「Raise support request」ボタンから、各種質問フォームに入力していくのですが、メッセージの欄（Be specific when describing your problem. The details that you include enable us to send you the most likely solution to your issue:と説明のある欄）に日本語で「ページに問題がなさそうなのにインデックスされない」**といった問い合わせ内容をDeepLで英語に翻訳して連絡しました。

ページに問題がなさそうなのにインデックスされなくて困っています。対応をお願いします。

I am having trouble getting the page to index even though it looks fine. Please help us.

その日の内にあっさり解決

すると、その日のうちに返信メールが届き、無事にインデックスされました。このレスポンスの速さにビックリです。

確認のため、Bing Webmaster Toolsの「URL検査」を行うと、以下の内容が表示されました。

正常にインデックスが付きました

URLはBingに表示できます

IndexNowを利用する方法も

有効かどうかはわかりませんが、クロールを待たずに検索エンジンに対してインデックスを依頼するIndexNowという機能をMicorosoftが公開しているようです。現在対応している検索エンジンはBingとYandexだけみたいですが、APIキーを取得してリンクをクリックするだけでBingにサイトの更新を知らせるできるようです。通知をするだけですぐにインデックスしてくれるかわかりませんが、以下のページを参考にやり方をメモ。

https://www.suzukikenichi.com/blog/bing-and-yandex-support-indexnow-to-immediately-index-content-without-crawling/ https://www.suzukikenichi.com/blog/bing-and-yandex-support-indexnow-to-immediately-index-content-without-crawling/

利用の手順

APIキーの取得
APIキーを名前にしたテキストファイルの設置
URLを開いて更新通知

APIキーの取得

Bing Webmaster Toolsの**[設定]-[APIアクセス]-[APIキー]-[APIキー生成]**に進み、APIキーを取得します。

APIキーを名前にしたテキストファイルの設置

a12345146aae4bcfac00eaba54c*****.txt

サイトのルートに以下のテキストファイルを設置します

URLを開いて更新通知

そして、以下のようなリンクを作成し、ブラウザからアセスするだけです。アクセスして更新通知に成功しても真っ白な画面が表示されます。

https://www.bing.com/IndexNow?url=送信したいページのURL&key=取得したAPIキー

https://www.bing.com/indexnow?url=http://www.example.com/product.html&key=a12345146aae4bcfac00eaba54c*****

複数のURLを同時に送信することもできるみたいです。またWordpressにはIndexNowのプラグインもあるようです。

参考サイト

https://www.indexnow.org/ja_jp/index https://www.indexnow.org/ja_jp/index

https://www.bing.com/indexnow#implementation https://www.bing.com/indexnow#implementation

https://wordpress.org/plugins/indexnow/ https://wordpress.org/plugins/indexnow/

特定のページの流入元になった検索キーワードをアナリティクスではなくSearchConsoleで調べる方法

Fri, 09 Apr 2021 23:27:34 +0900

特定のページがどんな検索キーワードから訪問されているかを知りたい

Googleアナリティクスでページの訪問状況を確認できますが、**特定のURLのページがどんなキーワードで検索ヒットして流入があるのか？**を調べたいのですが、GoogleAnalyticsで調べるためにはどのように操作すればよいか表示方法がよくわかりませんでした。

しかし、Google SearchConsoleで訪問に使用された検索キーワードをURLを指定して調べることができましたので、その方法をメモ。

特定のURLに絞った検索キーワード結果例

参考として『Windows10でWEBカメラ/マイク/スピーカーの動作確認を行う3つのテストツールと方法』というページを対象に検索キーワードを調べた場合の結果の表示画面の一部。WEBページがどのようなキーワードでヒットしているか分かります。

SearchConsoleで調べる方法

検索条件にURLを追加

メニューから**［検索パフォーマンス］**を選択して表示された画面。検索条件に「ページのURL」を追加して検索すると、このように個別に特定のページに絞って検索に使用されたキーワードが表示されます。

直接URLから検索結果を開く方法

以下のURLをブラウザのアドレスバーに入力してEnterを押せば、Google SearchConsoleが表示され、特定のURLのページにどんなキーワードで検索されて飛んで来たかわかります。

書式

https://search.google.com/search-console/performance/search-analytics?resource_id=サイトドメイン&hl=ja&page=*調査したいURL

URL例

このページの検索パフォーマンスページを開く場合。コピーして使用する際はURLエンコードしたご自身のサイトのURLに置き換えてください。

https://search.google.com/search-console/performance/search-analytics?resource_id=https%3A%2F%2Fqwerty.work%2F&hl=ja&page=*https%3A%2F%2Fqwerty.work%2Fblog%2F2021%2F04%2Fsearchconsole-keyword-url.php

PHPでリンクを作成する方法

上記のURLをブログやWEBページにPHPで埋め込みたいときに使えます。

<a href="https://search.google.com/search-console/performance/search-analytics?resource_id=<?php echo urlencode((empty($_SERVER['HTTPS']) ? 'http://' : 'https://') . $_SERVER['HTTP_HOST'] . '/');?>&hl=ja&page=*<?php echo urlencode((empty($_SERVER['HTTPS']) ? 'http://' : 'https://').$_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']);?>" target="_blank">SearchConsole-検索クエリ</a>

【2020年5月】AdSenseの収益とページビュー・ユーザーが急に減ってきた

Sun, 24 May 2020 20:31:08 +0900

4月末あたりからなんかおかしいぞ

4月末あたりから、一日あたりの**AdSenseの収益が通常の半額から1/3まで減ってきました。**どういうこっちゃ？

なんかペナルティでもくらってるのかな？
たまたまクリック率が低かったのかな？
ゴールデンウィークだからかな？
まあゴールデンウィークとコロナのテレワーク生活が終われば復活するでしょう

と2～3日様子を見ていたのですが、状況は変わりませんでした。こままじゃまずいぞということで、

サイトの表示スピード高速化
広告の配置を変更

などを試しては1～2日様子を見ては変更を加えていきましたが、全然改善されません。

先月と比べてページビューが10万も減少している…。

Googleアナリティクスで訪問者数やページビューを調べてみました。

直近6ヶ月のアクセス状況

期間
ユーザー
新規ユーザー
セッション
ページビュー




  2019/11/25～2019/12/25
  67,088
  61,722
  78,055
  173,249


  2019/12/25～2020/01/24
  69,626
  64,679
  81,256
  182,522


  2020/01/25～2020/02/24
  70,798
  65,526
  83,324
  186,429


  2020/02/25～2020/03/24
  70,494
  65,032
  83,197
  185,985


  2020/03/25～2020/04/24
  81,977
  76,750
  96,546
  212,513


  2020/04/25～2020/05/24
  55,510
  51,709
  64,614
  116,153


  平均
  69,249
  64,236
  81,165
  176,142

ページビューに関しては前月まで順調に上がってきて月間20万PVを達成できたのに、いきなり半分の10万PVに…。平均値と比べても約5万PV減少しています。

訪問者に関しても前月に比べて-25,000～-30,000ユーザー減っています。

そりゃ収益下がるわ！

AdSenseもインプレッション収益が下がっていた

AdSenseのレポートは同じように直近6ヶ月の月別の値を調べてみました。

ページCTR … 平均0.95％で、どの月も平均値とほぼ同じで変化なし
クリック率 … 平均0.22％で、どの月も平均値とほぼ同じで変化なし
ページインプレッション収益 … 平均の半額まで落ちてた
インプレッション収益 … 平均の半額まで落ちてた

一番落ちて欲しくないインプレッション収益が半分になっていました。もしかしてページの価値が下がった？！

Googleのコアアルゴリズムアップデートが原因！？

ページビューが10万も下がり、インプレッション収益も半分に…何かあったのかな？と検索してみたら2020年5月5日にGoogleのコアアルゴリズムアップデートがあったみたいです。これが原因かも？

順位の変動で検索ヒット率が下がったこと
低収益なジャンルに分類されたこと

こうなったんじゃないかと思います。いろんなSEO関連のブログを検索してみたところ、今回のコアアップデートで、「健康と医学」「財務、金融、法律」といったYMYL系のキーワードを含めて各ジャンルの順位変動幅が軒並み大きくなっているそうです。

私のように**『順位が下がった＆アクセス数減＆収益減』の方もいれば、逆に『順位が上がった＆アクセス数増＆収益増』**の方もいらっしゃるかと思います。

今後どうする？

今はコロナウィルスのことで生活が普通とは状況が違うと思うので、検索に関しても通常とは違う検索が多くされているのではないかと思います。他にもコロナウィルス感染拡大によって企業の業績悪化に伴い広告宣伝費の低下もあるかもしれません。しかし、普通の生活に戻ったからと言って、今回のコアアップデートでかなり検索ヒット率が変わっていて、元の水準に戻らないかもしれませんので、いろいろチューニングを施さなきゃなと思っています。

たとえ高収益でも焦って無理に不得意なジャンル変更はしない
今あるページや今後投稿する内容をより詳細なものにしていく
もっと読みやすいレイアウトやデザインにしていく
今まであまり気にしていなかった順位や収益を分析して細かい変動に対処する

特に今すぐできる特効薬みたいな方法も見当たりませんし、トップアフィリエイターがやっているようなことはマネできないと思いますが（他に趣味があるのでそんなに労力かけれないので）、それなりに以前の水準に戻す努力を焦らずコツコツやるしかないって感じですね。

ちょっと気にして見たブログ

https://buzzence.com/blog/blog-owakon/ https://buzzence.com/blog/blog-owakon/

https://yuushablog.info/google-adsense/ https://yuushablog.info/google-adsense/

https://www.sho-design.net/adsense-million-earning/ https://www.sho-design.net/adsense-million-earning/

https://halohalo.space/archives/5492 https://halohalo.space/archives/5492

zenbackをGoogle Tag Managerで遅延読み込みさせる

Sun, 17 May 2020 17:23:37 +0900

ページ読み込みスピードを上げるために遅延させたい

最近では不要かもしれませんが、SEO対策の被リンク対応の一つとしてzenbackを導入しているのですが、これを導入することにより、zenbackウィジェットに必要なJSとかjQueryが降ってきます

//w.zenback.jp/v1/?base_uri=***
//w.zenback.jp/_p/js/jquery.min.js

ページの最下部に表示しているので、真っ先にzenbackを読み込む必要ながないので、いくつかのパターンで遅延させることができないかなと思いました。

画面スクロールされたら読み込み開始
ページ表示開始の数秒後に読み込み開始
zenbackが表示される部分が登場したら読込開始

これのどれか、または全部で遅延できる手段が何かないかなといろいろ探したら、Google Tag Manager で簡単にできることが分かったのメモ。

jQueryのLazy Loadとか、Javascriptで非同期や遅延読み込むする方法もありますが、Google Tag Manager を使う方法が最もシンプルで簡単でいいかもしれません。いろいろな条件でいろいろなタグを組み込めるので最近ハマっています。

Google Tag Managerで遅延表示させる方法

Google Tag Manager がどういう物かの説明は省きます。

1. 『新しいタグ』をクリック

2. タグを追加するため右上の鉛筆マークをクリック

3. 『カスタムHTML』を選択

4. zenbackのタグを貼り付ける

実際には以下のように改変して貼り付けています。``とJavascriptを分離して、Javascriptの部分だけを貼り付けています。

<!-- X:S ZenBackWidget -->
<script type="text/javascript">
 !function(d,i){
 if(!d.getElementById(i)){
 // オリジナル var r=Math.ceil((new Date()*1)*Math.random());
 var r = new Date();
 var r = ''+r.getFullYear()+('0'+r.getMonth()).slice(-2) ;  //randの値を年月（例 202005）にする 
 var j=d.createElement("script");
 j.id=i;
 j.async=true;j.src="//w.zenback.jp/v1/?base_uri=http%3A//qwerty.work&nsid=XXXXXXXXXXXXXXXXXX%3A%3AXXXXXXXXXXXXXXXXXXX&rand="+r;
 d.body.appendChild(j);}}(document,"zenback-widget-js");
 </script>
<!-- X:E ZenBackWidget -->

****はウィジェットを表示させる部分に記載します。**「document.writeをサポートする」や「詳細設定」**は特に設定しませんでした。

※ページ下部でも記載していますが、このタグが空のままだと失敗しますので、ご注意ください。

5. トリガーを追加するため鉛筆マークをクリック

6. 新しいトリガーを作成するので + マークをクリック

7. トリガーの名前を付けて鉛筆マークをクリック

8. 『要素の表示』を選択

10. 保存して閉じる

11. 『公開』ボタンをクリック

公開しないと設定しただけで終わるので注意。公開ボタンを押すとバージョン名を設定する画面に進みます。

12. バージョン名を設定して『公開』して完了

追加や変更があった場合、バージョン名を設定して公開ボタンを押さないと反映されません。私の場合。バージョン名は日付にしていますが、**『zenback追加』**とかここは何でもいいです。最後に『公開』ボタンを押したら作業は完了です。

ウィジェットが表示されないとき

最初、タグの登録が終わって、ページ表示テストをしたときzenbackのウィジェットが表示されませんでした。以下のページによると、要素（``）が空だと高さ判定で弾かれ、トリガーが発動しないみたいです。

https://jdash.info/archives/Google_Tag_Manager_Element_Visibility_Trigger_not_fire https://jdash.info/archives/Google_Tag_Manager_Element_Visibility_Trigger_not_fire

私の場合、仮にタグを以下のように「その他お知らせ」を追加したところうまく表示できました。

<div id="zenback-widget-loader"></div>

↓

<div id="zenback-widget-loader">その他お知らせ</div>

複数のトリガーを設定しておいた方がいいかも？

今回は参考にzenback-widget-loaderという要素が現れたら表示するようにしましたが、検索ロボットが来たときはどうなるだろう？という疑問が残りました。今回の場合、ページ下部までスクロールされれば表示されますが、スクロールされなければ表示されず無い物という扱いになうのではないかと思いました。

折角設置しているのに無い物扱いだと意味がないので、今回の**『要素の表示』と『タイマー』を組み合わせ**て、スクロールされなくても3～5秒後には強制表示みたいなことをしておけば安心かもしれません。

PageSpeed Insightsで100点が出た！！

これが効いたのかどうかわかりませんが、この記事を投稿した直後にPageSpeed Insightsで計測したら100点でした。マグレでも嬉しいです。

Braveなどでは表示されなくなるので注意！！

Google ChromeやEdgeでは問題ないのですが、Braveなどセキュリティ要素が強いブラウザではzenbackウィジェットが表示されなくなるので注意してください。Google Tag Managerのタグの書き方で回避できるかもしれませんが、それはまた今度探そうと思います。

Yahoo、Google、bingのスタッフブログ

Sat, 05 Sep 2009 12:32:20 +0900

Yahoo!検索スタッフブログ 日々成長を続けるYahoo!検索。その戦略、サービスの詳細、Tipsなどを開発の現場から発信。 http://searchblog.yahoo.co.jp/

Google Japan Blog 日々成長を続けるYahoo!検索。その戦略、サービスの詳細、Tipsなどを開発の現場から発信。 http://googlejapan.blogspot.com/

日々是検索 検索窓からこんにちは! Microsoftの検索サービス・Bing(日本語読み：ビング）担当スタッフのブログです。タイトルと紹介文を編集する前に、[保存] をクリックして、デザインに対する変更内容を保存します。 http://searcheveryday.spaces.live.com/