8 марта 2012

Адаптивный или реагирующий веб-дизайн

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

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

У реагирующего дизайна есть две ключевые особенности, которые отличают его от остальных сайтов. Причем эти особенности скорее технического характера, нежели визуального. Во-первых, разрабатываемый сайт должен иметь гибкую структуру. Достигается это за счет создания HTML-каркаса, который содержит только информационную часть, такую как изображения и текст. Все оформление «выносится» в CSS-файлы. Во-вторых, все элементы на странице, например, изображения, должны быть опять же масштабируемыми, чтобы при изменении размеров страницы они не «залазили» на другие объекты.

Ниже мы подготовили 20 сайтов с реагирующим дизайном + еще 20 примеров вы найдете в статье «Адаптивный дизайн». В одном из следующих постов мы продолжим раскрывать эту тему и расскажем об инструментах, сервисах и способах создания адаптивных сайтов.