Поиск

Создание фона HTML-документа

К фоновому рисунку HTMLдокумента, безусловно, предъявляется ряд требова ний. В зависимости от того, какой вид хочет придать своей странице автор, выби рается направление конструирования фона. До недавнего времени классическим решением было создание бледносерого фона с таким же бледным, но рельефным рисунком. Здесь очень многое зависит от художника, но современные графические редакторы позволяют создавать похожие эффекты и автоматически. Такой' фон не должен ощутимо снижать контрастность страницы и мешать чтению текста. В последнее время в моде на фоновые рисунки произошли изменения. Все чаще можно встретить белый фон. Белый цвет вне конкуренции, и тут не надо чтолибо объяснять. Другое направление — использование бледного фона, но другого цве та, например, бежевого, голубого или зеленого. Сам рисунок выглядит как произ вольный узор из точек, напоминая поверхность кожи или камня. Здесь опять таки, полет фантазии художника ограничивается необходимостью обеспечения контрастности.

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

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

Рассмотрим процедуру подготовки изображения для фона. В качестве примера я хочу использовать текстуру. Как правило она имеет нерегулярный рисунок и не содержит ярко выраженных деталей. Фрагментами могут быть изображения об лаков, деревьев, камней, поверхности воды. Основой фона документа может стать и фрагмент фона картины, выполненной акварелью или маслом. Все это легко найти в Сети. Так, например, для получения древесного рисунка вовсе не обяза тельно искать изображение среза дерева. Можно использовать подходящую фо тографию дерева и вырезать кусочек изображения ствола. Один раз мне попалась фотография старого дерева с содранной временем и ветром корой. Кусочек фото графии пригодился для создания «орехового» фона Webстраницы. На рис. 7.1 видно, что рисунок многократно повторяется и границы между фрагментами хо рошо заметны.

Чтобы убрать границы, надо использовать четыре одинаковых изображения. На рис. 7.2 показана схема их преобразования и соединения. Для трех фрагмен тов надо выполнить операции зеркального отображения. В редакторе Paint это можно сделать, выбрав команду Рисунок > Отразить/повернуть. Затем требуется ак куратно соединить четыре фрагмента так, чтобы между ними не оставалось пус того пространства, но и не было наложения. Это удобно сделать в режиме увели чения. В конце работы полученный рисунок перемещают в верхний левый угол рабочего поля и выбирают размер рисунка так, чтобы не оставалось незаполненно го пространства. Осталось конвертировать изображение в формат JPG или GIF.

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

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

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