При создании сайта любой разработчик задумывается, как будет выглядеть конечный продукт на разных устройствах: в мобильной и декстопной версиях.

Этот вопрос помогают урегулировать разные по гибкости типы вёрстки. Самые популярные — адаптивная и резиновая. Давайте разберём, чем же они отличаются.
⠀
Как вы уже могли заметить, подсказка содержится в самом названии. Резиновая вёрстка — это когда вы задаёте всему макету и отдельным его частям не фиксированную ширину, а эластичную — в процентах. За исключением минимальной и максимальной ширины. В результате при резиновой вёрстке веб-страница изменяет свои размеры в зависимости от ширины окна браузера. Получается, что весь контент растягивается по ширине экрана устройства. ⠀
Адаптивный дизайн позволяет гибко адаптировать сайт к возможности устройства и браузера. При адаптивной вёрстке страница перестраивается по заранее заданным точкам, адаптируя контент каждый раз к наиболее подходящей и ближайшей из них. Необходимость такой гибкости появилась с популяризацией мобильных устройств: экран на них значительно меньше, и пользователю, как минимум, стало неудобно попадать на ссылки и кнопки. ⠀
Наиболее продвинутым типом вёрстки сейчас является отзывчивая, которая умеет адекватно подстраиваться под разные устройства. Однако реализовать её сложнее, чем остальные.
О том, как верстать удобные для пользователя сайты, вы можете узнать на курсе «HTML и CSS. Адаптивная вёрстка и автоматизация», который стартует 9 ноября: https://tml.io/dah94