Чтение онлайн

— К важным материалам желательно привлечь внимание посетителя, а маловажные скрыть. В этом могут помочь динамические элементы: раскрывающиеся при щелчке мышью абзацы, гиперссылки, выделяющиеся при наведении курсора мыши, и пр.

— Если Web-сайт посвящен музыке или видео, все это должно быть доступно для воспроизведения прямо на его Web-страницах, без загрузки.

— Одним словом — все для удобства посетителя! (Пожалуй, это правило следовало бы поставить в начале списка…)

Интернет грозится прийти на самые разные устройства с различными характеристиками: быстродействием процессора, объемом памяти, разрешением экрана, скоростью доступа к Сети. Но все они должны обеспечивать единообразный вывод Web-страниц. Как этого достигнуть?

Вот и третье правило — Web-дизайнеры должны заботиться о доступности страниц.

— Web-страницы следует делать как можно более компактными. Чем компактнее файл, тем быстрее он загружается по сети — это аксиома.

— Web-страницы не должны быть чересчур сложными. Чем сложнее Web- страница, тем больше времени и системных ресурсов требует ее обработка и вывод.

— Web-страницы не должны требовать для отображения никакого дополнительного программного обеспечения. В идеале для их вывода достаточно только Web- обозревателя.

Но как эти правила реализуются на практике? Давайте откроем какой-нибудь современный Web-сайт, например, принадлежащий организации W3C (рис. 1.1). Как мы помним, его можно найти по интернет-адресу http://www.w3.org.

Рис. 1.1. Главная Web-страница Web-сайта организации W3C

Что же мы здесь видим?

— Web-сайт создан с учетом всех современных интернет-стандартов. Он отображается во всех Web-обозревателях практически одинаково.

— Web-сайт не использует ни устаревших, ни закрытых интернет-технологий.

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

— Web-страница прекрасно читается. Тонкий шрифт без засечек, спокойная серо- голубая цветовая гамма, тонкие рамочки со скругленными углами, минимум графики — ничто не бросается в глаза.

— Есть даже видеоролик!

— Web-страница быстро загружается и мгновенно выводится на экран.

— Web-страница ничего не требует для своего вывода, кроме Web-обозревателя. Налицо и соблюдение стандартов, и наполнение, и доступность. Три из трех!

Именно такие Web-страницы мы и будем учиться создавать в данной книге.

Давайте еще раз обратимся к рассмотренным ранее правилам и немного расширим их.

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

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

— Web-страницы обязательно следует делать максимально доступными на любых устройствах. Web-страницы должны быстро загружаться и выводиться на экран. Также Web-страницы не должны требовать для отображения никакого дополнительного программного обеспечения.

Фактически здесь мы привели постулаты так называемой концепции Web 2.0. Это список правил, которым должен удовлетворять любой Web-сайт, претендующий на звание современного. Образно выражаясь, это флаг, который совместно несут труженики Web-индустрии, шагая в ногу со временем.

Также концепция Web 2.0 предусматривает четыре принципа, являющиеся "передним краем" Web-дизайна. Пока еще очень мало Web-сайтов им следует (и "домашний" Web-сайт W3C, увы, не исключение…). Рассмотрим их по порядку.

Принцип первый — разделение содержимого, представления и поведения Web- страницы. Здесь содержимое — это информация, которая выводится на Web- странице, представление описывает формат вывода этой информации, а поведение — реакцию Web-страницы или отдельных ее элементов на действия посетителя. Благодаря их разделению мы сможем править, скажем, содержимое, не затрагивая представление и поведение, или поручать создание содержимого, представления и поведения разным людям.

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

Принцип третий — генерируемое содержимое. Какая-то часть Web-страницы может не загружаться по сети, а генерироваться прямо на месте, в Web-обозревателе. Так мы еще сильнее сократим сетевой трафик.

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

В качестве примера Web-сайта, реализующего эти четыре принципа, можно привести Web-сайт — справочник по библиотеке Ext Core, расположенный по интернет-адресуи показанный на рис. 1.2.