В настоящее время устройства, с который посещают веб-ресурсы, различаются по размеру экрана, из-за чего просмотр сайта может быть неудобным в связи с особенностями размеров сайта:
Чтобы избежать вышеуказанных проблем, был разработан адаптивный дизайн (адаптивная верстка). Особенность данного дизайна заключается в том, что ширина сайта меняется в зависимости от разрешения экрана устройства: на мобильном устройстве сайт становится уже, а на широкоформатном экране шире. Реализация данной технологии требует дополнительной работы при верстке сайта, так как элементы должны грамотно расширяться или сужаться, при этом нередко применяются различный размер шрифтов, полностью меняется меню для мобильных устройств и т.д.
Особенностью адаптивной верстки является то, что в отличие от мобильной версии, сайт, как правило, остается в неизменном виде. Т.е. адаптивная верстка не предусматривает упрощение дизайна сайта для мобильных устройств, а только регулирует общую ширину сайта, за счет чего элементы сайта становятся больше, нет прокрутки ресурса по ширине даже на небольших устройствах. Разрешение, как правило, идет от 1002 пикселей до 1420 пикселей. Возможно расширение экрана до 1920 пикселей (HD-формат), но в этом случае ухудшается удобство пользования сайтом на широкоформатных экранах, так как читать информацию по всей ширине экрана крайне неудобно, как показывают современные исследования социалогических групп.
Адаптивный дизайн — это современное решение для веб-ресурсов любой направленности, начиная от Интернет-магазинов, заканчивая одностраничными сайтами (Landing Page). Грамотное применение данной технологии повышает юзабилити ресурса до 20%.