Резиновая верстка — 99 % wrong

Речь пойдет о верстке сайтов. А именно, о критике так называемой «резиновой» верстки. И да простит меня Якоб Нильсен за заголовок.

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

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

Основные тезисы против резиновой верстки

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

О допустимой ширине текста

Не обращали внимания, что в газетах никто не додумывается писать заметки на всю ширину полосы? (хотя, учитывая современное состояния верстки газет и уровень специального образования самих верстальщиков, пророчу возможное появление и такого). Существует правило, что ширина колонки текста, набранного 12-пунктовым кеглем, не должна превышать 45—50 символов (в зависимости от языка текста). При уменьшении размера шрифта это число еще сокращается.

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

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

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

На первый взгляд, пропорции при резиновой верстке сохранены: ведь пропорции колонок заданы в процентах, и этот процент не меняется при изменении ширины сайта.

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

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

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

Вы действительно думаете, что сайт этим законам неподвластен?

Нас воротит от 99 % сайтов. И из них 99 % — резиновые. Мы не хотим отворачиваться от сайтов своих клиентов.
Техническая сторона

Откровенно говоря, сверстать можно почти любой макет. Однако, ситуации технически сложной верстки — это борьба здравого смысла с туманными и недореализованными идеями горе-дизайнера. А понимая, что резиновый макет является компромиссом между модой 1997 года и необоснованным понятием крутизны «как у Лебедева», невозможно найти себе оправдание.
Плюсы резиновой верстки

Если удается решить описанные выше проблемы резиновости, то все остальное — в несомненном плюсе.

По личному опыту: борьба с проблемами «резиновости» резинового сайта отнимает очень много ресурсов и не всегда заканчивается успехом. Единственное удовлетворение — в том, что сделан еще один резиновый сайт. А достигнуто ли при этом выразительное или эстетическое совершенство?

Добавить комментарий


Защитный код
Обновить