Урок: скриншот с прокруткой. Как сделать снимок экрана на компе с прокруткой страницы Скриншот страницы полностью
Захват, то есть, снимок изображения на экране монитора называется скриншотом. О создании скриншота стандартными инструментами ОС Windows читаем урок: ножницы Windows .
Сегодня для просмотра большинства веб-страниц и интерактивных действий в них мы производим скроллинг - прокручиваем содержимое окна колесиком мышки. Как сделать скриншот такой протяженной веб-страницы и рассмотрим в этом уроке.
Примитивным и трудозатратным способом является формирование серии скриншотов по размеру экрана с последовательным ручным прокручиванием страницы. В результате связный контент страницы разбивается на энное количество картинок, объединить которые еще предстоит в каком-нибудь графическом редакторе. Поэтому, для создания цельного скриншота длинной веб-страницы используем специализированные средства.
Стабильно работает и быстро создает скриншот длинной веб-страницы бесплатный онлайн-сервис Web Screenshots. Проходим по адресу: https://goo.gl/sZpCF5 на этот ресурс, вставляем в поле запроса URL захватываемой страницы и нажимаем кнопку "скриншот":
Через некоторое время, в зависимости от длины страницы, производится захват и скриншот появляется в активном окне сервиса. Кликнув в любом месте полученного изображения правой кнопкой мышки, открываем контекстное меню и сохраняем скрин в выбранную директорию:
Сохранив скриншот веб-страницы в файл формата png просматриваем его с прокручиванием, например, в стандартном Paint"е.
Также заслуживает внимания сервис snapito.com . Здесь в поисковое поле копируем адрес захватываемой страницы и нажимаем кнопку "Snap". Настройки позволяют начинать захват с задержкой времени, выбирать размер скриншота:
Выполненный скриншот появляется на этой же странице сервиса. Кликнув правой кнопкой мышки в любом месте изображения открываем контекстное меню и командой "Сохранить картинку как..." сохраняем скрин в выбранную директорию. Сохранение возможно только в формате jpg.
Другим способом онлайн-захвата является установка дополнительного инструмента в браузер. Одно из таких расширений для браузера Google Chrome - FireShot. Находим и добавляем его в обозреватель из интернет-магазина Chrome:
После установки в правом верхнем углу окна браузера появляется значок плагина FireShot, кликнув по которому открываем меню функций дополнения:
В бесплатной версии расширения скриншот можно сохранять в файлы формата: png, jpg, pdf.
Аналогичный бесплатный плагин для браузера Opera в ОС Windows - Capture Webpage Screenshot - FireShot.
А в Firefox"e функция создания скриншота с прокруткой уже встроена в браузер. Для ее активации сочетанием Ctrl+Shift+I откроем панель "Инструменты разработчика" и клавишей F1 перейдем в раздел "Параметры". В левой части панели в подразделе "Дополнительные кнопки инструментов" активируем функцию "Сделать скриншот всей страницы":
После этого на панели "Инструменты разработчика" появляется значок в виде камеры, кликом по которому можно сделать цельный скриншот текущей веб-страницы:
Открыв журнал загрузок в браузере найдем файл сохраненного скриншота:
Кроме онлайн-сервисов и плагинов для различных браузеров, разработано немало десктопных приложений для захвата веб-страниц с прокруткой.
FastStone Capture - популярная многофункциональная программа для создания скриншотов и записи действий на экране. Бесплатный пробный период составляет 30 дней. Удобная, с лаконичным интерфейсом, легкая в освоении прога:
Захватив страницу, программа открывает ее в редакторе, где скрин можно просматривать, дополнять надписями, водяными знаками, картинками и сохранять его в нужном формате (bmp, gif, jpg, pcx, png, tga, tif, pdf).
Таким образом, сравнив инструменты для захвата длинной веб-страницы подбираем для себя оптимальный вариант.
Сделать скриншот экрана очень просто с помощью доступных по умолчанию команд клавиатуры. Но, если вы хотите сделать скриншот всей страницы в браузере, а не только видимой области экрана, то вам понадобятся специальные инструменты и несколько дополнительных кликов.
Существуют как минимум 4 способа сделать скриншот веб-страницы целиком:
Уменьшите масштаб страницы и используйте клавиши по умолчанию
Этот быстрый способ подойдет только в том случае, если страница только немного выходит за видимую область экрана. Уменьшите масштаб страницы до тех пор, пока она полностью не уместится на экране, а затем сделайте скриншот с помощью команд по умолчанию:
- Windows: нажмите клавишу Print Screen (PrtScr или Print Scrn). Снимок экрана будет сохранен в буфер обмена. Чтобы вставить это изображение в файл, воспользуйтесь любым графическим редактором.
- Mac : используйте сочетание клавиш Cmd-Shift-3. По умолчанию скриншот будет сохранен как PNG файл на вашем рабочем столе.
Программы для снятия скриншотов
Вы можете установить одну из специальных программ для снятия скриншотов на свой компьютер. Например, я пробовала Snagit от Techsmith (и для Windows, и для Mac), FastStone Capture (программа доступна только для Windows) и Paparazzi (только для Mac). При выборе следует обратить внимание, что некоторые из этих программ не бесплатны. Поделитесь ссылками в комментариях, если вы знаете другие подобные приложения.
Онлайн-инструменты для снятия скриншотов
Если вы не хотите ничего устанавливать на компьютер, вы можете воспользоваться одним из этих веб-инструментов, чтобы сделать скриншот всей страницы прямо в браузере: Snapito , Screenshot Machine или Web-capture.net . Все они устроены похожим образом: просто вставьте URL нужной страницы в соответствующее поле на странице сервиса.
Расширения для браузера
Это мой любимый способ делать скриншоты страниц. Не нужно переключаться в другую вкладку или запускать отдельное приложение – меньше кликов!
Иногда в процессе работы за компьютером нам необходимо «сфотографировать» какое-то событие, происходящее на экране нашего монитора. Например, какая-то программа выдала ошибку, или какое-то уведомление, с которой самостоятельно разобраться невозможно, но решить эту проблему надо. Здесь нам и пригодится возможность «сфотографировать» то, что вы видите на мониторе — сделать так называемый «скриншот» видимой области монитора, или сокращённо — «скрин». Для этого необходимо нажать клавишу «Print Screen» (иногда название на ней пишется сокращённо, например, «РrtScrn»), в основном она расположена либо справа от клавиши F12, либо чуть ниже. Её расположение вы можете посмотреть на рисунках ниже.
Изображение будет помещено в буфер обмена, и чтобы сообщить разработчикам программы (или в службу технической поддержки) об ошибке, вы можете вставить его в письмо или другой документ (например, в MS Word, Excel или PowerPoint) и отправить им для того, чтобы они разобрались, почему произошла та или иная ошибка, и дали рекомендации по её устранению. Если же вы хотите сохранить скриншот на свой компьютер, то необходимо открыть любой графический редактор (самый простой — встроенный в Windows Paint), вставить его туда (либо через меню «Правка» — «Вставить», либо простой комбинацией клавиш «Ctrl» + «V» в английской раскладке клавиатуры) и сохранить в любом удобном месте на вашем компьютере или на съёмных носителях информации.
Если вам необходимо сделать скрин не всего того, что происходит на мониторе, а только какое-то отдельное окно папки или программы, то нужно сделать активным это окно, а затем нажать на клавиатуре комбинацию клавиш «Alt» + «Print Screen».
В целом, скриншоты нужны в тех случаях, когда проще показать или отправить собеседнику скриншот происходящего на экране, чем долгое время объяснять это или перепечатывать в текст письма вручную.
Но что делать, если вам нужен скриншот какой-либо страницы, которая по вертикали не умещается в размер монитора? Например, вам необходимо сохранить в виде изображения длинную страницу размером в пять-шесть вертикальных длин вашего монитора, согласно вашей вертикальной полосе прокрутки.
Существует несколько способов сделать это.
1. Самый простой, не требующий установки никаких программ, и в то же время самый затратный по времени, и не очень качественный способ — это сделать последовательно несколько скриншотов друг за другом, каждый раз прокручивая страницу на один экран вниз, и параллельно вставлять получаемые картинки друг за другом, например, в Word или Excel. Недостатком этого способа является продолжительность его по времени, получение нецелой картинки и необходимость подгонять друг к другу края предыдущего и следующего изображения. Применять этот способ можно только в тех случаях, когда вы торопитесь и вам неважно качество итогового результата. В этом случае вы не получите целого, единого изображения.
2. Использование онлайн-сервисов создания скриншотов любых страниц сайтов. Для примера попробуем получить скрин одной из страниц моего сайта «Компьютер с умом», на которой я рассказываю об увеличении размера текста (откроется в новом окне):
На моём рабочем мониторе эта страница занимает четыре вертикальных размера экрана. Существует замечательный онлайн-сервис, который легко справляются с поставленной задачей, выдавая в результате полноценные скриншоты длинных страниц. Предлагаю ознакомиться с ним и использовать его в дальнейшем, если он вам понравится.
Пройдя по ссылке выше, вы попадаете на простенькую страницу, на которой надо указать адрес той страницы сайта, с которой мы хотим получить полноразмерный скриншот. Копируем его из адресной строки браузера (или прямо из этой статьи) и указываем на этом сайте нашу страницу для теста: https://сайт/sovetyi/kak-uvelichit-razmer-teksta .
Нажимаем кнопку «Capture Screenshot» и ждём, пока сайт сгенерирует изображение (прогресс дойдёт до 100%). Обычно это занимает от нескольких секунд до пары минут, в зависимости от вертикальной длины страницы.
Нажимаем на кнопку «Download Image» («скачать изображение»), и начинается автоматическое скачивание скриншота полученной страницы.
Открываем полученное изображение и убеждаемся, что сервис сработал отлично, скриншот длинной страницы получен и сохранён в виде картинки для дальнейшей работы.
Разумеется, существует достаточно большое количество онлайн-сервисов, которые позволяют сделать то же самое, что и Web Screenshots, но некоторые из них достаточно сложны в освоении, некоторые требуют регистрации, чтобы получить необходимое изображение, поэтому я рекомендую вам то, чем пользуюсь сам.
3. Если вы используете браузер Google Chrome, то задача упрощается. В этом случае необходимо найти и установить расширение для Google Chrome, которое называется Awesome Screenshot. Для этого достаточно ввести в поисковый запрос поисковых систем Гугла или Яндекса следующую строчку «Awesome Screenshot для Google Chrome» (можете скопировать прямо отсюда), и по первым ссылкам поисковой выдачи перейти на сайт установки расширений для этого браузера.
Яндекс:
Google:
После перехода на сайт установки расширения нажимаем кнопку «+ Бесплатно» и устанавливаем его в ваш браузер:
Подтверждаем установку расширения нажатием на кнопку «Добавить»:
В результате сверху в вашем браузере Google Chrome появится иконка установленного расширения:
Разберём основные возможности этого расширения. Щёлкаем мышкой на этом значке и открываем его меню:
Кратко по основным пунктам этого меню:
- Capture visible part of page — сделать скриншот видимой на экране части страницы
- Capture selected area — сделать скриншот выделенной области (очень удобная опция). После нажатия на эту опцию вы сможете выделить мышкой любой участок на экране монитора и получить изображение этой области.
Тем не менее, для наших первоначальных целей (создания скриншота длинной страницы) необходимо зайти нужную страницу в интернете и выбрать пункт меню «Capture entire page » («сделать скриншот целой страницы»).
Расширение само прокрутит страницу до конца вниз и перенаправил вас на новую страницу, где надо можно будет отредактировать сделанный скриншот, либо просто можно нажать сверху кнопку «Done»
Наш скриншот готов, осталось лишь справа выбрать дальнейшие действия с ним:
- Save — сохранить картинку в графическом формате файла;
- Copy — скопировать его в буфер обмена;
- Print — отправить картинку на принтер для печати.
Мы с вами сохраним его в виде картинки, поэтому выбираем «Save»
Указываем место на вашем компьютере, куда сохранить полученный файл, и заканчиваем работу с расширением.
Надеюсь, эта статья была для вас полезной. Если у вас будут какие-то вопросы по работе указанных в статье способов — спрашивайте в комментариях.
Навигация записиВ одном из своих постов я писал про Google Chrome плагин для создания и редактирования скриншотов . Он предоставляет достаточно много инструментов для обработки снимков. Но, как известно больший функционал потребляет больше ресурсов компьютера. Что если все эти инструменты не нужны и перед пользователем стоит всего одна конкретная задача: например, сделать скриншот всей страницы сайта целиком или какой-то отдельной ее части? Устанавливать тяжелое расширение в Google Chrome смысла нет, особенно на слабом ПК.
Есть оптимальный вариант:
FireShot – быстрое создание снимков экрана (скриншотов)
FireShot (урезанная версия) – плагин, который позволит быстро сделать снимок страницы сайта в браузере Google Chrome .
Установка плагина
Установку плагина можно осуществить из интернет-магазина Хрома, перейдя по ссылке:
На открывшейся странице следует нажать «+бесплатно» и подтвердить новое расширение.
После чего в правом верхнем углу браузера вас уведомят об успешной установке FireShot.
При нажатии на значок расширения откроется меню.
Доступно 3 опции:
Захватить всю страницу – скриншот всей страницы сайта , включая прокрутку.
Захватить видимую область – скриншот только той области, которую вы видите в данный момент, без скролла.
Захватить регион – снимок выделенной части экрана .
Обратите внимание, что справа от каждой опции отображается соответствующая комбинация клавиш. Как видите, они очень неудобные. 4 кнопки – слишком много. Поэтому следует зайти в настройки и прописать свои горячие клавиши, которые будут вам удобны. Главное, чтобы они не совпадали со стандартными горячими клавишами Google Chrome, во избежание конфликта.
Так же в настройках можно выбрать один из двух форматов скриншотов по умолчанию: JPG и PNG.
Как я уже упомянул, это урезанная версия, предоставляющая лишь минимальный функционал. На странице сохранения скриншота есть ссылка, перейдя по которой можно сделать апгрейд до PRO версии, в которой доступно значительно больше возможностей.
Приветствуем вас! Сделать снимок экрана компа довольно просто с помощью сочетаний клавиш по умолчанию. Но бывают случаи, когда вам необходимо сделать скрин экрана всей страницы, но вы не просто хотите одну небольшую часть страницы, а нужна вся веб-страница — или, по крайней мере, более одной ее части. Как сделать снимок экрана на компе с прокруткой страницы? Мы пробовали много инструментов и методов, но только некоторые из них работают. Вот об этом мы сегодня и поговорим, а также мы укажем на плюсы и минусы каждого метода. Ну что поехали?
1 Захват окна прокрутки или всей страницы с помощью Snagit
Мы длительное время были поклонниками Snagit. Это мощное приложение для захвата и редактирования экрана, которое позволяет вам делать практически все, что связано с скриншотами. Вместе с Camtasia (программное обеспечение для записи экрана и редактирования видео), это отличные продукты от TechSmith.
Обратите внимание: Snagit не является бесплатным, но у него есть 15-дневная бесплатная пробная версия. Чтобы сделать полный снимок экрана страницы, выполните следующие действия (мы будем использовать Snagit для Windows в качестве примера).
Шаг 1. Скачайте Snagit и установите его на свой компьютер. Откройте главное окно захвата. В разделе «Image (изображение)»> «Selection (выбор)» убедитесь, что вы выбрали «Scrolling Window (окно прокрутки)». Нажмите красную кнопку «Capture» для продолжения.
Шаг 2. Идем на страницу, с которой вы хотите снять скриншот, затем переместите курсор в эту область. Теперь Snagit будет активирован, и вы увидите три кнопки с изображением желтой стрелки.
Нижняя стрелка представляет «Захват вертикальной области прокрутки», стрелка вправо представляет «Захват горизонтальной области прокрутки», а стрелка в правом нижнем углу — «Захват всей прокручивающейся области». Мы будем использовать кнопку «Захват вертикальной области прокрутки».
Шаг 3. Теперь Snagit автоматически прокручивает страницу и захватывает части экрана. Вскоре появится окно панели редактора Snagit со снимком, который он только что сделал.
Плюсы:
Минусы:
2 Онлайн сервис Web-Capture.Net
Это онлайн-сервис для скриншотов веб-сайта. Шлепаем на Web-Capture, копируем URL-адрес веб-страницы, которую хотите снять с экрана, и вставляете ее здесь (см. Ниже). Вы также можете выбрать формат файла для экспорта. Нажмите «Enter» на клавиатуре, чтобы продолжить или «Захват веб-страницы».
Ждем. Нам потребовалось около двух минут, прежде чем мы увидели сообщение: «Ваша ссылка обработана! Вы можете скачать файл или ZIP-архив. Теперь вы можете скачать скриншот.
Плюсы:
Минусы:
3 Способ с помощью команд по умолчанию
Уменьшите страницу и используйте команды по умолчанию. Это быстрое решение, если страница выходит за пределы видимой области вашего экрана. Увеличьте масштаб до тех пор, пока он не встанет на экран, а затем используйте команды по умолчанию для захвата полного скриншота.
То есть — в Windows, нажмите «Print Screen» на клавиатуре. Он сохранит скриншот в буфер обмена, поэтому вам придется открыть графический редактор и вставить скриншот в новый файл.
4 Снимок экрана с помощью программы PicPick
Существует множество бесплатных утилит для скриншотов, как бесплатных, так и платных. Большинство из них трудны в установке и работу выполняют не так как нам хотелось бы. Мы выбрали PicPick, как одну из лучших доступных программ. Он бесплатный, доступный для Windows, XP и более поздних версий, с полным набором различных функций.
Шаг 1. Загружаем и устанавливаем PicPick. Простой мастер установки проведет вас через весь процесс установки, от установки файлов до создания ярлыка на рабочем столе.
Шаг 2. После открытия выберите тип выделения из списка, размещенного в разделе «Захват экрана» в нижнем левом углу главного окна программы.
Как инструмент Snipping, есть опции для скриншотов в свободной форме, прямоугольных, оконных и полноэкранных снимках, а также параметры окна фиксированной области и прокрутки для большего контроля при захвате удлиненных изображений.
Шаг 3. Сохраните снимок экрана. Выполните любые изменения, которые вы хотите, например, обрезку и наложение фильтров, и щелкните по главному файлу в верхнем левом углу.
Затем выберите «Сохранить как», запишите новый файл, выберите место сохранения и выбираем необходимый формат файла в раскрывающемся меню. На выбор можно выбрать множество форматов, включая JPG, PNG, GIF или PDF. После завершения жмем на кнопку «Сохранить» в правом нижнем углу.
Плюсы:
Минусов нет. Ну мы по крайней мере не нашли)).
Заключение
Мы рассказали вам о четырех методах сделать скриншоты для полной или прокручиваемой веб-страницы. Как мы уже говорили, у разных методов есть свои преимущества и недостатки, поэтому обязательно выберите тот, который оптимальным образом соответствует вашим потребностям.
Если у вас есть долгосрочные потребности в скриншотах, мы настоятельно рекомендуем Snagit, так как это более мощный и удобный способ, хотя вам придется потратить кое-какое время на ознакомление с приложением или бесплатную программу PicPick. Если у вас есть какие-либо вопросы или предложения, не стесняйтесь оставлять комментарии ниже. А у нас на этом все. Всем пока!
С уважением Вячеслав и Валерия!