最高品質のウェブサイトのスクリーンショット?


16

ポートフォリオに追加したいウェブサイトを作成しましたが、フルサイトの高品質のスクリーンショットを取得するのに苦労しています。WebサイトをPDFとして保存しようとしましたが、エラーが多かったため、他のオンラインサービスでは画像を再作成できませんでした。また、Macで定期的にスクリーンショットを撮ってみましたが、縮小すると品質が大幅に低下しました。

良いアイデアはありますか?:)


何が起きているのか、おそらくあなたが達成しようとしているもののデモを提供できますか?
cclark413 14

「ポートフォリオ」と言うとき、物理的なもの(紙に印刷)またはデジタルメディアやオンラインで配布できる写真(JPG、PNG)のコレクションを意味しますか?
デイズ

OPが試したmacスクリーンショットが、以下のソリューションよりも優れていない理由に非常に興味があります。私はHi Defスクリーンショットを知らないので、誰かがそれを私に説明していただければ幸いです。さらに、スケーリングの問題にも興味があります。通常、それは逆です。もちろん、何かを縮小すると、ピクセルが画像を表すスペースが少なくなりますが、「品質」が失われますか?たぶんあなたのズーム率がこのように見えるのでしょうか?100%を試す
cclark413 14

1
1920x1080の画面解像度(1080p)で画像が得られます 印刷用 6.4 X 3.6インチに適している
ホレイショ

回答:


16

Firefoxでは、でコンソールを開き、Shift+F2を使用できますscreenshot --fullpage

テキスト品質を維持しながらさまざまなサイズとサイズにスケーリングするには、Ctrl+Shift+M(またはCmd+Opt+MOS Xで)を使用してレスポンシブデザインビューアーに入り、必要に応じてサイズを変更します(これを使用して、モニターがサポートするよりも高い解像度でスクリーンショットを取得したり、写真を取得したりすることもできます)タブレット/モバイルビューの)。プラグインは必要ありません。

大きな例

小さな例


7

ウェブサイトで全画面のスクリーンショットを撮りたい場合は、このGoogle Chromeプラグインを使用できます

これにより、(スクロール中に)複数のスクリーンショットが作成され、それらが1つの.png画像に結合されます。

プラグインをクリックして、「ページ全体をキャプチャ」を選択するだけです。

ここに画像の説明を入力してください


私は個人的にこれを使用します、それはファイルを保存することを非常に簡単にします。
イセラ14

スクリーンショットは、自分のWebサイトのポートフォリオで使用する必要があります。Awesome ScreenshotとWebpage Screenshotの両方を試しましたが、キャプチャしようとしているページで動作していません。視差効果はスクリーンショットを台無しにし、ユーザーが下にスクロールしたときに最初に表示される要素はスクリーンショットに表示されません。私はcssをベクトルに変換することができるいくつかの解決策を見てきましたが、それは完璧でしょうが、ページの構造を台無しにしているようで、画像を処理できません。
マッキーン14

1
parralaxは、静止画像ではキャプチャできないアニメーションです。背景画像を無効にしてから、スクリーンキャップとソースファイルを使用して合成画像を作成してください。
horatio 14

1
私もこれを使います。すばらしい。ただし、ローカルファイルでは機能しません。最初にhtmlページをホストする必要があります。goog ol '印刷画面もあります。クイックスクリーンキャプチャツールでモーション/視差をキャプチャする場合は、Screencast-o-maticを試してください。それはウェブベースであり、ビデオ出力はかなり良い品質です。
ジョン

1

Faststone Captureをお勧めしますます。これは、ブラウザーの外部で他の目的にも使用できます。残念ながら、@ McKeeneが述べたように、スクロール効果のために単一の画像を大きな画像に貼り付けるのに問題があります。

バージョン5.3は、ホームユーザー向けに無料(ドイツ語ダウンロード)です。それ以外の場合、最新バージョンは約20ドルです。

FastStone Captureスクリーンショット


1

Firefoxユーザーは、「Awesome Screenshot」というプラグインを追加するだけです。このアドオンをダウンロードするには、リンク https://addons.mozilla.org/en-US/firefox/addon/awesome-screenshot-capture-/をご覧ください。

Chromeユーザーは https://chrome.google.com/webstore/detail/awesome-screenshot-captur/alelhddbbhepgpmgidjdcjakblofbmce?hl=enにアクセスできます

このアドオンを使用すると、ユーザーは全ページだけでなく、可視部分のスクリーンショットを撮ることができます。別のプログラムに切り替えることなく、トリミング、図形の挿入などを行うことができます。


1

最近、Pagelayersを使い始めました、Mac用のをが、とても満足しています。

私が大好きなこと:

  • Psdは、カスタムの幅と無限の高さで生成できます。

  • 生成されたpsdは、グループとレイヤーに分けられます。

  • PNGに直接保存できます

私を悩ますいくつかのこと:

  • ページをアプリにロードする必要があります。クロム拡張機能はありません。特に単純なスクリーンショットが必要な場合は、これは非常に面倒です。(それに対する私の最大の不満)
  • 生成されるpsdファイルは非常に大きくなる可能性があります。

気に入らないもの:

価格:£20

私はそれのために別のユースケースを持っているので、価格を正当化することができますが、単純なスクリーンショットが必要なだけではないかもしれません。

お役に立てれば。


1

誰かがすべての答えを読みたがっていて、上記の答えにも満足していない場合に備えて、Firefox用の別のスクリーンショットプラグイン「Screengrab!」があります。。どのような解像度が得られるのかわかりませんが、現在表示されている部分だけでなく、現在のページ全体がスクリーンショットに表示されます。さらに、指定された選択範囲または画面の現在表示されている部分のみを取得して、png形式で保存できます。


取得する解像度は、使用しているモニターのディスプレイ構成によって異なります。
ラファエル
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.