Google Chrome ブラウザでは、ウェブページのフル サイズのスクリーンショットをキャプチャする方法が 2 つあります。これは、開発者、デザイナー、編集者、マネージャー、ライター、アナリスト、またはその他の Web ベースのギグであろうと、多くの Web ワーカーにとって必要または有用です。

Chrome でフル サイズのウェブページのスクリーン ショットをキャプチャする方法を説明するには、Mac、Windows、Linux、Chromebook を含むデスクトップ レベルのデバイス用のフル バージョンの Chrome が必要です。Chrome で組み込みの開発者ツールを使用するため、プラグインは必要ありません。

ote ここではデスクトップ用の Chrome ブラウザについて説明します。必要に応じて、Firefox、Mac の Safari、iPhone および iPad の Safari でページ全体のスクリーンショットを撮ることもできます。

Chrome でフルサイズのスクロール スクリーンショットをキャプチャする方法

Chrome で Web ページのフル サイズのスクリーンショットを取得する準備はできましたか?すべきことは次のとおりです:

1. Chrome 開発者ツールを開く (> 開発者 > 開発者ツールを表示)



2. 開発者ツール ドロワーのレスポンシブ デザイン モード ボタンをクリックします



3. Web ページ全体を下にスクロールして、すべての画像が読み込まれるようにします (これは、Web ページを高速化するために使用される一般的な手法である遅延読み込み画像をキャプチャするために重要です)
4. レスポンシブ デザイン ツールの右上隅にある 3 つの縦のドットをクリックし、[フル サイズのスクリーンショットをキャプチャ] を選択します



5. フル サイズのスクリーンショットがデフォルトの Chrome ダウンロード フォルダに表示されます

Mac では、手動で変更しない限り、Web ページのフル サイズのスクリーンショットが [ユーザー ダウンロード] に表示されます。

キャプチャされたスクリーンショットのサイズは、レスポンシブ モードで選択したデバイスによって異なります。たとえば、iPad Air を選択し、osxdaily.com ホームページのフル サイズのスクロール スクリーンショットを撮影した場合、スクリーンショットは次のようになります。約 2084 × 16439 ピクセル。明らかに長いスタイルのページまたは

Web ページ全体をスクロールしないと、遅延ロードされた画像がスクリーンショットにキャプチャされないため、ページ全体のスクリーンショットが不完全になり、ユーザーがページで見ているものを表すことができなくなります。

Chrome でコンソール経由でページ全体のスクリーンショットをキャプチャする

Chrome でページ全体のスクリーンショットを撮るもう 1 つの方法は、開発者コンソールの「実行」コマンドを使用し、「スクリーンショット」と入力して、表示されるオプションから「フル サイズのスクリーンショットをキャプチャ」を選択することです。これを行う前に、ウェブページ全体をスクロールしてください。

これは一部のユーザーにとってはより良いオプションかもしれませんが、コマンドラインに慣れていない人にとっては少し複雑です.

Chrome 用のこれらの方法は、開発者ツールを使用して Mac 用 Safari で使用できる方法よりも簡単ですか?または、Firefox を使用して Mac で Web ページ全体のスクリーンショットを撮る超簡単な方法はありますか?それとも、iPhone や iPad を使ってページ全体のスクリーンショットを撮るもっと簡単な方法はありますか?それはあなた次第です。また、最も頻繁に使用するブラウザーと、それぞれのブラウザーの習熟度にも依存する可能性があります。