← Powrót do funkcji
Free

Zrzut ekranu

Zrzut ekranu rejestruje wysokiej jakości obrazy dowolnej strony w dwóch trybach: widoczny obszar (dokładnie to, co widzisz w oknie przeglądarki) lub cała strona (cała strona od góry do dołu, w tym zawartość poniżej linii zgięcia). Zrzuty ekranu są zapisywane jako wysokiej rozdzielczości pliki PNG i pobierane natychmiast na twoje urządzenie — bez przesyłania do chmury, bez kont, bez czekania.

Natywne zrzuty ekranu przeglądarki (przy użyciu narzędzi systemu operacyjnego, takich jak Cmd+Shift+4 lub Narzędzie wycinania) rejestrują cały ekran, w tym chrom przeglądarki, paski narzędzi i inne okna. Nie mogą rejestrować zawartości poniżej linii zgięcia. Narzędzie Zrzut ekranu DevSuite rozwiązuje oba problemy — rejestruje tylko zawartość strony internetowej (bez UI przeglądarki) i może przewijać całą stronę, aby stworzyć bezszwowy obraz całej strony. Tryb widocznego obszaru używa natywnego API przechwytywania Chrome dla pikselowej dokładności. Tryb całej strony automatycznie przewija stronę, rejestruje każdy kafelek viewportu i łączy je w jeden ciągły obraz. Wynik to PNG w pełnej rozdzielczości (dopasowany do współczynnika pikseli urządzenia), więc zrzuty ekranu są ostre na wyświetlaczach Retina i wysokiej rozdzielczości DPI.

Podgląd na żywo
example.com/landing-page
Visible Area
Full Page
PNG · Full Resolution
Capture Area
Capture Info
Width1440px
Height900px
FormatPNG
Scale2x
Download
Kluczowe funkcje

Rejestracja widocznego obszaru

Zarejestruj dokładnie to, co jest widoczne w viewporcie przeglądarki — precyzyjny prostokąt zawartości, którą widzi użytkownik. Bez chromu przeglądarki, bez pasków narzędzi, bez pasków przewijania. Tylko czysta zawartość strony, tak jak pojawia się na ekranie. Jedno kliknięcie, natychmiastowa rejestracja.

Zrzut całej strony

Zarejestruj całą stronę od samej góry do samego dołu, włączając wszystkie treści poniżej linii zgięcia. Narzędzie automatycznie przewija stronę, rejestruje każdą sekcję i łączy kafelki w jeden bezszwowy, ciągły obraz. Działa na stronach o dowolnej długości.

Jakość Retina / wysokiej rozdzielczości DPI

Zrzuty ekranu są rejestrowane w natywnym współczynniku pikseli wyświetlacza (2x na Retina, 1.5x na niektórych wyświetlaczach Windows). Wynikiem jest ostry, wysokiej rozdzielczości obraz, który wygląda ostro nawet po powiększeniu — nie rozmyte skalowanie, które uzyskujesz ze zrzutów ekranu systemu operacyjnego.

Natychmiastowe pobieranie PNG

Zarejestrowany obraz jest zapisywany jako bezstratny plik PNG i pobierany bezpośrednio na twoje urządzenie natychmiast. Bez przesyłania do chmury, bez czekania na przetwarzanie, bez wymaganego konta. Plik pojawia się w folderze pobrań w ciągu sekund.

Tylko czysta zawartość

Rejestracja obejmuje tylko zawartość strony internetowej — bez kart przeglądarki, paska adresu, paska zakładek czy paska narzędzi rozszerzeń. Wynik wygląda dokładnie tak, jak wyglądałaby strona, gdyby UI przeglądarki nie istniało.

Działa na każdej stronie

Rejestruje dowolną stronę internetową niezależnie od tego, jak jest zbudowana — statyczny HTML, SPA (React, Vue), strony z leniwie ładowanymi obrazami, nieskończone przewijanie, przyklejone nagłówki i elementy o stałej pozycji. Tryb całej strony obsługuje je wszystkie.

Typowe zastosowania

Portfolio i dokumentacja studium przypadku

Rejestruj zrzuty ekranu całych stron witryn, które zaprojektowałeś lub opracowałeś, dla swojego portfolio. Tryb całej strony daje ci kompletny, bezszwowy obraz pokazujący cały projekt strony — idealny do Behance, Dribbble lub studiów przypadku portfolio.

Raporty o błędach z kontekstem wizualnym

Zgłaszając błąd, zrzut ekranu jest wart tysiąca słów. Zarejestruj dokładny viewport pokazujący problem lub zrzut ekranu całej strony pokazujący, jak błąd wpływa na cały układ. Załącz go do swojego zgłoszenia GitHub lub Jira.

Przegląd i zatwierdzenie projektu

Zarejestruj bieżący stan witryny stagingowej do przeglądu przez interesariuszy. Zrzuty ekranu całej strony pozwalają klientom zobaczyć kompletny projekt bez konieczności odwiedzania strony — przydatne do przeglądów z nietechnicznymi interesariuszami.

Porównania przed/po

Zrób zrzut ekranu przed wprowadzeniem zmian, a następnie zrób kolejny po. Porównaj dwa obrazy obok siebie, aby zweryfikować, czy zmiany CSS lub układu wyglądają poprawnie na całej stronie, a nie tylko w sekcji, na której się skupiałeś.

Media społecznościowe i treści blogowe

Twórz czyste, profesjonalne obrazy stron internetowych do postów blogowych, tweetów lub prezentacji. Wynik bez paska narzędzi i bez chromu przeglądarki wygląda dopracowany i profesjonalny — bez potrzeby przycinania UI przeglądarki.

Jak używać
1

Aktywuj narzędzie Zrzut ekranu

Otwórz dok DevSuite Pro lub popup i kliknij ikonę Zrzut ekranu. Pojawia się selektor trybu z dwoma opcjami: "Widoczny obszar" i "Cała strona".

2

Wybierz tryb rejestracji

Kliknij "Widoczny obszar", aby zarejestrować bieżący viewport (to, co widzisz teraz), lub "Cała strona", aby zarejestrować całą stronę od góry do dołu.

3

Poczekaj na rejestrację

Rejestracje widocznego obszaru są natychmiastowe (poniżej 1 sekundy). Rejestracje całej strony trwają kilka sekund, gdy narzędzie przewija się przez nią i łączy kafelki. Wskaźnik postępu pokazuje status rejestracji.

4

Pobierz PNG

Zarejestrowany obraz jest automatycznie pobierany jako plik PNG. Sprawdź folder pobrań przeglądarki, aby znaleźć plik, nazwany tytułem strony i znacznikiem czasu.

5

Rób więcej zrzutów ekranu

Narzędzie pozostaje aktywne po każdej rejestracji. Rób dodatkowe zrzuty ekranu tej samej lub różnych stron bez reaktywacji. Przewijaj, wprowadzaj zmiany i rejestruj ponownie.

Gotowy do wypróbowania? Zrzut ekranu?

Zainstaluj DevSuite Pro za darmo i odblokuj ponad 39 narzędzi programistycznych dla swojej przeglądarki.

Dodaj do Chrome Dodaj do Edge Dodaj do FireFox