HTML в PDF: как сохранить веб-страницу

Сохранить веб-страницу в PDF: что попадёт в архив, а что нет

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

Но между «страница в браузере» и «страница в PDF» есть несколько шагов, на которых теряется содержимое. Разберём, где именно.

Инструмент принимает файл, а не адрес страницы

Первое, что стоит понимать: адрес сайта в него не вводится. Загружается сохранённый HTML-файл.

Сохранить страницу можно средствами браузера. В диалоге сохранения обычно есть выбор между «только HTML» и вариантом, который упаковывает страницу целиком. Второй вариант заметно лучше: он собирает разметку, стили и изображения в один файл, и именно это нужно для архива.

Почему так устроено, объясняет следующий раздел, и это же объясняет большинство неожиданных результатов.

Почему пропадают картинки

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

Отсюда жёсткое правило: ссылки на локальные файлы не работают. Если рядом с вашим `page.html` лежит папка `page_files` с картинками, ни одна из них в PDF не попадёт. Браузер просто не сможет до них дотянуться.

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

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

Всё, что появляется после загрузки, в PDF не попадает

Второй источник потерь — динамика.

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

По этой же причине не сохраняются раскрывающиеся блоки в закрытом состоянии, содержимое вкладок кроме активной и всё, что показывается по наведению.

Проверить, попадёт ли содержимое в архив, можно заранее: отключите в браузере выполнение скриптов и перезагрузите страницу. То, что осталось видно, попадёт в PDF. То, что исчезло, не попадёт.

Чем PDF-архив отличается от скриншота и от закладки

Три способа сохранить страницу решают разные задачи, и путать их дорого.

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

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

Как выполнить сохранение

1. Откройте страницу в браузере и сохраните её как HTML, выбрав вариант с упаковкой в один файл. 2. Откройте html-to-pdf и загрузите сохранённый файл. 3. Выберите размер страницы: A4 или Letter. 4. Оставьте фоновую графику включённой, если оформление важно. 5. Запустите обработку и сравните результат с исходной страницей.

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

Фоновая графика и зачем её оставлять включённой

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

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

Выключать его имеет смысл ровно в одном случае: страница уходит на печать и заливки съедят тонер. Для архива оставляйте включённым.

Размер страницы и широкие таблицы

Размер страницы по умолчанию A4. Выбор здесь только между A4 и Letter, произвольного формата нет.

С этим связана единственная неустранимая проблема. Веб-страница не имеет ширины: она подстраивается под окно. PDF имеет ширину жёстко. Широкая таблица, которая в браузере прокручивалась вбок, в PDF обрежется по краю листа.

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

Когда HTML превращается в простой текст

Есть автоматический быстрый путь. Очень большие HTML-файлы, в которых нет ни изображений, ни таблиц, ни встроенных стилей, ни медиа, отрисовываются как простой текст, без вёрстки.

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

Молча это не происходит. К результату прикладывается предупреждение о том, что документ собран в упрощённом виде и оформление не сохранено. Если такой результат вас не устраивает, значит файл попал под эвристику ошибочно, и стоит пересохранить страницу так, чтобы в ней осталась разметка.

Что делать с готовым архивом

Три шага, которые стоит сделать сразу.

Проверьте вес. Страница со множеством изображений даёт тяжёлый PDF, и compress-pdf уменьшит его без потери текста.

Заполните свойства документа. В PDF, полученном из HTML, поле названия обычно пустое или содержит служебную строку. Осмысленное название и дата в свойствах через set-pdf-metadata сильно облегчают поиск в архиве через год.

Если страниц несколько и они составляют один документ, соберите их через merge-pdf в порядке чтения, а не сохранения.

И последнее. Для долгого хранения имеет смысл прогнать результат через pdf-to-pdfa: архивный профиль требует, чтобы всё необходимое для отображения лежало внутри файла, что для архива и нужно.