В адаптивном веб-дизайне мы можем встретить несколько основных принципов, которые собственно и определяют структуру этой технологии.
Принцип №1 - адаптивный шаблон сайта. Это способность шаблона динамически настраиваться под различные дисплеи устройств (начиная от монитора обыкновенного ПК и заканчивая небольшим смартфоном);
Принцип №2 - адаптация и перемещение блоков контента. Это способность контентных блоков (в зависимости от дисплея вашего устройства) принимать нужные размеры, а также способность передвигаться на другую позицию в макете;
Принцип №3 - адаптация изображений. Это способность графического контента изменять свой размер в зависимости от дисплея технического устройства или загрузка более адаптированного изображения, но уже с меньшим весом и размером;
Принцип №4 - использование гибкой сетки. Данный принцип делает возможным максимально быстро изменять конструкцию макета;
Принцип №5 - скрытие менее важных блоков. Принцип, благодаря которому появляется технология сокрытия некоторых блоков на небольших экранах;
Принцип №6 - переработка юзабилити элементов навигации. Очень полезная технология. На современных гаджетах, в связи с их небольшим разрешением, навигационные функции превращаются в плохо контролируемый элемент. Но благодаря данному принципу появляется возможность их переработать, чтобы сделать эту функцию более удобной и комфортно используемой;
Принцип №7 - упрощение ряда элементов на веб — странице. Технология, при которой некоторые элементы веб-страницы упрощаются, чтобы появилась возможность для их использования на мобильных телефонах;
Принцип №8 - адаптация видео контента. Видеоролики уже давно стали неотъемлемой частью информации, поэтому данный принцип используется и для учёта адаптации видео;
Принцип №9 - использование медиа — запросов(media query). Принцип для создания адаптивного макета;
Принцип №10 - сначала мобильные устройства (mobile first). Разработка адаптивного веб – дизайна начинается с макета, который будет применяться на мобильных телефонах.
Последний принцип крайне важен, ведь разработку адаптивного веб-дизайна лучше начинать с разработки макета для небольших устройств.
