Блочная вёрстка и адаптивная отличаются подходом к созданию структуры веб-страницы. 14
Блочная вёрстка предполагает использование блоков (div-элементов) для создания структуры страницы. 1 Каждая часть сайта помещается в отдельный блок: первый экран, текст о компании, контакты, боковая панель, основной контент и другие. 2 Затем в CSS задаются размеры ширины блоков, после чего размещается контент. 4 Преимущество такого подхода — гибкость, сайт соответствует требованиям любых браузеров. 4
Адаптивная вёрстка — это дальнейшее развитие блочной вёрстки. 4 Она автоматически подстраивается под размеры экрана. 4 Блокам задают не фиксированную ширину, а ширину в процентах и диапазонах от ширины экрана. 4 Если блоку явно не хватает размера — он перемещается под мешающийся блок или размещается над ним. 4 Адаптивная вёрстка позволяет отсеивать все необязательные элементы: изображения, графику, основное меню и другие объекты. 3 Пользователь видит перед собой только наиболее значимые блоки, в которых содержится ключевая информация. 3
Таким образом, блочная вёрстка фокусируется на фиксированном расположении элементов, а адаптивная — на их автоматической адаптации под разные устройства и экраны.