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

Сегодня можно встретить шесть типов верстки:

  1. Фиксированная;
  2. Резиновая;
  3. Табличная (верстка таблицами);
  4. Блочная (div-верстка);
  5. Адаптивная;
  6. Flex-верстка.

Краткий обзор всех типов верстки

  1. При фиксированном варианте размеры всех элементов страницы задаются фиксированными значениями. Страница будет выглядеть одинаково на всех экранах всех устройств. Его удобнее и быстрее всего было создать на заре развития интернета, когда удобных инструментов не было, как и не было толкового представления об удобстве пользования веб-сайтами ввиду отсутствия времени на наблюдения.
  2. При резиновой верстке всегда разворачиваются на всю ширину окна браузера, вне зависимости от размеров. Имеет немного преимуществ перед предыдущим вариантом, появилась ненамного позже. Также рассчитана на ограниченный диапазон размеров экранов.
  3. Табличная верстка в совсем недавнем времени являлась самой популярной. Обеспечивала удобство создания структуры сайта и приемлемое качество отображения. Поисковики не «любят», когда структура самой страницы создана таблицами.
  4. Верстка div-блоками: самая популярная верстка на данный момент. Она больше нравится поисковикам, нежели предыдущая, а «любовь» поисковиков очень важна для продвижения любого сайта. Каждый может в этом убедиться, зайдя на любимый сайт и вызвав его исходных код или меню разработчика — скорее всего, на нем структура будет сформирована множеством элементов и с заданными классами.
  5. Адаптивная верстка. По сути, это та же блочная, только адекватно отображающаяся на всех типах устройств. Она может «выкидывать» лишние блоки, не помещающиеся на маленьких экранах мобильных устройств, при их вертикальном размещении. Она добавляет дополнительные блоки по бокам от основного контента, если ширина экрана позволяет.
  6. Гибкая верстка — достаточно новый вид, ему дал жизнь стандарт таблиц стилей CSS3. Крайне перспективный, сайты будущего будут построены на нем..

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