The frame of reference

Как вы наверняка знаете из собствен­ного опыта, если веб-страница превышает по размеру окно броузера, ее содержимое придется промотать влево или вверх с помощью услужливо появляющихся в окне полос прокрутки (scrollbars, — иногда их называют еще «панелями прокрутки» или «движками»). Полосы эти не только нару­шают стилистическое единство дизайна, но и представляют собой эргономический нонсенс, мгновенно переводящий страницу из категории произведений искусства в кате­горию рутинных «объектов интерфейса». Люди не любят проматывать содержимое окна, особенно по горизонтали, и хороший веб-дизайнер никогда не заставит их делать это без большой необходимости. Прокрутки по вертикали избежать удается редко, но по крайней мере по ширине веб-страница должна быть такой, чтобы горизонтальная полоса прокрутки не появлялась даже при минимальной ширине окна броузера.

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

Общее число пикселов по горизонтали и вертикали обыч­но называют «разрешением» компьютерного экрана, хотя правильнее называть эту величину размером (ведь она из­меряется в пикселах, а не в пикселах на дюйм). Величина эта может различаться в разы — от 1600 на 1200 пикселов и выше в самых дорогих графических рабочих станциях до 640 на 480 у графического адаптера VGA, самого старого из все еще применяемых в IBM-совместимых компьютерах. Однако и это значение — 640 пикселов по горизонтали — еще нельзя принимать за искомый минимум: нужно учесть, что любое окно на экране компьютера имеет рамку и (почти всегда) вертикальную полосу прокрутки, а веб-страница в окне броузера окружена определенной величины полями. С учетом всех этих наслоений ширина страницы не должна превышать 600—610 пикселов, а если рассчитывать на поль­зователей со старыми моделями Макинтошей — то и еще меньше, около 580.

Заметки о полях

Упомянутые только что поля — это не поля, которые устанавливает вокруг содержимого страницы дизайнер, а те небольшие про­светы вдоль левой и верхней границ окна, которые оставляет сам броузер. Пользователь не может ни поместить что-либо в эту мертвую зону, ни повлиять на размеры полей средствами стандартного HTML. Еще хуже то, что величина этих полей непостоянна — она зависит от марки и версии броузера и от установленного в данный момент базового кегля шриф­та (стр. 216). Из-за этого возникают трудности с точным совмещением фонового изображения (стр. 259) и материала переднего плана — ведь броузер настилает фоновую картинку по всему пространству окна вплоть до рамки, вне зависимости от того, насколько отодвинуты от этой рамки текст и изображения переднего плана.

Оговорка относительно «стандартного HTML» не случайна — очевидно, поля эти были введены именно для того, чтобы размеченные в минима­листском, академическом (стр. 150) стиле тексты можно было читать, не стукаясь взглядом о вплотную прижатую к тексту рамку окна. Предоста­вляя со временем все больше оформительской свободы автору страницы, броузеры не могли обойти своим вниманием и этот аспект. Так, MSIE поддерживает атрибуты leftmargin и topmargin тега BODY, позволяющие

станавливать любую (в том числе нулевую и отрицательную) величину полей страницы. Однако и стандарт HTML 4.0, и броузер Netscape игно­рируют эти «MSIE-only» атрибуты.

Более идеологически правильный, хотя и выходящий за рамки HTML под­ход — использование CSS-свойств (стр. 40) margin-left и margin-top для тега BODY. К сожалению, упоминавшаяся уже незрелость реализаций CSS (стр. 23) не позволяет воспользоваться даже таким невинным трюком: дело в том, что если MSIE отмеряет поле от рамки окна, то NC принимает за отправную точку то «поле по умолчанию», которое имеет место в отсут­ствие CSS. Поэтому, чтобы прижать содержимое страницы вплотную к ле­вой рамке окна, в MSIE достаточно сказать <BODY style="margin-left: 0рх">, тогда как в NC вместо 0рх придется подбирать некую отрицатель­ную величину (около -7рх).

Желание обойтись без CSS заставляет некоторых дизайнеров прибе­гать к еще более замысловатому трюку. Пользуясь тем, что у тега FRAME есть поддерживаемые обоими броузерами атрибуты marginwidth и marginheight, они заключают всю страницу в единственный фрейм с тем, чтобы иметь возможность точно устанавливать величину полей.

Во первых строках

Итак, горизонтальная прокрутка должна быть исключена безусловно. Однако и прокрутка по вертикали тоже не доставляет пользователям большого удовольствия, и если ее невозможно избежать совсем, нужно по крайней мере сделать ее менее обязательной. Это значит, что основное содержимое страницы должно быть видно сразу после ее загрузки, т. е. должно находиться в первой же видимой порции страницы (по-английски этот прием называется «above the fold», т. е. «кверху от сгиба» — термин, заимствованный из дизайна газет, которые стараются верстать так, чтобы заголовки самых важных статей можно было прочесть, не разворачивая газету). К основному, всегда всплывающему на самый верх страни­цы содержимому относятся не только заголовок и начало основного текста, но и реклама (эффективность которой в начале страницы намного выше, чем в конце), а глав­ное — ссылки, как «россыпью», так и объединенные в навигационные панели. Щелчок по ссылке требует от пользователя меньшей затраты сил, чем перетаскивание движка в полосе прокрутки. Поэтому объемистые страницы иногда помещают вверху оглавление со ссылками на свои же, расположенные ниже, разделы, а возле каждого заго­ловка раздела ставят ссылку, позволяющую одним щелчком вернуться в самый верх (пример?).

К сожалению, иногда стремление к размещению материала «над сгибом» приводит к резкой неоднородности страницы по вертикали — качественная графика и тщательное пози­ционирование вверху сменяются ничем не оправданными

дырами и небрежно выполненной графикой ближе к под­ножию. Конечно, низ страницы не может быть так же информационно и графически насыщен, как ее «шапка», но в любом случае он должен быть сделан не менее аккуратно и без резких перепадов стиля.

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

У голубого экрана

Получившиеся минимальные габариты видимой ча­сти страницы — 580 на 350 пикселов — определяются разрешением экрана массовых персональных компьютеров PC и Макинтош. Однако недавно появилось еще одно устройство для доступа к сети — гибрид компьютера и телевизора под названием WebTV (www.webtv.net). Коробочка с мо­демом, процессором и зашитым в нестираемую память броузером, ценой около 200 долларов, позволяет путешествовать по сети, читая веб-страницы с экрана своего телевизора и выбирая ссылки при помощи пульта дистанци­онного управления (для ввода текста в поля бланков можно присоединить отдельно продающуюся клавиатуру).

Для дизайнера WebTV прежде всего интересен более жесткими ограничени­ями на формат страницы. Размер рабочей части экрана на всех устройствах этого типа один и тот же — 544 на 376 пикселов, и изменить его пользова­тель не может. А хуже всего то, что при более узком, чем у компьютерных броузеров, экране это устройство не позволяет прокручивать страницу по горизонтали — если что-то вылезет за правую границу экрана, оно так и останется недоступным. Очевидно, ограничения WebTV нет смысла учи­тывать в дизайне русскоязычных сайтов, так как в России эти устройства пока — экзотика. Среди западной аудитории, однако, пользователи WebTV составляют уже заметный и постоянно увеличивающийся процент.

Не нашли, что искали? Воспользуйтесь поиском: