Полноразмерный скриншот огромной web-страницы для дальнейшей печати. HTML 2 PSD/PNG/PDF или что-то в этом роде. Как сделать?

Question

[Никита]

Приветствую!
Возникла необходимость подготовить к печати плакат формата A2, который из соображений удобства и имеющихся навыков был подготовлен в виде html+css+js страницы. Ширина страницы 5995px; высота 8461px. Состоит из фоновой картинки и текстов со стилями.
Перепробовал довольно много плагинов для Firefox и Chrome, пару онлайн сервисов — никто не справляется.
В крайнем случае можно отскриншотить по частям, но это трудоёмкий костыль, либо уменьшить размеры, но тогда тексты при печати будут не такими чёткими.
Есть какие-нибудь варианты? Может, можно сделать импорт текстов и стилей в Photoshop? Или хороший инструмент печати в файл?

Answer 1

[JRazor]

Возможно это: FastStone Capture. "Захват окна с прокруткой".

Comments

[Никита]

Вот пока единственное приложение, которое хоть нормально само прокручивает, но тоже только по вертикали. В итоге, с помощью него и $('body').scrollLeft(ширина экрана*n) сделал 5 скриншотов, соединил в Photoshop.

Answer 2

[Егор Огурцов]

Мсье знает толк!

Comments

[Никита]

Признаться, в ряде случаев такой способ реально удобнее, чем, например, Photoshop.

[Егор Огурцов]

Я вижу, что удобнее. Аж пост с вопросами пришлось писать.

Answer 3

[itspers]

А как вы просто смотрите страницу в 6000px, еще на этапе верстки?

Я думаю можно попробовать шлепнуть скрин чем-нибуль типа https://github.com/brenden/node-webshot

Comments

[Никита]

Так и смотрю, уменьшаю масштаб в браузере.

Не совсем понятно, как пользоваться?

[itspers]

@Pontific , устанавливаете node.js и npm

npm install node-webshot и дальше по примерам

вот еще проще, тут можно прямо с консоли запускать
https://github.com/sindresorhus/pageres
я даже проверил, работает
https://dl.dropboxusercontent.com/u/1952316/google...

[itspers]

@Pontific если у вас винда и там все сложно - киньте ссылку, запущу у себя. Это ж еще не факт, что та версия вебкита, которая в ноде, поддержует всякие css3 плюшки, если вы их использовали. Может проще расширение для хрома написать.

[Никита]

Спасибо! Хочу сам научиться. Стоит Винда, есть виртуальный хостинг. Расширения подходящего так и не нашёл. Не думал, что это такая сложная задача.

[itspers]

@Pontific
Виртуальный хостинг не есть виртуальный сервер. Если есть полноценный сервер - тогда конечно проще поставить нод из консоли.

А под виндой теоритически все просто:
Тут nodejs.org/download есть инсталятор для винды (я просто никогда под виндой такое не пробовал, поэтому не знаю что там дальше и какие могут быть подводные камни).
Предпологаю, что оно установится в Program Files, как обычная программа. И где-то там будет лежать node.exe. Туда можно завалиться виндовым cmd.exe, заделать
npm install --global pageres
и можно писать
pageres google.com 6000x8000

Это я так прикидываю судя по картинкам вот отсюда dailyjs.com/2012/05/03/windows-and-node-1

[Никита]

Никогда ничего подобного в консоли не делал, поэтому даже не хотелось... Это странно, но у меня получилось. Спасибо!
CSS-тени, скругления работают, только со шрифтами сложности — изгибы лесенкой (без сглаживания), некоторые не хотят работать.

Answer 4

[artanets1]

Могу посоветовать два варианта но оба со своими недостатками. (позавчера столкнулся с подобной задачей)
1. www.thumbalizr.com/index.php (когдо он обработает сайт можно вручную вписать нужную ширмну картинки (но сайт может поплыть)
2. Snagit 11 - может полностью скопировать страницу браузера прокрутив ее вниз, но сохраняет ее размером розришения монитора. (с интернет эксплорером сработал точно)

Comments

[Никита]

Спасибо, но:
1. Не хочет такую большую страницу.
2. Горизонтальная прокрутка видна несколько раз на скриншотах, но фоткает только с вертикальной прокруткой.

[Никита]

2. Вернее, вообще приложение вылетает при попытке фотографирования с обеими прокрутками. Так каши с ним и не сварил. Хотя функционал интересный.

Answer 5

[Jonh Doe]

webkit2png вам поможет

Comments

[Никита]

Спасибо, но так и не понял, как им пользоваться.

[Jonh Doe]

это скрипт на питоне