Некоторые правила адаптации веб-сайтов к разным разрешениям экранов:

• Гибкость элементов. 1 Шрифты, изображения и другие элементы сайта подстраиваются под разрешение и размер экрана. 1 В зависимости от удобства восприятия и задумки дизайнера они могут делаться меньше или больше или сохранять размер. 1
• Соблюдение порядка элементов. 1 Если в десктопной версии элементы могут располагаться по горизонтали в несколько колонок, то на узком экране мобильных устройств они смещаются вниз и выстраиваются в одну-две колонки. 1 При этом HTML-разметка должна сохранять их иерархию. 1
• Единый стиль дизайна сайта в разных версиях. 1 Это подразумевает использование одной и той же цветовой гаммы, шрифтов, форм, логотипов и прочих элементов в мобильных и десктопных CSS-стилях. 1
• Единый контент и функционал. 1 Всё, что есть на сайте при просмотре с компьютера, должно быть доступно и с телефона. 1 Если в мобильной версии какая-то страница получается слишком длинной, при вёрстке её можно разбить на несколько или спрятать часть содержимого под кнопками. 1
• Оптимизация размеров изображений. 2 Картинки должны быть хорошо видны. 2 В некоторых случаях вместо полного изображения лучше отобразить его увеличенный фрагмент. 2
• Минимизация второстепенного контента. 2 Если на сайте много информации, то возможно стоит скрыть некоторые блоки на мобильной версии, чтобы не отвлекать внимание пользователя на несущественные детали. 2
• Минимум всплывающих окон. 2 На мобильной версии желательно отключить попапы или по крайней мере избегать окон на весь экран, так как полное перекрывание контента может раздражать пользователей. 2
• Отключение лишних эффектов. 2 Некоторые эффекты, распространённые в десктопных версиях, не будут работать на мобильных устройствах, например, эффекты при наведении. 2 Их лучше отключить в мобильных версиях сайта. 2
• Оптимизация форм подписки. 2 На мобильных телефонах поля форм подписки должны быть растянуты на всю ширину экрана. 2 Желательно, чтобы форма была не очень длинной, так как заполнять большое количество полей на телефоне будет сложно. 2