GetInfo.Ru – Компьютерная библиотека
Последние поступления
Как выбрать систему управления базы данных
Базы данных03/09/14
Этапы загрузки UNIX (в схеме)
Unix27/03/12
Gatewall Antispam: тотальный контроль электронной почты
Спам21/04/11
Мастер-класс: создаем Интернет-магазин (Часть 1)
Обзоры ПО20/04/11
CorelDRAW Graphics Suite X5: Что нового?
Обзоры ПО20/07/10
Добавить статью
Самые читаемые материалы
Краткий обзор бесплатных "движков" (CMS) для сайта(26829)
Бизнес-планирование для Интернет-проекта(20673)
Обзор решений для тестирования сайтов(18664)
Составление сметы на сайт(17862)
Конструкторы сайтов: дешево и сердито(11030)
Всего статей: 793Всего авторов: 364Подразделов: 47Добавлено за сутки: 0
Статьи  СТАТЬИ Форум  ФОРУМ Рейтинг  РЕЙТИНГ Поиск  ПОИСК Контакты  КОНТАКТЫ
» Главная » Управление проектами » Жесткий, резиновый и...

Жесткий, резиновый и...


Макс Тимченко
http://www.zametki.org/

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

Начнём с определений:

Жёсткий дизайн — табличный дизайн, в котором величина каждой ячейки либо задана в пикселах, либо задаётся картинкой или другим элементом, помещённой в эту ячейку.

Резиновый дизайн - табличный дизайн, в котором ширина одной или нескольких ячеек задаётся в процентах от ширины окна.

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

С другой стороны, у жёсткого дизайна есть только одно оптимальное разрешение экрана. Если при разработке упор был сделан на совместимость (оптимальный размер 640х480), то уже на 1024х768 поля занимают почти половину ширины страницы - и чем дальше, тем хуже.

А если при разработке акцент был сделан на "среднее" разрешение (800х600), то у пользователей маленьких мониторов появляется горизонтальная полоса прокрутки, и часть содержания им становится не видна. Некоторые разработчики ориентировались по своему монитору (1024х768), и у них даже для 800х600 (а это почти 50% всех пользователей!) страница выглядит плохо — а для 640х480 обычно нечитабельна.

То есть при жёстком дизайне — куда не кинь, всюду клин. И тогда на спасение жёсткому дизайну приходит резиновый.

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

Есть и другая проблема. Броузерам (всем, но особенно Нетскейпу версии 4) очень тяжело переваривать ячейки переменной ширины. Каждому, кто писал совместимый HTML, знакомы ячейки шириной 100%, которые не занимают всю свободную площадь; ячейки фиксированной ширины, которые занимают больше, чем им положено; ячейки с заданной одинаковой шириной, но неизменно выходящие разной ширины и т.д. — перечислять фокусы каждого из броузеров можно очень долго.

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

Ещё одна деталь - чем сложнее дизайн и содержание, тем труднее избежать проблем со страницей. Пример такого сложного резинового дизайна — Narod.ru. И вот где виден резиновый дизайн:

640х480 1024x768 1280x1024 - меньше 50%
ширины экрана

Появляется много пустого, ничем не занятого места; в то же время, другие части страницы забиты текстом "под завязку" — отмечено на рис. 1, также по сторонам от рекламного баннера, рядом с фотографией ("Решаем проблемы...").

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

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

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

Но что делать, если есть желание сделать не спартанский текстовый дизайн, но чтобы он занимал максимум площади экрана? Жёсткий дизайн не подходит, резиновый - подходит слабо. Поэтому надо искать третий вариант — "блочный" дизайн.

 
03.02.2003
Версия для печати Версия для печати Запомнить ссылку Запомнить ссылку
Ваша оценка:  1   2   3   4   5     

 О проектеПерепечаткаАвторамПартнерыО нас пишут
Наверх
©2003—2007. GETINFO.RU. ВСЕ ПРАВА ЗАЩИЩЕНЫ.