Мобильная верстка сайта

Верстаем сайты
для телефонов

Если вы вдруг думаете делать ли мобильную версию сайта на поддомене вида m.site, то рекомендуем отказаться от этой мысли. Официальная рекомендация от Google гласит что это должнен быть один домен с десктопной и мобильной версткой.

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

Фиксированная

Та самая устаревшая верстка, когда ширина контена жестко задается на все устройства в пикселях. Обычно ее размер обусловлен разрешением самых распространенных экранов 800×600, 1024×768 и тд. Однако и по сей день можно встретить крупные сайты, мобильные пользователи которых чертыхаются.

Резиновая верстка

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

Чисто резиновая верстка является морально устаревшей, потому как срабатывает на один тип устройств, а на слишком больших или маленьких разрешениях не работает.

Адаптивная

Адаптив близок к респонсиву (о нем ниже) и работает на основе медиа-запросов, которые адаптируют контент под разные устройства и разрежения экранов. Пользователь не принимает участи в процессе, все на автомате.

Отличие от респонсива в том, что страница «скачет» по предустановленным шаблонам, подравнивая контент по точкам под параметры устройства и экрана.

Респонсив (отзывчивый)

Реализовать этот способ немного сложнее чем адаптив, так как по сути это микс между адаптивом и резиновой версткой. Подгрузка элементов в зависимости от ширины экрана и устройства изменяется постоянно. Таким образом каким бы ни было разрешение, респонсив всегда выглядит правильно, ведь верстка не «скачет» по контрольным точкам, а плавно перемещается по ним.

Что выбрать?

Респонсив — это самый трудозатратный вариант, стабильное решение, можно сказать «на века». На любых устройствах и мониторах будет выглядеть адекватно. Не нужно долго тестировать кроссбраузерность, чтобы убедиться, что везде выглядит все нормально. С появлением новых экранов ваш сайт будет правильно отображаться даже на них.

Но нужно иметь ввиду, что адаптив тоже хорошее решение в своей ситуации: его быстрее и дешевле сделать и если вам нужно всего лишь несколько основных разрешений и устройств, то это ваш вариант.

При адаптиве и респонсиве страницы сайта будут адекватно выглядеть на всех устройствах. Если же на адаптиве вы увидите несоответствие, то это легко поправить.

Заинтересовали наши услуги?

Принимаем заявки и общаемся с клиентами по телефону, электронной почте, через соцсети.

Если Вам удобно, отправьте заявку или Ваш вопрос на форму обратной связи.

SEO Раскрутка
сайтов

от 20 000р.
Узнать подробнее

Создание
сайтов

от 20 000р.
Узнать подробнее

Наполнение
сайта текстами

от 20 000р.
Узнать подробнее

Мобильные
приложения

от 20 000р.
Узнать подробнее

Продвижение
в соцсетях

от 20 000р.
Узнать подробнее

Создание
лендингов

от 20 000р.
Узнать подробнее

Аудит сайта

от 20 000р.
Узнать подробнее

Мобильная
вёрстка

от 20 000р.
Узнать подробнее

Принимаем заявки и общаемся с клиентами по телефону, электронной почте, через соцсети. 

Если Вам удобно, отправьте заявку или Ваш вопрос на форму обратной связи.

Отправьте Ваши данные, и мы свяжемся с Вами в ближайшее время.