Чем адаптивный дизайн отличается от «резинового»

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

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

Для смартфона или планшета страница адаптируется в более удобный для чтения и сенсорного управления вид. Также вёрстка может подстраиваться и под особенности операционной системы. В итоге получается красивая и удобная версия сайта на Full HD экранах, древних кинескопных мониторах, фаблетах и смартфонах. Прописываются в HTML и CSS коде дополнительные свойства – сам URL не изменяется (не путаем с отдельными мобильными версиями).

К недостаткам адаптивной вёрстки можно отнести сложность разработки.

Куда проще дела обстоят с резиновым (нефиксированным) макетом — в CSS-коде значения ширины прописаны в процентах, а, значит, страница тянется по ширине окна.

Если уменьшать мышкой размер окна браузера, можно наблюдать как все элементы "забéгают" от желания вместиться на странице. Гибкость резинового макета является плюсом, но имеется и серьёзный минус — потеря пропорций сайта при сильном сжатии/растяжении ширины. Это ведёт к смещению блоков и утрате читабельности.

Адаптивный и резиновый дизайны имеют право существовать в сети. Тянущиеся сайты подходят для сайтов-визиток, личных блогов, объявлений. Много “резиновых” дизайнерских решений имеется на сайтах www.artlebedev.ru или inbenefit.com.

Примерами адаптивной вёрстки являются www.theverge.com, а также www.latimes.com и др. К подобным макетам прибегают онлайн-журналы, соц. сети и другие сервисы, ориентированные на смартфоны.

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