Меня не перестает удивлять, что людям приходится искать ссылку или кнопку с надписью «Печать» на веб-странице, особенно с учетом чудесной технологии, которая делает этот шаг ненужным. К сожалению, им почти никто не пользуется, хотя ему… 10 лет.
Не только глупо требовать дополнительного шага для печати, но и использование таблиц стилей печати сэкономит немного чернил для тех, кто не использует ссылку для печати. И, конечно же, есть множество людей, которые используют печать в PDF, чтобы сохранять статьи на потом, не тратя бумагу.
Что такое таблицы стилей печати?
Большинство веб-сайтов реализуют свою функцию печати, перенаправляя вас на другую страницу, которая отформатирована по-другому для принтеров, но в этом нет необходимости. В каждом браузере реализована простая технология CSS, известная как Печать таблиц стилей , который представляет собой не что иное, как файл, в котором указаны элементы, которые нужно скрыть при печати страницы браузером.
Для тех, кто не знаком, CSS означает каскадные таблицы стилей, и это то, как ваш браузер знает, как форматировать исходный HTML-код веб-страницы в то, что вы действительно видите на экране. В таблице стилей можно указать все: от шрифтов, цветов, границ и даже фоновых изображений.
Добавить таблицу стилей для печати так же просто, как вставить эту единственную строку в HTML-код вашей страницы - часть кода media = print сообщает браузеру использовать эту таблицу стилей только при печати.
<link rel = "stylesheet" href = "print.css" type = "text / css" media = "print">
Этот файл обычно выглядит примерно так:
#sidebar, #footer, #navigation, #sharinglinks, #topad, #comments { display:none }
Да, это действительно так просто. Итак, как это работает? Вот пример обычной веб-страницы слева, на которой вся навигация, логотип и реклама четко видны с соответствующим идентификатором, а справа - та же страница с примененной таблицей стилей печати, скрывающей все эти элементы.
Очевидно, вы предпочли бы напечатать один из них, не так ли?
Примеры сбоя печати таблицы стилей
К сожалению, существует множество огромных веб-сайтов, которые вообще не позаботились об этом. Посмотрите, что происходит, когда вы пытаетесь распечатать из New York Times:
Некоторые сайты, такие как сеть сайтов Gawker, еще хуже. Мало того, что у них нет вида для печати, когда вы все же пытаетесь распечатать, он напоминает чернильный суп. Насколько мы можем судить, невозможно печатать с сайта Gawker без использования отдельной службы, такой как Readability, или выделения вручную содержимого на странице, что практически невозможно в их новом дизайне.
Это действительно печально. Множество крупнейших сайтов просто не удосуживаются реализовать эту функцию.
К счастью, некоторые сайты их используют
Вот пример правильно отформатированного представления для печати - без необходимости искать ссылку для печати. Сайт BBC News аккуратно форматирует статьи для печати с настраиваемым заголовком. Они включают комментарии в режиме печати, но это все равно хорошо сделанная работа.
Есть немало других сайтов, которые делают то же самое, например ArsTechnica и… наш сайт, но было бы глупо показывать скриншоты всех из них. Согласно нашему исследованию, сайтов, которые их правильно реализовали, очень мало.
Итак, чтобы подвести итоги ... уделите 5 минут, необходимых для реализации таблицы стилей печати для вашего сайта!
