スクリーンショットツールは、2 つのモードで任意のウェブページを高品質な画像として保存します。表示エリアモード(ブラウザウィンドウに表示されている内容をそのまま)と、フルページモード(折り返し以下のコンテンツを含む、ページ全体を上から下まで)です。スクリーンショットは高解像度の PNG ファイルとして即座にデバイスへダウンロードされます。クラウドへのアップロードなし、アカウント不要、待ち時間なし。
OS 標準のスクリーンショット機能(Cmd+Shift+4 やスニッピングツールなど)はブラウザの UI やツールバー、他のウィンドウまで一緒にキャプチャしてしまい、スクロール先のコンテンツは撮れません。DevSuite Pro のスクリーンショットツールはその両方の問題を解決します。ウェブページのコンテンツだけをキャプチャし(ブラウザ UI を含まない)、ページ全体を自動スクロールしてシームレスなフルページ画像を生成できます。表示エリアモードは Chrome のネイティブキャプチャ API を使用してピクセル単位の精度を実現します。フルページモードは自動スクロールしながら各ビューポートタイルをキャプチャし、1 枚の連続した画像に合成します。出力はディスプレイのデバイスピクセル比に合わせたフル解像度の PNG なので、Retina や HiDPI ディスプレイでも鮮明に表示されます。
ブラウザのビューポートに表示されている内容をそのままキャプチャします。ブラウザの UI、ツールバー、スクロールバーは含まれません。画面に映っているウェブページのコンテンツだけを 1 クリックで即座に取得できます。
折り返し以下のすべてのコンテンツを含む、ページの最上部から最下部までをキャプチャします。ツールが自動的にページをスクロールし、各セクションをキャプチャしてタイルを 1 枚のシームレスな連続画像に合成します。長さを問わずあらゆるページに対応しています。
ディスプレイのネイティブピクセル比(Retina では 2x、一部の Windows ディスプレイでは 1.5x)でキャプチャします。OS スクリーンショットで起こるぼやけたアップスケールとは異なり、ズームインしても鮮明な高解像度画像が得られます。
キャプチャした画像はロスレスの PNG ファイルとしてすぐにデバイスへ直接ダウンロードされます。クラウドへのアップロード、処理待ち、アカウントは不要です。数秒以内にダウンロードフォルダにファイルが保存されます。
キャプチャにはウェブページのコンテンツのみが含まれます。ブラウザのタブ、アドレスバー、ブックマークバー、拡張機能ツールバーは含まれません。ブラウザ UI が存在しないかのように、ページがそのまま出力されます。
静的 HTML、SPA(React、Vue)、遅延読み込み画像があるページ、無限スクロール、固定ヘッダー、固定配置要素など、構築方法を問わずあらゆるウェブページをキャプチャできます。フルページモードはすべてに対応しています。
デザインや開発を担当したウェブサイトのフルページスクリーンショットをポートフォリオ用に撮影できます。フルページモードでページデザイン全体をシームレスな 1 枚の画像として取得できます。Behance や Dribbble、ポートフォリオのケーススタディに最適です。
バグを報告する際、スクリーンショットは千の言葉に勝ります。問題が発生している正確なビューポートをキャプチャするか、バグがレイアウト全体にどう影響しているかを示すフルページスクリーンショットを使えます。GitHub の Issue や Jira チケットに添付できます。
ステークホルダーレビュー用にステージングサイトの現状をキャプチャします。フルページスクリーンショットにより、クライアントはサイトにアクセスしなくてもデザイン全体を確認できます。技術に詳しくないステークホルダーとのレビューに役立ちます。
変更を加える前にスクリーンショットを撮り、変更後にもう一枚撮ります。2 枚の画像を並べて比較することで、CSS やレイアウトの変更が、作業していたセクションだけでなくページ全体で正しく反映されているか確認できます。
ブログ記事、ツイート、プレゼンテーション用にウェブページのクリーンでプロフェッショナルな画像を作成します。ツールバーやブラウザ UI のないすっきりとした出力は洗練されたプロの仕上がりで、ブラウザ UI をトリミングする必要がありません。
DevSuite Pro のドックまたはポップアップを開き、スクリーンショットアイコンをクリックします。「表示エリア」と「フルページ」の 2 つのオプションを持つモード選択画面が表示されます。
「表示エリア」をクリックすると現在のビューポート(今見えている内容)をキャプチャし、「フルページ」をクリックするとページの上から下まで全体をキャプチャします。
表示エリアのキャプチャは即座に完了します(1 秒未満)。フルページのキャプチャはツールがスクロールしてタイルを合成するため数秒かかります。進捗インジケーターでキャプチャの状態を確認できます。
キャプチャした画像は PNG ファイルとして自動的にダウンロードされます。ページタイトルとタイムスタンプで命名されたファイルをブラウザのダウンロードフォルダで確認してください。
キャプチャ後もツールはアクティブのままです。再起動することなく同じページや別のページのスクリーンショットを続けて撮れます。スクロールしたり変更を加えたりして再度キャプチャできます。
DevSuite Pro を無料でインストールして、ブラウザで 39 以上の開発者ツールを利用しましょう。