Zrzut ekranu strony o najwyższej jakości?

16

Stworzyłem stronę internetową, którą chciałbym dodać do mojego portfolio, ale trudno mi uzyskać wysokiej jakości zrzuty ekranu z całej witryny. Próbowałem zapisać stronę w formacie PDF, ale to było pełne błędów, inne usługi online nie mogą odtworzyć obrazów i tak dalej. Próbowałem też regularnie robić zrzuty ekranu na komputerze Mac, ale wszystko to straciło dużo, gdy go skalowałem.

Jakieś dobre pomysły? :)

website-design screenshot użytkownik22524
źródło
Czy możesz podać przykład tego, co się dzieje, a może demonstrację tego, co próbujesz osiągnąć?
cclark413
Kiedy mówisz „portfolio”, czy masz na myśli fizyczny (wydrukowany na papierze) czy zbiór zdjęć (JPG, PNG), które możesz rozpowszechniać w mediach cyfrowych lub w Internecie?
Oszołomić
Bardzo mnie interesuje, dlaczego zrzuty ekranu z komputera Mac wypróbowane przez OP nie są lepsze niż poniższe rozwiązania. Nie znam żadnych zrzutów ekranu Hi Def, więc jeśli ktoś mógłby mi to wyjaśnić. Ponadto jestem również zainteresowany problemem skalowania. Zwykle jest na odwrót. Oczywiście, kiedy coś przeskalujesz - jest mniej miejsca na piksele do przedstawienia obrazu, ale utrata „jakości”? Może twój procent powiększenia sprawia, że ​​tak wygląda? Spróbuj 100%
cclark413
1
Rozdzielczość ekranu 1920 x 1080 (1080p) daje obraz do wydrukowania odpowiedni dla 6,4 x 3,6 cala
horatio

Odpowiedzi:

16

W przeglądarce Firefox możesz otworzyć konsolę Shift+F2i korzystać z niej screenshot --fullpage.

Aby przeskalować go do różnych wymiarów i rozmiarów przy jednoczesnym zachowaniu jakości tekstu, użyj Ctrl+Shift+M(lub Cmd+Opt+Mw OS X), aby wejść do responsywnej przeglądarki projektu i zmienić rozmiar w razie potrzeby (możesz także użyć tego, aby uzyskać zrzuty ekranu w wyższej rozdzielczości niż obsługuje Twój monitor lub uzyskać zdjęcia wyświetleń tabletu / telefonu komórkowego). Nie są wymagane żadne wtyczki.

Duży przykład

Mały przykład

Slade
źródło
7

Jeśli chcesz zrobić pełny zrzut ekranu strony, możesz użyć tej wtyczki Google Chrome .

Spowoduje to wykonanie kilku zrzutów ekranu (podczas przewijania) i połączenie ich w jeden obraz .png.

Wystarczy kliknąć wtyczkę i wybrać „Przechwyć całą stronę”.

wprowadź opis zdjęcia tutaj

Stéphane
źródło
Ja osobiście korzystam z tego , dzięki czemu dość łatwo jest zapisać pliki.
Yisela
Zrzuty ekranu powinny być wykorzystywane w portfolio na mojej stronie internetowej. Próbowałem zarówno Awesome Screenshot, jak i Screenshot strony internetowej, ale nie działają one na stronie, którą próbuję przechwycić. Efekt paralaksy rujnuje zrzut ekranu, a elementy, które pojawiają się po raz pierwszy, gdy użytkownik przewinie do niego, nie pojawiają się na zrzucie ekranu. Spojrzałem na kilka rozwiązań, które mogłyby przekonwertować css na wektor, co byłoby idealne, ale wydaje się, że rujnują one strukturę strony i nie radzą sobie z obrazami.
McKeene
1
Parralax to animacja, której nie można zarejestrować na nieruchomym obrazie. Spróbuj wyłączyć obrazy tła, a następnie utwórz obraz złożony za pomocą zrzutów ekranu i plików źródłowych.
Horatio
1
Ja też tego używam. To jest wspaniałe. Jednak nie działa na lokalnych plikach. Najpierw musisz hostować stronę HTML. Istnieje również ekran drukowania Google. Jeśli chcesz, aby narzędzie do szybkiego przechwytywania ekranu uchwyciło ruch / paralaksę, wypróbuj Screencast-o-matic . Jest oparty na sieci, a wyjście wideo jest całkiem dobrej jakości.
Jan
1

Polecam Faststone Capture , którego możesz także używać poza przeglądarką do czegokolwiek innego. Niestety, jak wspomniano w @McKeene, ma problemy ze sklejeniem pojedynczych zdjęć ze sobą ze względu na efekt przewijania.

Wersja 5.3 jest darmowa (do pobrania w języku niemieckim) dla użytkowników domowych. W przeciwnym razie najnowsza wersja kosztuje około 20 USD.

Zrzut ekranu przechwytywania FastStone

Thomas Weller
źródło
1

Użytkownicy przeglądarki Firefox po prostu dodają wtyczkę o nazwie „Niesamowity zrzut ekranu”. Aby pobrać ten dodatek, odwiedź poniższy link https://addons.mozilla.org/en-US/firefox/addon/awesome-screenshot-capture-/

Użytkownicy Chrome mogą przejść do https://chrome.google.com/webstore/detail/awesome-screenshot-captur/alelhddbbhepgpmgidjdcjakblofbmce?hl=pl

ten dodatek pozwala użytkownikom robić zrzuty ekranu WIDOCZNEJ części, a także PEŁNEJ STRONY, możesz przycinać, wstawiać kształty itp. bez przełączania do innego programu.

użytkownik22557
źródło
1

Niedawno zacząłem używać Pagelayers na Maca i jestem z tego całkiem zadowolony.

Niektóre rzeczy, które kocham:

  • Psd mogą być generowane na niestandardowej szerokości i nieskończonej wysokości.

  • Wygenerowane psd są podzielone na grupy i warstwy.

  • Można zapisać bezpośrednio w formacie PNG

Niektóre rzeczy, które mnie niepokoją:

  • Wymaga załadowania strony w aplikacji. Bez rozszerzenia chrom. Może to być dość żmudne, szczególnie gdy potrzebujesz tylko prostego zrzutu ekranu. (Mój największy problem z tym)
  • Wygenerowany plik psd może być dość duży.

Rzeczy, których możesz nie lubić:

Cena: 20 £

Mam do tego inny przypadek użycia, dlatego mogę uzasadnić cenę, ale możesz tego nie zrobić, jeśli potrzebujesz prostych zrzutów ekranu.

Mam nadzieję że to pomoże.

trylife
źródło
1

Na wypadek, gdyby ktoś chciał przeczytać wszystkie odpowiedzi i nie był zadowolony z powyższych, które są również doskonałe, dostępna jest kolejna wtyczka zrzutu ekranu do przeglądarki Firefox: „Screengrab!” . Nie wiem, jaką rozdzielczość można uzyskać, ale cała bieżąca strona będzie na zrzucie ekranu, a nie tylko widoczna część. Dodatkowo możesz przejść i pobrać określony wybór lub tylko aktualnie widoczną część ekranu, zapisuje się w formacie png.

Jaromír Greenhorn
źródło
Rozdzielczość, którą uzyskasz, zależy od konfiguracji wyświetlacza używanego monitora.
Rafael