В поисках информации в интернете, нам иногда попадается интересная web-страница, которую мы сразу сохраняем себе в закладки. Потом в следующий раз можно кликнуть по этой закладке и страница опять загрузится, но это при условии, что есть доступ к интернету. Но при этом мы не задумываемся, что безлимитка или трафик может, не вовремя закончится или со стороны провайдера есть проблемы. Так может подобные web-страницы сохранять в виде документа на жёсткий диск своего компьютера, а лучше в формат PDF.

Или нам нужно просто сохранить веб-страницу в формате PDF . Начинаем прибегать к различным методам, например, сервисы, с помощью которых можно сделать скриншот страницы или приложения под Windows (FastStone Capture или Joxi). Но есть более простой способ – специальные плагины под ваш любимый браузер Mozilla Firefox, Opera и Google Chrome. Под Internet Explorer, честно сказать, не нашел, а вернее не искал, так как им не пользуюсь.

Сохраняем веб-страницу в PDF в браузере Google Chrome

Что мне нравится в Google Chrome, что у этого браузера есть встроенная функция сохранения веб-страницы в формат PDF. И не нужно устанавливать сторонние плагины. Для того чтобы воспользоваться данной функцией нужно нажать на кнопку настройка и управление Google Chrome Печать (или горячие клавиши CTRL+ P ).

В настройках печати необходимо изменить тип устройства (раздел принтер). В моем случае стоит принтер Canon LBP 6000B. Я меняю его на Сохранить как PDF .

После можно любую понравившуюся страницу веб-сайта сохранить в формате pdf, нажав на кнопку Сохранить . А если сделать настройки в секретном функционале Google Chrome , то ваши возможности возрастут в несколько раз.

Сохраняем веб-страницу в PDF в браузере Mozilla Firefox

В отличие от Google Chrome, у которого есть встроенная функция сохранения страницы в PDF, у браузера Mozilla Firefox, к сожалению, такой функции нет. Надеюсь, разработчики в дальнейшем доработают данный недостаток. Но пока разработчики мазилы пьют чай, нам же не оставаться в беде и в уныние. Ведь есть плагин Printpdf , с помощью которого можно сохранить веб-страницу в PDF .

А для этого нужно его скачать с этой страницы , нажав на кнопку Добавить в Firefox . После нужно перегрузить браузер и функция сохранения в формате pdf нам станет доступна. Сохранять веб-страницу в pdf можно через меню Файл - Print to PDF .

Плагин Printpdf можно настроить, чтобы сохранись изображения, а также шапка и подвал сайтов. Делает это через меню Инструмент – Дополнения , настройки плагина Printpdf.

Сохраняем веб-страницу в PDF в браузере Opera

Браузер Opera не хочу оставить без внимания, так как у него есть аналогичный плагин, который добавляет в арсенал оперы функцию сохранения страницы веб-сайта в формат PDF. Данное расширение называется Web2PDFConvert и его можно скачать на этой странице . Желательно скачивать через браузер Opera, нажав на кнопку Добавить в Opera .

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

Вот таким образом можно сохранять веб-страницы в формат PDF в браузерах Mozilla Firefox, Opera и Google Chrome без специальных приложений и онлайн сервисов. Такие расширения нужно устанавливать, если вы часто используете эту функцию. Так как при большом количестве установленных расширений, браузер становится громоздким, используются лишние ресурсы операционной системы и долго загружается браузер при запуске. А для того чтобы ускорить и очистить от лишнего мусора операционную систему я использую утилиту

Однако, если в закладках копить не только регулярно посещаемые сайты, но и новости-однодневки или информацию, которая может потом пригодиться, а может и не пригодиться, тогда этот раздел браузера со временем станет захламлён. И в нём трудно будет отыскать нужные закладки.

Для сохранения разовых публикаций существует масса альтернатив, например:

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

Правда, эти способы хороши лишь при условии доступа к сети Интернет. Но есть решения, позволяющие хранить веб-страницы на локальном пространстве компьютера, без интернета – это:

  1. оставить себе «на память» страничку в виде файла HTML или
  2. сохранить веб-страницу в PDF-документ.

О втором способе хотелось бы поговорить подробнее.

1. Почему стоит сохранить веб-страницу в PDF

Сохранение в PDF – оптимальный способ запечатлеть веб-страницу в таком виде, как она есть в данный момент, без каких-либо искажений.

Такой способ можно использовать, чтобы, например,

  • зафиксировать соц.аккаунты лиц, которые предположительно могут удалить с них важную информацию.
  • В PDF-документ можно отправлять статистические данные с аналитических ресурсов.
  • Даже обычные новостные публикации можно сохранять в этот формат файлов, чтобы просмотреть их с мобильных или прочих устройств в удобное время, но когда не будет Интернета.

При сохранении в PDF-формате содержимое веб-страницы оптимально распределяется на листе с дефолтными параметрами, установленными – А4 с книжной ориентацией – для удобства просмотра в программах-ридерах. Дефолтные параметры в случае необходимости можно сменить на другие, более подходящие для ридера на том или ином устройстве.

Чем сохранение веб-страницы именно в PDF-формате отличается от других вариантов?

PDF – универсальный , его поддержка реализована практически на каждом устройстве, в каждой операционной системе.

Однако веб-страницу можно также

  • сохранить в HTML,
  • либо со странички .

PDF-формат выигрывает у HTML-формата, в первую очередь, своей универсальностью и обилием ридеров с разным функционалом.

А от скриншотов, которые можно сделать с веб-страниц, PDF-файл отличается тем, что его потом можно конвертировать в текстовый документ, если это понадобится. Известно, что конвертация из PDF в текст бывает не всегда возможна. Поэтому стоит использовать такие способы конвертации, которые изначально распознают текстовый материал сайтов, соответственно, как текст. Такие способы приводятся для операционной системы Windows ниже.

2. Печать в браузерах для сохранения в PDF-формате

Практически у всех веб-обозревателей (проще говоря, браузеров) есть собственная, встроенная функция печати страниц сайтов. И в рамках этой функции предусмотрена возможность сохранения в PDF.

2.1. PDF в Google Chrome

Рис. 1. Меню Google Chrome (три вертикальные точки) – Печать открытой веб-страницы

  • Кликаем меню «Настройка и управление Goggle Chrome» (1 на рис.1);
  • щелкаем «Печать» (2 на рис. 1).

После чего открывается «Печать» через браузер Google Chrome (рис. 2):

Рис. 3. Жмем «Изменить», чтобы найти в браузере Google Chrome опцию «Сохранить как PDF»

Появится диалоговое окно «Выбор места назначения», в котором надо обратить внимание на вкладку «Локальные места назначения»:

Что в браузере Google Chrome можно подправить для сохранения в PDF?

Если веб-страница в окне предпросмотра отображается некорректно, нужно раскрыть дополнительные настройки.

Рис. 5. Открываем дополнительные настройки Google Chrome для сохранения в PDF

И установить масштаб 100% или другой, более уместный для стиля публикаций конкретного веб-ресурса.

Рис. 6. Масштаб и параметры для PDF-формата в браузере Chrome

2.2. PDF в браузере Microsoft Edge

В операционной системе Windows 10 есть даже два таких механизма:

  1. описанный выше (через браузер Google Chrome) и
  2. реализуемый с помощью Microsoft Print to PDF.

Второй является штатным виртуальным принтером системы, и его задача – обеспечивать возможность сохранения в PDF в любом веб-обозревателе, в любой программе, которая предусматривает печать.

Считается, что печать с участием виртуального принтера создаёт более информативную версию сохраняемой страницы сайта, с отображением её метаданных. Тогда как обычная функция сохранения в PDF в большей степени очищает страницу от лишних веб-элементов и смещает акцент на саму публикацию. Как лучше – дело каждого отдельного случая, однако часто оба эти механизма работают совершенно одинаково.

Как задействовать Microsoft Print to PDF? Для этого в Windows 10 открываем встроенный, штатный браузер Microsoft Edge:

Рис. 7. Значок браузера Microsoft Edge в Windows 10

Открыв Microsoft Edge, нужно

  • в меню «Параметры и другое» (1 на рис. 8)
  • выбрать пункт «Печать» (2 на рис. 8):

Рис. 8. Пункт «Печать» в Microsoft Edge

Если на компьютере не используется реальный принтер, тогда виртуальный PDF-принтер, как правило, установлен по умолчанию.

В противном случае кликаем по названию подключенного принтера. Для примера смотрите ниже на рис. 9, щелкаем по «HP LaserJet M1005». Откроется выпадающее меню, в котором выбираем из списка доступных вариантов печати опцию «Microsoft Print to PDF»:

Рис. 9. Меню Microsoft Edge, в котором можно выбрать реальный принтер или ссылку на «Microsoft Print to PDF»

В Microsoft Edge, кстати, механизм печати с участием PDF-принтера оптимально настроен. Здесь, в частности, по умолчанию выставлен параметр сжатия по размеру веб-страницы. Если прочие параметры не требуют коррекции, можно нажать внизу «Печать»:

2.3. PDF в браузере Mozilla Firefox

Оптимальные настройки PDF-принтера предусматривает и печать на борту Mozilla Firefox.

  • Кликаем кнопку «Открыть меню» (1 на рис. 11),
  • затем – «Печать» (2 на рис. 11):

Рис. 11. «Открыть меню» – «Печать» в Мозилле

В окне «Печать» можно задать параметры для сохранения веб-страницы в PDF (рис. 12):

  • количество необходимых страниц,
  • масштаб,
  • книжная или альбомная ориентация
  • и очень полезная опция «Упростить страницу», которая убирает лишние элементы навигации с веб-страницы. В итоге pdf-документ выглядит аккуратным, «причесанным».

Рис. 12. Сохранение странички в PDF-формате с помощью Мозиллы

Если в Мозилле, опция «Печать» есть название принтера (на рис. 13 – это HP LaserJet M1005), но отсутствует PDF, тогда надо

  • кликнуть по маленькому треугольничку (1 на рис. 13),
  • в выпадающем списке выбрать PDF (2 на рис. 13).

Рис. 13. Поиск PDF-формата в Мозилле

3. Два расширения для Гугл Хром и Мозиллы

Нештатный функционал браузеров может сохранять страницы сайтов в PDF-документы с двумя преимуществами:

  1. в один клик и
  2. с автоматически генерируемым названием файла.

Последнее, кстати, не умеет делать штатная, встроенная функция печати. В магазинах Google Chrome и Mozilla Firefox есть масса расширений для реализации в этих браузерах удобного способа конвертирования интернет-страниц в PDF, и два предложенных ниже – самые толковые из них.

Расширения скачиваются из официальных магазинов, затем устанавливаются в браузер. В итоге на панели инструментов в браузере сверху появляется значок установленного расширения. Далее при необходимости можно открыть веб-страничку, кликнуть по значку такого расширения и сохранить страничку в PDF-документе на своем устройстве.

3.1. Расширение PDF Mage

PDF Mage реализует на панели инструментов Chrome и Firefox кнопку, при нажатии на которую запускается процесс создания PDF из содержимого текущей вкладки. Расширение само генерирует имя файла в соответствии с названием публикации. Имена формируются кириллицей.

Если в браузерах Google Chrome или Firefox установить расширение PDF Mage, то появится значок, отмеченный цифрой 1 на рис. 14.

  • открываем браузер, а в нем веб-страницу,
  • кликаем по значку PDF Mage (1 на рис. 14),
  • смотрим, где именно, в какой папке будет сохранен pdf,
  • жмем «Сохранить» (2 на рис. 14).

Рис. 14. Сохраняем веб-страницу с помощью расширения PDF Mage в Google Chrome

3.2. Расширение Save as PDF

Save as PDF схоже с предыдущим расширением. После его установки

  • тоже появится кнопка (рис. 15) на панели инструментов Chrome и Firefox,
  • тоже работает в один клик,
  • тоже само задаёт файлам имена в соответствии с названиями публикаций. Но с той разницей, что имена генерируются латиницей.

Рис. 15. Расширение Save as PDF в Мозилле для сохранения в PDF-формате

4. Три онлайн-сервиса для сохранения в PDF

4.1. PDFcrowd.Com

Расширение Save as PDF, рассмотренное выше, разработано создателями веб-сервиса PDFcrowd.Com. К услугам этого сервиса можно прибегать при работе с браузерами, которые предусматривают установку расширений.

Принцип работы с сервисом прост: скопированную ссылку на интернет-страницу вставляем в специальное поле, кликаем «Convert to PDF» и указываем путь сохранения файла.

Рис. 16. Сервис PDFcrowd.Com для сохранения в pdf-файле

Подобных рассмотренному выше веб-сервисов в сети несколько, вот ещё парочка аналогов.

4.2. Сервис PDFmyurl.Com

На сайте сервиса PDFmyurl.Com вставляем адрес веб-страницы в поле по центру и кликаем «Save as PDF».

Рис. 17. Онлайн-сервис PDFmyurl.Com сохраняет страничку по ее адресу в PDF-файл

Имена файлов на выходе автоматически генерируются латиницей.

4.3. Сервис Htm2PDF.Co.Uk

Примерно так же поступаем, работая с веб-сервисом Htm2PDF.Co.Uk: вставляем в поле по центру адрес нужной страницы, жмём «Convert!», затем «Download your PDF».

Рис. 18. Онлайн-сервис Htm2PDF.Co.Uk по адресу страницы сохраняет ее в PDF-формате

Этот сервис также сам генерирует имена файлов, и также латиницей. У него есть также расширение для браузера Google Chrome, вот только работает оно через раз. Сам онлайн-сервис более стабилен в этом плане.

5. Горячие клавиши CTRL+P для всех PDF во всех браузерах

Чтобы сохранить какую-нибудь интернет-страницу в PDF, можно открыть ее в любом браузере и нажать на CTRL+P. Напомню принцип работы горячих клавиш: сначала нажимаем клавишу CTRL, затем не отпуская ее, одновременно жмем на клавишу P (на английском регистре). После этого на экране должно появиться окно “Печать”, похожее на то, которое приведено на рис. 2.

Если у Вас подключен принтер к компьютеру, то тогда в окне “Печать” придется кликнуть по кнопке “Изменить” (рис. 3), которая находится рядом с названием вашего принтера. Откроется меню (рис. 4), в котором надо поставить галочку напротив “Сохранить как PDF”.

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

Если Вам не нравится вариант с горячими клавиши, введите в поисковик запрос без кавычек наподобие такого:

  • “расширение сохранить в PDF Опера” или
  • “расширение сохранить в PDF Яндекс Браузер”.

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

Локально его можно отключить, перейдя в about:config и установите для свойства pdfjs.disabled значение true. Возможным обходным путем является использование серверной версии script и изменение формата PDF. Используя php, вы можете использовать fpdf и встраивать расширения в реализовать js (включая функцию print()) или просто преобразовать PDF в изображение, вернуть URL-адрес и распечатать его. Вы можете использовать FPDI , чтобы изменить существующий pdf. Я приведу вам пример того, как я получил его для работы с PHP.

Создание PDF файла с встроенным javascript (autoprint) с помощью FPDI и PDF_JS

Require_once("fpdf.php"); require_once("fpdi.php"); class PDF_JavaScript extends FPDI { var $javascript; var $n_js; function IncludeJS($script) { $this->javascript=$script; } function _putjavascript() { $this->_newobj(); $this->n_js=$this->n; $this->_out("<<"); $this->_out("/Names [(EmbeddedJS) ".($this->n+1)." 0 R]"); $this->_out(">>"); $this->_out("endobj"); $this->_newobj(); $this->_out("<<"); $this->_out("/S /JavaScript"); $this->_out("/JS ".$this->_textstring($this->javascript)); $this->_out(">>"); $this->_out("endobj"); } function _putresources() { parent::_putresources(); if (!empty($this->javascript)) { $this->_putjavascript(); } } function _putcatalog() { parent::_putcatalog(); if (!empty($this->javascript)) { $this->_out("/Names <n_js)." 0 R>>"); } } } class PDF_AutoPrint extends PDF_JavaScript { function AutoPrint($dialog=false) { //Open the print dialog or start printing immediately on the standard printer $param=($dialog ? "true" : "false"); $script="print($param);"; $this->IncludeJS($script); } function AutoPrintToPrinter($server, $printer, $dialog=false) { $script = "document.contentWindow.print();"; $this->IncludeJS($script); } } $pdf=new PDF_AutoPrint(); $pdf->setSourceFile("mozilla.pdf"); //Open the print dialog $tplIdx = $pdf->importPage(1, "/MediaBox"); $pdf->addPage(); $pdf->useTemplate($tplIdx, 10, 10, 90); $pdf->AutoPrint(true); $pdf->Output("generated.pdf", "F");

Теперь вы можете просто добавить сгенерированный PDF файл на свою страницу, а включенный javascript вызовет функцию print() . Вам даже не нужно называть это вручную. Однако в firefox это будет работать только с visibility: hidden , а не с display: none .

"); $("#foo").append(iFrameJQueryObject); } print_pdf("mozilla_generated.pdf");

Chrome: ошибка безопасности (кросс-начало)

PDF должен быть расположен на том же хосте. Firefox был в порядке с другими доменами в моих тестах, но хром дал мне ошибки с перекрестными ошибками.

Firefox: печатная страница включает только about:blank

Вы получите пустую страницу в firefox (jsfiddle), потому что она выведет iframe, прежде чем загрузит любой контент. Упомянутые методы, такие как $(document).onload() , не помогут, поскольку они ожидают загрузки DOM, а setTimeout() все равно могут привести к ошибкам, поскольку вы не знаете, сколько времени требуется загрузить iFrame.

Вы можете просто решить эту проблему, используя jQuery load() . (doc) Это даст вам возможность использовать функцию обратного вызова в качестве параметра.

если предоставляется "полный" обратный вызов, он выполняется после постобработки и вставки HTML. Обратный вызов запускается один раз для каждого элемента в коллекции jQuery, а this устанавливается поочередно по каждому элементу DOM.

Пример кода 1

Function print_pdf(url){ var id = "iframe", html = ""; $("body").append(html); // wait for the iFrame to fully load and call the print() function afterwards $("#" + id).load(function () { document.getElementById(id).contentWindow.print(); }); }

В качестве альтернативы вы можете напрямую создать объект jQuery и использовать jQuery on() (doc) для присоединения любого обработчика событий.

Function print_pdf(url){ var iFrameJQueryObject = $(""); $("body").append(iFrameJQueryObject); iFrameJQueryObject.on("load", function(){ $(this).get(0).contentWindow.print(); }); }