Клиент: Скриншот всей страницы сайта в Chrome и Edge без расширений

Решает простую, но частую задачу: нужно быстро сохранить скриншот всей страницы сайта сверху донизу, а не только видимой части экрана.

Способ подходит для Google Chrome, Microsoft Edge и других Chromium-браузеров, где есть DevTools. Расширения, онлайн-сервисы и отдельные программы не нужны.

Готовое решение

 
1. Открой страницу сайта в Chrome или Edge. 
2. Открой инструменты разработчика: F12 или Ctrl + Shift + I 
3. Открой командное меню DevTools: Ctrl + Shift + P 
4. Введи: screenshot 
5. Выбери команду: Capture full size screenshot 
6. Браузер сохранит PNG-файл всей страницы целиком. 

Это один из самых быстрых способов сделать полный скриншот страницы: браузер снимает не только видимую область экрана, а весь документ сверху донизу.


Пример использования

Допустим, нужно отправить клиенту скриншот длинной посадочной страницы, отчёта, карточки товара или страницы с ошибкой в вёрстке.

  1. Открой нужный URL в браузере.
  2. Дождись полной загрузки страницы.
  3. Нажми F12 или Ctrl + Shift + I.
  4. Нажми Ctrl + Shift + P.
  5. Начни вводить screenshot.
  6. Выбери Capture full size screenshot.

После этого Chrome или Edge сохранит изображение в формате PNG. Обычно файл попадает в папку загрузок браузера.


Для macOS

 
Открыть DevTools: Cmd + Option + I 
Открыть командное меню DevTools: Cmd + Shift + P 
Команда: Capture full size screenshot 

Отдельный быстрый способ в Microsoft Edge

В Microsoft Edge есть встроенный инструмент для скриншотов. Он тоже не требует расширений.

 
1. Открой страницу в Microsoft Edge. 
2. Нажми: Ctrl + Shift + S 
3. Выбери: Capture full page 
4. Сохрани скриншот. 

Но если нужен одинаковый способ для Chrome и Edge, удобнее запомнить вариант через DevTools: F12 → Ctrl + Shift + P → screenshot.


Краевые случаи: что может пойти не так

  • Ленивая загрузка изображений. Если картинки подгружаются только при прокрутке, на полном скриншоте они иногда могут быть пустыми. Перед скриншотом можно один раз пролистать страницу до конца и вернуться наверх.
  • Cookie-баннеры и попапы. Браузер снимет страницу в текущем состоянии. Если баннер перекрывает контент, сначала закрой его.
  • Sticky-шапки и плавающие кнопки. Фиксированные элементы могут попасть на скриншот и закрыть часть страницы.
  • Очень длинные страницы. На огромных страницах PNG может получиться тяжёлым, а браузер может сохранить неидеальный результат.
  • Авторизация. Скриншот делается из текущей вкладки. Если страница доступна только после входа, сначала нужно авторизоваться.
  • Анимации, видео, карусели. В скриншот попадёт текущее состояние элемента на момент захвата.

Производительность

Обычно скриншот создаётся быстро. Но на тяжёлых страницах браузер может на несколько секунд задуматься: ему нужно отрисовать всю высоту документа и сохранить изображение.

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

Просмотров: 139
Материал помог? Оценка помогает находить устаревшие и спорные решения.

Комментарии

0

Нашли ошибку или хотите дополнить материал?

Комментариев пока нет.Можно первым дополнить материал или сообщить об ошибке.
Telegram