Изменить стиль страницы

Если список разрывается, а потом возобновляется, нужно использовать атрибут start=. К примеру, если список оборвался на числе 15, то его продолжение мы начнем с записи ‹ol start=“16”›.

Напоследок скажем несколько слов про допустимые объемы контента. Здесь справедливо правило «магической семерки», как называется ключевой принцип минимизации текста, найденный опытным путем неутомимыми рекламистами: максимальное число букв в слове – 7, максимальное число слов в предложении – 7, максимальное число предложений в тексте – 7, максимальное число коротких абзацев (по 2–3 предложения) на странице – 7.[15]

С текстом мы разобрались, но сайт может говорить с нами не только через письменные слова, но и через звуковое сопровождение. Звуковое сопровождение бывает двух видов – фоновый звук и звук с проигрывателя. С проигрывателем все понятно. Посетитель заходит на сайт, видит интерфейс аудиоплейера и прокручивает запись, которую ему пообещали. Подобные трюки очень хороши для музыкальных и персональных ресурсов. Организовать нечто подобное у себя вы можете, открыв в Web Page Maker спецально для этих целей сверстанную вами страничку и пройдя путь Insert › Object › Audio, а затем выбрав нужный объект (см. рис. 21). Одна беда – этот проигрыватель запускает запись сразу, как только загрузилась страничка.

Искусство оформления сайта. Практическое пособие i_023.jpg
Рис. 21. Вставка аудиофайла в Web Page Maker

Откроем код документа, чтобы исправить это недоразумение. Размещение аудиофайла задается тэгом ‹embed› (он же может использоваться и для видео, если только видеоролик не имеет формата AVI). Здесь мы увидим, что тэгу по умолчанию присвоен атрибут autostart= со значением true, хотя для наших целей нужно другое – false. Производим замену. Проверяем правильность написания кода, внося по ходу и другие необходимые поправки, чтобы в конечном итоге тэг принял вид:

‹embed src=“адрес папки с аудиофайлами/название файла” width=… (введите нужное значение) height=… (введите нужное значение) autostart=false›

Значения ширины и высоты рекомендую оставлять именно такими, какие предложил конструктор, поскольку они обычно наиболее удобны. Обратите внимание: на рисунке нетрудно заметить, что название файла записано русскими буквами – «Титаник». Прежде чем импортировать такой файл, переименуйте его, записав буквами латинского алфавита, причем пользуйтесь только строчными буквами: «titanik». Почему так, вы узнаете позднее, из п. 5.2.

Перейдем к фоновым звукам на сайте. К сожалению, они сильно раздражают, мешают работать, а иногда и просто пугают своей неожиданностью и резкостью. Вот почему применять их следует вдумчиво и очень осторожно. Если перед нами ресурс, посвященный какой-нибудь эстрадной певице, но на главной странице или в фотоальбоме можно разместить звуковой фон (например, на одном из сайтов про Бритни Спирс звучит песенка «Oops, I did it again»). Но в остальных случаях звуковой фон почти всегда неуместен. Впрочем, на моем ресурсе есть страничка релаксации – на тот случай, если гостям захочется чего-нибудь оригинального (http://busbook.narod.ru/relax.html). Ссылка, ведущая туда, предупреждает, что нужно предварительно включить колонки или встроенный динамик, чтобы насладиться музыкой природы. На страничке размещается гиф с анимированным изображением водопада, а звуковым фоном служит приятный звук падающей воды – слушай, смотри, медитируй.

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

Глава 4. Зрелищность сайта

4.1. Темы (фоновые рисунки)

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

Программки типа W.Y.S.I.W.Y.G. предлагают веб-программистам коллекцию шаблонов, готовых решений, включающих в себя разнообразные, подчас весьма оригинальные и продвинутые темы. Стоит ли пользоваться этими шаблонами? Скажем так: их нужно изучать и развивать. Даже поверхностное знакомство с сайтом «Образованные котята», построенном шутки ради на основе нашего ученического дизайна, покажет вам, что из шаблонов вырастают смелые и красивые идеи, весьма простые в исполнении. А самое главное: обилие деталей в веб-конструкторе способствует развитию обостренного восприятия дисгармонии. В процессе учебы нужно как можно чаще пользоваться готовыми темами, кнопками, иконками и т. д., комбинируя их и так и эдак, а потом критически изучая свое творение. Забракованные образцы подскажут, в каком направлении двигаться опасно, а это поспособствует отточенности вкуса и улучшению виртуальной сенсорики.

Проведем аналогию. Самообразование веб-дизайнера похоже на следствие пса Фу-фу из забавных детских детективов Е. Матюшкиной и Е. Оковитой, который разыскивал статую собаки с алмазными глазами. Если вы давно не читали своему ребенку сказок, то напомню, что эта статуя изготовлена из совершенно необычных материалов. У нее были:

1) глаз-алмаз, зубы золотые, нервы железные, шерсть шелковая;

2) голова чугунная, лоб медный, сердце каменное, мышцы стальные, ноги ватные;

3) уши-локаторы, нос по ветру, губа не дура, лапы загребущие, хвост пистолетом.

Я намеренно, чтобы не тратить впустую времени, разбил признаки на три разнокачественные группы. Если бы статуя № 3509 обладала качествами только первой или только третьей группы, то имела бы мало-мальски привлекательный вид благодаря оптимальному сочетанию признаков. Так, нос по ветру гармонирует с хвостом пистолетом, а глаз-алмаз – с золотыми зубами. Но смешанные вместе, вдобавок отягощенные медным лбом и прочими негативными качествами, эти признаки не слишком-то красили статую. Отчего Кролик, услышав описание собаки с алмазными глазами, недовольно хмыкнул: «Вот урод». Чтобы такого не говорили о вашем ресурсе, требуется выбирать качества из позитивных групп (первой или третьей), но только в строго сбалансированном отношении, не путая нервы железные с губой не дурой. А от негативных качеств из второй группы придется вовсе отказаться.

Веб-дизайнер не должен брезговать шаблонами уже хотя бы потому, что ему придется самому их конструировать. Создание собственной темы осуществляется посредством разных программных продуктов. Один из наиболее продвинутых, пользующийся успехом – это Adobe ImageStyler, как называется мощное средство унификации графики. Данное средство приспособлено для разработки и внедрения индивидуального стиля, который в дальнейшем послужит «лицом» сайта, то есть сделает ваш ресурс легко узнаваемым для каждого, единожды посетившего веб-узел. Программа позволяет избежать использования готовых библиотек деталей (навигационные кнопки, баннеры управления, обрамления).

Другой ценный «софт» – Xara Webstyle, программа обладающая набором готовых шаблонов под различные визуальные элементы веб-страницы, которые наделены высокой гибкостью и вариабельностью. Задача дизайнера при работе в Xara Webstyle состоит не в том, чтобы комбинировать готовые решения, а в том, чтобы изменять приглянувшийся макет до такой степени, когда возникает неповторимая индивидуальность стиля. Библиотека программы включает в себя баннеры, навигационные панели и меню, кнопки, фоны, логотипы, объемные заголовки, пульки, разделительные полосы. Xara Webstyle предполагает вариабельность стандартных настроек цвета, текстуры, сечения, тени, размера, шрифтов, начертания и прочих свойств объектов.

вернуться

15

Школьник Л. С., Тарасов Е. Ф. Язык улицы. – М.: Наука, 1977. С. 27.