Найти в Дзене
Антон Серов

Вкратце о том, что такое адаптивная верстка сайта

Думаю тут следует начать с расшифровки понятия верстка. Если сказать просто, своими словами, верстка сайта - это работа программиста (верстальщика) по расположению основных элементов на странице сайта при помощи языка верстки html и CSS. С версткой сайта разобрались, а что же такое адаптивная верстка? Та же верстка, но с учётом особенностей отображения элементов сайта на разных устройствах. Под устройствами понимаются компьютеры, планшеты, мобильные телефоны.

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

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

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