QA・クライアントレビュー・アーカイブ向けにランディングページを取得
マーケターやプロダクトチームは、変更をリリースするたびにWebshotでランディングページを取得しています。QA用の変更前後のペア、クライアント向けの成果物、そして恒久的なビジュアルの変更履歴として活用できます。3つのビューポートすべてを数秒でテストでき、Chrome DevToolsを駆使する必要も、月額99ドルのビジュアルテストツールも不要です。
いずれのボタンも、設定済みの取得フォームを開きます。ページが読み込まれた後で、形式やビューポートを変更できます。
この用途にWebshotを使う理由
3つのビューポートを1分で
デスクトップ(1920px)、タブレット(834px)、モバイル(390px)をそれぞれ取得し、3つすべてをQAチケットやクライアントへのメールに添付できます。
変更前後のペア
デプロイ前に取得し、デプロイ後にもう一度取得して、両方をSlackやデザインツールに貼り付けるだけ。ビジュアルのリグレッションが自然と見つかります。
クライアントにそのまま渡せる成果物
PDF出力は印刷対応で、ページ位置が揃い、ブランドがクリーン(透かしなし)です。承認のために関係者へそのまま送れます。
A/Bテストのスナップショット
A/Bテストの各バリエーションをスナップショットとして保存し、レビュー、アーカイブ、チーム全体での共有に活用できます。
ランディングページのQAを取得する方法
- ランディングページのURLをWebshotの取得フォームに貼り付けます。
- デバイスのビューポート(デスクトップ / タブレット / モバイル)と取得モード(フルページまたはファーストビュー)を選択します。
- 取得をクリックします。Webshotがページをスクロールし、遅延読み込みのコンテンツを待ち、5〜15秒でスクリーンショットを生成します。
- JPG(軽量)、PNG(くっきりとしたテキスト)、PDF(印刷対応)としてダウンロードします。
よくある質問
はい。まずデスクトップで取得し、次にビューポートのピルを切り替えて再度取得します。3つのビューポートすべてでも、一連の流れは1分もかかりません。
はい。フルページモードは文書全体をスクロールし、IntersectionObserverでトリガーされる画像を待ち、すべてが安定してから取得します。ファーストビューモードはより高速ですが、スクロールはしません。
右クリック → 名前を付けて保存でダウンロードするか、ダウンロードボタンを使用します。Notion、Linear、GitHub issues、Asanaにそのままドラッグできます。これらは標準的なPNG/JPGファイルです。印刷可能な成果物にはPDFが適しています。
はい。Webshotは取得前にネットワークアイドルとJavaScriptの実行を待つため、クライアント側で描画されるコンテンツ(React、Vue、Svelte、Next.js、Astro)もすべて正しく描画されます。
はい。無料のWebshot APIを使用してください。毎日のcronやデプロイフックと組み合わせれば、リリースのたびにステージングURLを取得できます。Python、Node、PHPのコード例は `/developers` をご覧ください。
透かしも、Webshotのブランド表記もありません。スクリーンショットはお客様のもので、フル解像度、個人利用も商用利用も無料です。
その他の活用事例: Google Mapsのスクリーンショット · WordPressのスクリーンショット · 法的証拠のスクリーンショット · SNSのスクリーンショット · 競合のモニタリング · すべて見る →