Сравнение фиксированной и «резиновой» верстки ("Резина" VS "Статика")

Сравнение фиксированной и «резиновой» верстки

Добрый день всем!

Дизайн – очень важный элемент для любого «уважающего» себя сайта. Ведь, как говорится – «встречают по одежке…». А он - и есть облик любого Интернет-проекта. В зависимости от типов проектов (блоги, сайты-визитки, Интернет-магазины), могут и разниться типы дизайнов для них.




Когда, в процессе создания Интернет-проекта становится вопрос о его «облике», то их создатели идут двумя путями:

• Воруют чей-то готовый дизайн. Это могут быть как готовые шаблоны для различных CMS (типа Битрикс, Joomla или Wordpress), или прямое воровство уникального html-макета с другого сайта с последующей его «натяжкой». В любом случае, брать чужое нехорошо. Но здесь все зависит от уровня и серьезности проекта. Если это личный блог, и взят паблик шаблон – то ничего страшного не произойдет. Ну а если дизайн уникальный и проект серьезный – то это, по меньшей мере, некрасиво.

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

Но в процессе выбора и создания дизайна сталкивается с проблемой выбора его типа: фиксированного или так называемого «резинового» дизайнов. И вот в сегодняшней статье я бы хотел сравнить фиксированную и резиновую верстку: выделить «сильные» и слабые стороны» обеих подходов.




Фиксированный дизайн

Этот типа дизайны появился первым, когда расширение мониторов было мало, а видов этих расширений было еще меньше. С точки зрения дизайна, это означает следующее: сайт, верстка которого «фиксированная» будет выглядеть одинаково для любого типа монитора (его разрешения всмысле): хоть с шириной в 500 пикселей, хоть в 5000

Плюсы фиксированной верски:

• Простота создания. Так как он появился первым, то и создавать фиксированные макеты проще, чем «резиновые» во всех отношениях. Выбирая его, Вы можете сократить время, и средства, затраченные на создание дизайна.

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

Минусы:

• Неудобство для мобильных устройств. Дело в том, что для пользователей, зашедших на Ваш сайт с мобильных устройств, будет появляться такая нежелательная вещь, как горизонтальная полоса прокрутки. Что, согласитесь, очень неудобно. Но в этом случае, у Вас есть 2 варианта: либо отказаться от мобильного сегмента пользователей, либо специально для них, создать мобильную версию своего проекта, что тоже очень и очень распространенно.

• На мониторах с большим разрешением «узкий» сайт будет смотреться достаточно бедно и скудно. Если разрешение экрана достаточно велико, то пользователь будет видеть узкий сайт посредине. Такое может понравиться далеко не каждому. Радует, что таких экранов еще не столь много.

Это что касается плюсов и минусов фиксированного дизайна. Перейдем к резиновому

«Резиновый» дизайн


Этот тип верстки в некотором смысле противоположный фиксированному. Тоесть в идеале он должен смотреться при любом разрешении одинаково. Но это «в идеале». На практике эти вещи получается реализовать далеко не всегда…

Резиновая верстка применяется для проектов, цель которых – показать как можно более информации. Это порталы, сообщества, Интернет-магазины и т.д.

Плюсы такого подхода к реализации дизайна:

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

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

Минусы «резинового дизайна»

• Сложность при создании и верстке. Дело в том, что, несмотря на все плюсы такого подхода, у резиновой верстки есть такое понятие, как «минимальное разрешение». И это применимо ко всем элементам дизайна. И если у создателя «кривые руки», то дизайн при разных разрешениях монитора будет «сьежаться», или «разьежаться» по-разному, что, согласитесь, не очень удобно для конечного пользователя. Тоесть «просчитать» эти моменты иногда не совсем просто.

• При маленьких разрешениях монитора дизайн будет «разваливаться». Как я уже сказал в предыдущем пункте, существует такое понятие, как «минимально разрешение». А это значит следующее: если размер монитора, просматриваемого сайт будет меньше минимального, то дизайн просто «расползется». Тоесть баннеры и картинки будут залазить друг на друга, текст станет сжиматься – короче говоря это будет не сайт а черт знает что! И хорошо, если создатель установил минимальную ширину меньше, чем 800 на 600 А если больше: 1024 на 768 например

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




Итог

Какой дизайн выбирать: статичный, или «резиновый» выбирать Вам. Но я бы советовал выбирать тот, или иной тип в зависимости от практической надобности, а не своего желания (тем более, если Вы – ноль в верстке, и собираетесь заказывать эти вещи). А именно: для больших проектов, «резиновость» дизайна которых будет лишь улучшать функционал – стоит попробовать. Если же проект простенький, то есть ли смысл тратить время, силы и деньги, а?!

------------------------
Автор: Dimoni4e
Авторские права на статью принадлежат mmgp.ru

Свой первый сайт я решил делать в резиновой верстке самостоятельно. Да, я согласен с тем, что это довольно трудноемкий процесс. Постоянно возникают трудности с размещением объектов, кроссбраузерностью, решение которых приходит не сразу. Но зато результат оправдывает все мучения. Проверял свой сайт на разрешениях от 800 : 600 до 1280 : 1024, все в норме. Дальше 1280 px он не растягивается т.к. стоит CSS ограничение max-width.

Так что я за резиновый сайт, но как упомянул Dimoni4e, если этого требует особенность создаваемого проекта.

Есть желание попробовать и в фиксированной верстке.

Хотя это уже и отходящая вещь...

Солидные сайты почти все с резиновой версткой. В-принципе на хороших сайтах стоит ее делать.

Однозначно писать в процентах!!! Нынче в сеть все выходят кто откуда. Причем, лучше сразу не только под разные разрешения мониторов писать, но и учитывать все ту же оперу-мини))

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