Как сделать скриншот всей страницы?

С простыми скриншотами всё просто. Чтобы сделать снимок экрана, можно использовать стандартную кнопку Print Screen или специальную программу вроде Lightshot.

Но если нужно сфотографировать лендинг или веб-версию email-рассылки, — то есть сразу нескольких экранов, — обычный способ плохо подходит. Неудобно делать снимок → сохранять → скроллить → делать снимок … объединять в редакторе несколько скриншотов в одну картинку.

Чтобы быстро заскриншотить страницу целиком, есть несколько решений.

Chrome DevTools

Что это: внутренний инструмент браузера Chrome.

Стоимость: бесплатно.

В самом популярном браузере можно сделать скриншот всей страницы даже без установки дополнительных программ и расширений.

Для начала нужно открыть нужный сайт, затем «Инструменты разработчика»: через меню «Дополнительные инструменты» или комбинацию «Ctrl + Shift + I».

pic

Дальше нужно кликнуть на три вертикальные точки, чтобы вызвать меню «Инструментов разработчика», и нажать на «Run Command». Или открыть соответствующее окно другой комбинацией — «Ctrl + Shift + P».

pic

Если начать набирать «screen…», появляется подсказка «Capture full size screenshot». Остаётся выбрать эту команду и немного подождать. Браузер сделает скриншот целой страницы и скачает его в формате png.

Таким же способом можно заскриншотить мобильную версию сайта. Только перед выполнением команды нужно нажать на иконку в левом верхнем углу, которая называется «Toggle device toolbar», или воспользоваться горячими клавишами «Ctrl + Shift + M». Над страницей появится панель, где можно выбрать нужное устройство или самостоятельно указать размер экрана.

pic

А как сделать длинный скриншот в других браузерах?

В Safari похожая система: нужно выбрать в меню «Разработка → Показать веб-инспектор», затем кликнуть правой кнопкой на первый тег «html» в коде страницы и нажать на «Сделать снимок экрана».

В браузере «Яндекса» ещё проще — на боковой панели есть специальный значок для создания скриншотов, в том числе длинных. А в Firefox можно просто открыть сайт, кликнуть правой кнопкой и выбрать «Сделать скриншот» — браузер ещё предложит обрезать лишнее.

pic
Создание длинного скриншота в Firefox

GoFullPage

Что это: браузерное расширение для Chrome и Edge.

Сайт: https://gofullpage.com/.

Стоимость: бесплатно (дополнительные функции за $1 в месяц).

Инструмент позволяет в один клик сделать скриншот целой страницы. Прогресс визуализируется с помощью чёрного пэкмена — мило.

pic

Готовый снимок можно скачать в png, jpg или pdf. Если купить платную подписку, будет возможность сразу отредактировать изображение: обрезать, добавить текст или рамку, замылить.

Awesome Screenshot

Что это: браузерное расширение для Chrome, Edge, Mozilla.

Сайт: https://www.awesomescreenshot.com/.

Стоимость: бесплатно (с ограничениями) или подписка от $4 в месяц.

Мощный инструмент для создания скриншотов и скринкастов.

Чтобы захватить всю страницу, нужно кликнуть на иконку расширения и нажать на «Full Page». Или воспользоваться комбинацией горячих клавиш «Ctrl + Shift + E». Дальше Awesome Screenshot сам прокрутит и сфотографирует сайт — главное, не мешать.

Длинный скриншот можно отредактировать — например, добавить текст, стикеры или водяной знак, замылить, обрезать. Или сразу сохранить в png или pdf.

pic

Есть интеграции с системами управления проектами и облачными хранилищами — можно отправить картинку туда без скачивания на диск.

FireShot

Что это: браузерное расширение для Chrome, Mozilla, Opera, Yandex, Edge.

Сайт: https://getfireshot.com/.

Стоимость: бесплатно или полная версия за $60 (пожизненная лицензия).

Универсальный плагин для всех популярных браузеров.

Использовать очень просто: установить, перейти на нужную веб-страницу, кликнуть по иконке на панели, вызвать меню и выбрать «Захватить всю страницу» (или нажать «Ctrl + Shift + S»).

После скроллинга и съёмки появится новая вкладка, где нужно будет выбрать: сохранить в png/jpg или pdf, отправить по почте, распечатать или просто скопировать в буфер обмена.

pic

Покупка лицензии открывает доступ к дополнительным функциям: pdf с поддержкой текста, улучшенному захвату, графическому редактору и другим.

FastStone Capture

Что это: десктопная программа для Windows.

Сайт: https://www.faststone.org/FSCaptureDetail.htm.

Стоимость: $20 за пожизненную лицензию (30 дней — бесплатный пробный период).

Легкий и функциональный скриншотер с простыми функциями для редактирования снимков.

После установки на компьютер появится небольшое окошко поверх всех других. Чтобы сделать длинный скриншот, нужно открыть сайт и нажать на кнопку «Capture Full Screen» на панели FastStone. Затем выбрать область и кликнуть левой кнопкой мыши — программа медленно проскроллит и аккуратно сфотографирует нужную веб-страницу.

pic

Потом откроется редактор: можно изменить размер, добавить надписи или что-то нарисовать.

FastStone сохраняет скриншоты в bmp, gif, jpg, png и pdf. А ещё программа умеет записывать экран вместе с курсором, звуком из динамиков и микрофоном, а также — преобразовывать снятое видео в gif.

ScreenshotMachine

Что это: веб-сервис для скриншотинга сайтов.

Сайт: https://www.screenshotmachine.com/.

Стоимость: бесплатно до 100 скриншотов в месяц (дальше от €9 в месяц).

Удобно — не нужно устанавливать никаких плагинов и программ. Достаточно вставить URL страницы, выбрать устройство, поставить галочку на «Full-page screenshot» и нажать «Capture».

pic

Можно скачать результат в jpg или pdf. А если нужно постоянно мониторить сайты и делать много скриншотов, есть API.

А как сделать длинный скриншот на телефоне?

Некоторые устройства поддерживают такую функцию по умолчанию. На остальные нужно просто установить специальные приложения. Например, Longshot для Android и Tailor для Apple.

Какой вариант вам больше понравился?

В комментарии
unisender

Комментарии