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

Полная версия

Одним из достоинств css-верстки является то, что все описания, относящиеся к оформлению текста и позиционированию, находятся во внешнем файле, который, будучи один раз загруженным подставляется к страницам, открываемым впервые, но использующим этот же css-файл. Таким образом, уменьшается размер страниц, упрощается работа с самим документом и т.д. Но возникает проблема следующего плана. Предположим, что пользователя заинтересовала статья сайта и он ее сохраняет себе на диск. Т.к. внешнее оформление страницы его в данный момент не интересует, то логично, что при сохранении он выбирает опцию "Web page, HTML only". Естественно, что без css-файла страница будет выглядеть ужасающе. Хорошо если ее часть со статьей останется более-менее нормальной для восприятия. Ситуацию, когда пользователь просто копирует текст страницы непосредственно из броузера мы рассмотрим чуть ниже.

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

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

Итак, задача поставлена - убрать все лишнее, если внешнего файла с css-определениями не оказалось.

Убрать ненужные блоки можно двумя способами - применить к ним свойство display: none или visibility: hidden. В первом случае блок удаляется из потока, во втором - блок становится невидимым, но продолжает занимать определенную площадь. Значит, второй вариант нам не подходит.

Очевидно, что правила, которые делают блоки невидимыми, должны находиться непосредственно в html-документе. Так, для того чтобы скрыть шапку данной страницы (блок top) и правую часть с меню (блок mainright), в теле документа необходимо записать:

     #top {display : none}
     #mainright{display: none}

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

     #top{
	...
     display: inline !important;
	...	}
     #mainright{
	...
     display: inline !important;
	...	}

Ну все, теперь, если внешний файл присутствует, то никаких изменений с документом не происходит. Если же в нужное время в нужном месте его не окажется, то нежелательные блоки будут удалены. Опять же, версию для печати исходного документа можно сделать, удалив тег, подключающий внешний файл с определениями. Это можно реализовать с помощью ssi.

В качестве примера можете посмотреть , как будет выглядеть данная статья без подключения основного css-файла. Некоторые элементы оформления текста все-таки можно оставить внутри документа, например, выделение заголовков, замечаний, определений и др.

Возможно еще одно применение описанного механизма. На сайте webmasteram.ru есть статья "Как защитить от копирования текст на Вашем сайте". В ней предлагаются довольно радикальные меры, которые лишь препятствуют копированию текста из окна броузера. Согласитесь - не самый лучший подход. А если человек просто хочет скопировать текст, чтобы затем его распечатать?

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

Для того, чтобы сделать блок невидимым у нас есть два средства. Однако если мы применим свойство display:none, то блок не только не будет виден, его не будет вообще. Значит остается только второй вариант, но учитывая, что при использовании visibility:hidden место занимаемое блоком остается пустым, его можно позиционировать абсолютно, т.е. он будет находиться поверх текста статьи и никакого дополнительного места занимать не будет:

    #noneblock{	position: absolute;
    visibility :hidden;
 	}

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

В заключение надо отметить, что с Oper'ой описанный механизм не пройдет, т.к. невидимый текст скопирован не будет. И еще, определение невидимого блока должно находиться во внешнем файле.