GoogleのSearch Consoleで全体の画面キャプチャを撮る方法です。
Google Search Consoleでページ全体のキャプチャが撮れない！
こんにちは、Mayaです。
SEO等のWebコンサルティングでクライアントに提出するレポートに
Google Search Console のグラフや検索パフォーマンスをキャプチャして使用することがあります。
そんな時に便利なのがWebブラウザに搭載されているキャプチャ機能。
通常のウェブサイトなら問題なく、ページ全体のキャプチャが撮れるのですが、
インラインフレームなどを使用したページは上手く撮れないことがあります。
新しくなったGoogleのSearch Consoleで全体の画面キャプチャを撮る方法
新しくなったGoogleのSearch Consoleも既存のキャプチャ機能やアドオン、
Windows10の新キャプチャ機能を使っても、ページ全体のキャプチャが撮れません。
今回は『Google Search Console』を例に、ページ全体のキャプチャ画像の撮り方についてご紹介します。
Google Search Consoleでページ全体のキャプチャが撮れない問題
旧バージョンのSearch Consoleでは、キャプチャ画像は簡単にとれていたのですが、
新バージョンになってからというもの、通常のキャプチャ機能では
ページ全体のスクリーンショットが上手く撮れないようになってしまいました。😕
実際に、Chromeのメジャーな拡張機能「FireShot」で撮影してみたのが下の画像です。↓
Chrome拡張機能やFirefoxアドオンでは画面全体のキャプチャが撮れない
実際のページでは、検索キーワードのリスト一覧で25行表示されているのですが、
キャプチャ画像はモニターで表示されているエリアのグラフと5行分のキーワードのみ。
これじゃあ「表示部分をキャプチャ」と変わらないよ～💦
さらに画像の所々にグレーで塗りつぶされたような箇所があり、
これでは使いものになりません･･･
他にもマイクロソフトのEdge、MozillaのFirefox、Vivaldiなど様々なWebブラウザで試みましたが、
どれもモニターで表示されている部分しかキャプチャ保存されず、ダメでした。
格闘すること30分。
ふと、「そういえば、Chromeのデベロッパーツールにもキャプチャ機能があったなぁ･･･」と思い出し、
試しに撮影してみたところ、ようやく全体のキャプチャがとれました。😀
キャプチャする際には、ちょっとしたコツがあるので、
ここからは画像付きで詳しく説明していきます。
Google Search Consoleのページ全体のキャプチャ画像を撮る方法です。
まずはChromeでキャプチャしたいサイト(Google Search Console)を開きます。
デベロッパーツールを選択します。
ブラウザ右上にある、点が縦に3つ並んだ「Google Chromeの設定」ボタンをクリックし、
「その他のツール」→「デベロッパーツール」を選択します。
※ デベロッパーツールは、F12キーを押下でも表示可能です。
デベロッパーツールが表示されたら
メニューにある「Toggle device toolbar」ボタンをクリックします。
デバイス表示エリアの上部にある、表示サイズを入力します。
横幅はPCブラウザなら1200～1300程度、縦は任意の長さを入力して下さい。
(長めに設定して、後からスライダーで調節することも可能です。)
Google Search Consoleのページ全体が表示されました。
するとGoogle Search Consoleのページ全体が表示されました。
画面全体のキャプチャを撮りたいページです。
このGoogle Search Consoleのページ全体が表示状態で、デバイス表示エリア右上にある、
点が3つにならんだ「More options」ボタンをクリックし、
「Capture full size screenshot」を選択します。
名前をつけて保存画面が表示されたら、
任意の保存場所を選び、ファイル名をつけて保存します。
Google Search Console画面全体のキャプチャが撮れました。
保存した場所へアクセスし、Google Search Consoleページ全体の
キャプチャ画像が撮れていることを確認できれば、完了です。
ちゃんとGoogle Search Console画面全体のキャプチャが撮れました。
以上の手順でGoogle Search Console画面全体のキャプチャが無事に撮れます。
お疲れさまでした。(｡･ω･｡)ノ
皆さんも、ページ全体のキャプチャ画像が上手く撮れない時は
是非お試し下さい。
金沢市のSEO対策とホームページ制作会社 IN-A-TRANZ ウェブデザイン事務所のホームページです。
https://in-a-tranz.net/
Comments