ウェブサイト/ウェブページURLスクリーンショット
ウェブサイトURLスクリーンショットは、サーバーサイドレンダラーから任意の公開ページをキャプチャします。デスクトップまたはスマートフォンのビューポートを選び、PNG、JPG、WEBP、BMP、GIFを選択し、必要に応じて中央からクロップして、画像をプレビューおよびダウンロードできます。拡張機能やインストールは不要で、プライベートまたは内部ホストはブロックされます。
使用方法 ウェブサイト/ウェブページURLスクリーンショット
コンテンツを読む
このツールの機能
公開ウェブアドレスを入力し、ビューポートを選択すると、サーバーがヘッドレスキャプチャサービスに対してそのページのスクリーンショットを要求します。画像はプレビューパネルでページに返され、PNG、JPG、WEBP、BMP、GIFとしてダウンロードできます。ブラウザには何もインストールされません。レンダリングはサーバー側で行われるため、結果は画面サイズ、ブラウザの拡張機能、ノートパソコンが起動しているかどうかに依存しません。
これはビューポートをキャプチャするものであり、スクロールするページ全体ではありません。長い記事は選択した高さで切り取られ、このインターフェースには全ページオプションがありません。ページ全体が必要な場合は、許可された範囲内でカスタムの高い高さでキャプチャするか、専用ツールを使って異なるスクロール位置で複数のスクリーンショットを撮ってください。
キャプチャの実行方法
- URLが検証されます。完全な
httpまたはhttpsアドレスである必要があります。 - プライベートおよび内部ホストは拒否されるため、このツールを使ってローカルネットワークやファイアウォールの内側のサーバーを探査することはできません。
- サーバーは、要求されたビューポートの幅と高さを添えてアドレスをスクリーンショットサービスに送信し、画像レスポンスを要求します。
- 返されたPNGが保存され、必要に応じて選択した形式に変換され、切り抜き寸法を指定した場合は切り抜かれます。
- レスポンスには画像の公開URLが含まれ、ページはそれをプレビューに読み込み、ダウンロードボタンにも再利用します。
サードパーティのレンダラーがページを読み込むため、得られるのはそのレンダラーの見え方です。つまり、そのIPアドレス、位置、Cookieジャー、デフォルトのユーザーエージェントです。国によってコンテンツをパーソナライズするサイトや、データセンターのトラフィックをブロックするサイトは、自分のブラウザで見るものとは異なる内容を返す場合があります。
ビューポートオプション
ビューポートセレクターには、一般的なデスクトップサイズと、いくつかの携帯電話サイズがあります：
- デスクトップ： 1280×720、1024×768、1280×800、1366×768、1920×1080（デフォルト）。
- モバイル： iPhone 14（390×844）、iPhone 16（393×852）、Galaxy（360×780）、Pixel（412×915）。
- カスタムビューポート： 幅320～5000ピクセル、高さ240～10000ピクセルの任意の値を入力できます。
プリセットを選択するとカスタムの幅と高さのフィールドがクリアされるため、プリセットが選択されている場合は常にプリセットが優先されます。プリセットはビューポートの寸法のみを設定します。レスポンシブサイトがモバイルレイアウトを提供するかどうかは、キャプチャサービスと、サイトがデバイスをどのように検出するかによって決まります。
形式と品質
PNGはネイティブの出力であり、テキスト、シャープなエッジ、透明部分を含むスクリーンショットに最も安全な選択です。JPGは写真の多いページでファイルサイズを小さくします。WEBPはさらに小さく、ブラウザで広くサポートされています。BMPは非圧縮で大きく、GIFは256色に制限されるため、テキストの多いページよりも単純なグラフィックに主に役立ちます。キャプチャサービスはPNGを返します。別の形式を選ぶとサーバーが変換しますが、変換によって非常に細かいテキストがわずかにぼやけることがあります。
品質フィールドは0～100で、デフォルトは90です。これはJPGやWEBPなどの非可逆形式で重要です。PNG、BMP、GIFはこれを無視します。品質50でページがぼやけて見える場合は、レンダラーのせいにせず、品質を上げてください。
切り抜き
切り抜き幅と切り抜き高さは、画像を中央からトリミングします。オフセットの制御はないため、左上の領域を選ぶことはできません。切り抜きは常にキャプチャされたビューポートの中央に配置されます。切り抜きを行うには両方のフィールドを入力する必要があります。どちらかが空の場合、スクリーンショットはフルサイズで返されます。
切り抜き単位は、数値の読み取り方法を決定します。ピクセルの場合、800×450の切り抜きは中央から800×450の領域を取ります。パーセントの場合、50×50は幅の半分と高さの半分を取り、値は100パーセントに上限が設定されます。元画像より大きい切り抜きは元のサイズに制限されるため、幅1280ピクセルのキャプチャから9000ピクセルを要求しても、単に全幅が返されます。切り抜きはサーバーの画像ライブラリで行われ、ファイルが再エンコードされます。そのため、品質設定は切り抜いたJPGやWEBPにも影響します。
ページの使い方
https://を含むURLを貼り付けます。- 形式、ビューポート、そして必要なら切り抜きを選択します。
- キャプチャを押して待ちます。遅いページでは何秒もかかることがあります。リクエストが完了するまでボタンは無効のままです。
- プレビューを確認します。ズームスライダーはファイルを変更せずにパネル内の画像を拡大縮小し、リセットボタンは100パーセントに戻します。
- ダウンロードを押して、プレビューに表示されているのと同じ画像を保存します。ファイル名はサーバーから
capture-YYYYMMDD-HHMMSS-random.extの形式で付けられます。
ステータス行には、キャプチャサービスからの成功またはエラーテキストが表示されます。エラーは多くの場合、入力の問題ではなく、タイムアウトやブロックされたリクエストなど、サービスがページを読み込めなかった理由を説明するものです。
結果を変える要因
- Cookieバナーやモーダルは、レンダラーが新規訪問者であるために表示されます。これらが目的のコンテンツを覆い隠すことがあります。
- 遅延読み込み画像は、スクロール時にのみ読み込まれる場合、初期ビューポートしかレンダリングされないため欠落することがあります。
- ログインが必要なページは、キャプチャが匿名であるためサインイン画面が表示されます。
- アニメーションは、レンダラーが到達したフレームでキャプチャされるため、カルーセルが遷移の途中であることがあります。
- 地域ターゲット型コンテンツは、あなたの場所ではなくレンダラーの場所を反映します。
- フォントは、レンダラーがWebフォントを素早く取得できない場合、フォールバックが使用されることがあります。
制限
受け付けられるのは公開HTTPおよびHTTPSアドレスのみです。localhost、プライベートIP範囲、内部ホスト名は意図的にブロックされています。ビューポートは幅5000ピクセル、高さ10000ピクセルが上限で、クロップも同じ範囲に制限されます。キャプチャはURLとオプションセットごとに3分間キャッシュされるため、同じ設定で「キャプチャ」を2回押しても、新たにレンダリングされるのではなく同じ保存済み画像が返されます。バッチモード、スケジュールキャプチャ、認証、Cookieインジェクションはなく、キャプチャ前にスクロールする方法もありません。
タイムアウトフィールドは3～120秒を受け付けますが、送信リクエストはそのフィールドではなくキャプチャサービスに設定されたタイムアウトを使用するため、変更してもサーバーの待機時間が変わらない場合があります。サービス側でキャプチャが失敗した場合は、数値を上げるよりも後で再試行する方が通常は効果的です。
プライバシーと画像の保存先
ページはサードパーティのレンダリングサービスによって取得されるため、対象サイトにはあなたのリクエストではなくそのサービスのリクエストが見えます。生成された画像は一時的な公開フォルダに書き込まれ、URLとして返されるため、フォルダがクリーンアップされるまでリンクを知っている誰でも開くことができます。プライベートなダッシュボード、管理者パネル、請求書、個人データを含むものはキャプチャしないでください。送信したURLもキャプチャプロバイダに送信されます。
よくある間違い
- スキームを忘れる。
example.comは検証に失敗します。https://example.comは動作します。 - ページ全体のスクリーンショットを期待する。 キャプチャされるのはビューポートのみです。
- クロップフィールドを1つだけ入力する。 クロップには幅と高さの両方が必要です。
- 中央以外のクロップを望む。 クロップは常に中央になります。
- プライベートなURLをキャプチャする。 内部ホストは拒否され、公開の一時リンクは共有可能です。
- 再キャプチャが最新だと想定する。 同一の設定は3分間キャッシュされます。
よくある質問
よくある質問
Suggested Tools
コメント (0)
発生した問題について詳しくご説明ください。調査を行い、ツールの改善に役立てたいと思います。