Версия для печати

Как вам наверняка известно, в каждом браузере есть возможность создания закладок (bookmarks) на заинтересовавшие вас страницы. И это очень удобно — нашел что-то понравившееся, сохранил закладку и вернулся, когда потребовалось. После чего... Ну, скажем, обнаружил, что страница уже удалена. Словом, иногда страницу хочется распечатать.

 

 

И если автор сайта предусмотрел это желание посетителя, сделав «версию для печати», то посетителю наверняка будет приятно. И скорее всего, он снова вернется на этот сайт...

Для начала давайте подумаем, чем «версия для печати» должна отличаться от обычной страницы. Первое что приходит на ум — баннеры и прочая реклама. Действительно, зачем они нужны на бумаге? Долой!.. Следующая ненужная деталь — навигация по сайту. Тоже долой! Всякие счетчики, иконки и цветной фон тоже стоит убрать (разумеется, если основным содержанием страницы не является демонстрация чего-то именно на цветном фоне)... А вот чего не хватает — так это адреса документа, добавленного к тексту страницы (не все браузеры автоматически добавляют его при печати), и адресов встроенных ссылок. Действительно, если в этой статье написать, что об использовании CSS можно прочитать здесь, то при желании о нем прочитать вы просто щелкнете по ссылке. А вот если текст будет напечатан на бумаге, то вам придется долго думать, где же находится это «здесь» (современные браузеры как правило добавляют список ссылок при печати, но пользоваться им бывает не очень удобно)...

В версии для печати стоит по максимуму убирать украшательства и оформлениеТеперь, определившись с тем, что нам хочется получить, подумаем, как этого добиться.

Способ первый: тривиальный. Можно банально написать по два варианта каждой страницы и к каждой «нормальной» странице добавить ссылку на «печатный вариант». Способ этот вполне работоспособен, но его трудоемкость растет жуткими темпами при увеличении числа страниц на сайте. Не говоря уже о том, что заниматься подобным извращением просто не интересно. Так что этот способ мы с чистой совестью отбросим.

Есть возможность указать отдельную таблицу стилей для использования при выводе страницы на принтерСпособ второй: шпионский. Можно подключить к странице специальную таблицу стилей, которая будет использоваться только при печати. Делается это с помощью команды:

<LINK TYPE="text/css" REL="stylesheet" MEDIA="print" HREF="print.css">

Свойство display: none; удаляет элемент из стандартного потока, а свойство visibility: hidden; не показывает элемент, но резервирует для него место на страницеВсе, что нам потребуется от этой таблицы стилей — это переопределить стили вывода различных блоков страницы. А именно — установить свойство display: none; для баннеров, навигации и прочих ненужных частей страницы (разумеется, для этого следует в «нормальной» версии страницы «загнать» эти элементы в блоки и задать им какой-то класс или идентификатор, чтобы в таблице стилей их можно было как-то адресовать). Обратите внимание, что изменять надо именно свойство display, а не visibility — если вы укажете в стиле visibility: hidden, то вместо блока появятся пустые пятна, а если укажете display: none, то такой блок просто исчезнет из стандартного потока, как будто его код вовсе не присутствует на странице. Кроме того, имеет смысл изменить шрифт — вместо «рубленых» шрифтов из семейства sans-serif при печати лучше использовать шрифт с засечками. Следует учитывать, что «исчезновение» ненужных элементов страницы вызовет «подвижку» всех остальных — природа, как известно, не терпит пустоты, — так что не забудьте проверить, как выглядит страница, к которой применен «печатный» стиль...

Преимущество этого подхода заключается в том, что «версия для печати» как бы скрыта от пользователя — специальное форматирование никак не выдает себя при просмотре страницы через браузер. Недостаток этого метода — в том, что не все браузеры понимают подключенные таким образом таблицы стилей. Кроме того, все, что мы хотели проделать со ссылками и адресом документа, не выполнится — текст будет напечатан в том же виде, что и на «нормальной» странице...

Хороший проргаммер — ленивый программер: он постарается максимум работы переложить на компьютерСпособ третий: две строки. Этот способ является некоторой модернизацией предыдущего, позволяя использовать «печатную» таблицу стилей даже с теми браузерами, которые не понимают указания MEDIA="print". Все, что требуется проделать — это подключить требуемую таблицу в зависимости от ссылки, по которой щелкнул посетитель. Например, к своей странице вы добавляете ссылку

<a href="/redir.php?url=mysite.ru%2Fmypage.php%3Fview%3Dprint">версия для печати</a>

а в заголовке страницы пишете что-то вроде

<link TYPE="text/css" REL="stylesheet" HREF="<?php echo ($_GET['view'] == 'print') ? "print.css" : "normal.css"; ?>">

Теперь (разумеется, если ваш сервер понимает PHP) при загрузке страницы будет проверено, не собирается ли посетитель страницу распечатать, и если да, то к странице подключится таблица print.css, а если нет, то normal.css. Кстати, раз уж ваш сервер все равно понимает PHP, то и вывод ссылки на «версию для печати» тоже можно автоматизировать:

<?php if ($_GET['view'] != 'print') echo "<a href=\"".$_SERVER['PHP_SELF']."?view=print\">версия для печати"; ?>

Этот способ, разумеется, тоже не лишен недостатков: во-первых, текстовые ссылки так и не появились, а во-вторых, пользователю будут пересылаться, в том числе, и те данные, которые не будут отображаться (все те же скрытые с помощью «печатной таблицы стилей» баннеры и навигация).

Способ четвертый: оптимальный. Этот способ объединяет все предыдущие, включая и с гневом нами отвергнутый «тривиальный». Суть его — автоматизировать изменение внешнего вида страницы. Реализация этого способа сильно зависит от того, каким образом у вас организован сайт, но общая идея заключается в том, чтобы разнести, например, в разные функции вывод постоянных элементов страницы (таких как логотип), временных — все тех же баннеров и навигации — и, собственно, содержимого.

При таком подходе вы сможете модифицировать страницы любым удобным способом, в частности, указав для «печатной версии» что-то вроде

$data = preg_replace("|(]?href=\"?(.*?)[ \">\s].*?)|i", "$1 [ $2 ]", $data);

Вы сможете легко добавить ко всем внутренним ссылкам в тексте их адрес, заключенный в квадратные скобки, что обычно бывает удобно. Добавить адрес текущей страницы при таком подходе тоже не сложно, равно как и внести любые другие изменения, которые вы посчитаете нужными. И останется только сделать проверку переменной $_GET['view'] и в зависимости от ее значения решить, надо ли выводить на страницу навигацию, и надо ли совершать дополнительные преобразования над текстом.

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

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

Ссылки по теме

• Постраничный вывод текста на сайте

Статья получена: hostinfo.ru