Три способа адаптации сайта для мобильных устройств

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

Павел ШУДНЕВ

Для начала приведем сводную таблицу, в которой наглядно показаны плюсы и минусы каждого способа по мнению Google (источник тут):

Сравнительная таблица трех способов адаптации сайтов для мобильных устройств

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

Способ №1: разные URL

Возможно, у вас возник вопрос, что такое URL? Это адрес сайта, который вы можете посмотреть в адресной строке браузера. Например, URL главной страницы этого сайта – multipromotion.ru. Вы спросите: а разве могут у одного сайта быть разные адреса? Легко.

В данном случае Google говорит о мобильной версии сайта. Традиционно они начинаются с латинской буквы m с точкой. Т.е. если бы у этого сайта была мобильная версия, она бы, скорее всего, называлась m.multipromotion.ru. Как видите, это – multipromotion.ru и m.multipromotion.ru – разные URL-адреса.

Фактически, это два разных сайта. Именно поэтому в приведенной выше сравнительной таблице для данного метода указано, что для одного сайта используются разные URL-адреса и разный HTML-код. Для справки отметим, что мобильные версии сайтов стали первой реакцией рынка на развитие мобильных телефонов, и они увидели свет задолго до появления адаптивного дизайна (об этом ниже).

Способ №2: динамический показ

Не вдаваясь в технические дебри, скажем, что в рамках данного метода со стороны сервера (т.е. удаленного компьютера, на котором фактически расположен сайт) после получения ответа на вопрос «Ты кто?» отправляются разные URL-адреса сайта для разных устройств.

Т.е. если на (естественно, условный) вопрос сервера «Ты кто?» получен ответ «Я – мобильный телефон», сервер отправляет URL-1. На ответ «Я – ноутбук» будет отправлен URL-2, и так далее. Т.о. HTML-код сайта один, а URL-адреса разные (как и показано в таблице).

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

Способ №3: адаптивный дизайн

Собственно, данному способу посвящена уже не одна статья в данном блоге, поэтому ниже можно разве что повторить уже сказанное ранее. Адаптивный дизайн – это лучший на сегодня способ адаптации сайта для мобильных устройств. Он гарантирует максимально комфортное отображение сайта на любом устройстве.

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

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

Однако эти нюансы – тема для отдельной статьи. Задачей же этой статьи было кратко рассмотреть доступные на сегодня способы адаптации сайта для мобильных устройств, и сравнить их друг с другом. Выводы каждый может сделать для себя сам.