Что такое адаптивный дизайн

Основная идея адаптивного веб-дизайна состоит в том, что сайт должен «реагировать» на устройство, на котором его просматривают. В более широком плане это может означать следующее:

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

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