Почему Google любит адаптивный дизайн (и вы тоже должны)

  1. Адаптивные сайты привлекают больше ссылок на ключевые страницы
  2. Адаптивными сайтами легче делиться
  3. Адаптивные сайты могут быть проиндексированы
  4. Адаптивные сайты радуют читателей
  5. Адаптивные сайты работают на нескольких устройствах
  6. Адаптивные сайты (обычно) выглядят лучше
  7. Как мне начать?

Самое главное, Google определил один тип сайта в качестве предпочтительного решения:

Сайты, которые обслуживают все устройства по одному и тому же набору URL-адресов, причем каждый URL-адрес обслуживает один и тот же HTML-код для всех устройств и использует только CSS для изменения способа отображения страницы на устройстве. Это рекомендуемая конфигурация Google .

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

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

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

Адаптивные сайты привлекают больше ссылок на ключевые страницы

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

Например, на IGN я мог бы сослаться на:

Мобильный - http://m.uk.ign.com/articles/2012/06/07/e3-2012-ghost-recon-still-coming-to-wii-u

Рабочий стол - http://uk.ign.com/articles/2012/06/07/e3-2012-ghost-recon-still-coming-to-wii-u

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

Адаптивными сайтами легче делиться

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

Если я напишу ссылку на The Guardian, она будет выглядеть примерно так http://m.guardian.co.uk/ , который выглядит ужасно на ПК. Это не обнаруживает мое устройство или изменяет размер.

Это не обнаруживает мое устройство или изменяет размер

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

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

Адаптивные сайты могут быть проиндексированы

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

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

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

В дополнение к упрощению индексации, нужно быстро сканировать адаптивный веб-сайт, поскольку набор URL-адресов должен быть доступен только один раз для контента. Это так же, как если бы у вас был дублированный контент или канонические проблемы на обычном веб-сайте.

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

Как утверждает Google :

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

Если Google счастлив, то ваш рейтинг будет.

Адаптивные сайты радуют читателей

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

Это, вероятно, повлияет на время, которое я провожу на сайте, и увеличит показатель отказов - два фактора, которые Google может отследить, основываясь на моем возвращении в поисковую систему.

Я читаю Цифровой шпион на моем мобильном телефоне вместо Радио Таймс как это выглядит отлично. Кроме того, домашняя страница BBC News, например, не читается на iPhone без значительного увеличения.

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

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

Адаптивные сайты работают на нескольких устройствах

Многие сайты, которые утверждают, что они совместимы с мобильными устройствами, просто изменяют размер в зависимости от количества предварительно настроенных устройств. Так что, если Apple сделает свой iPhone 5 большего размера, то разработчик должен пойти и создать новый вариант. Это грязная и не перспективная стратегия.

По-настоящему отзывчивый дизайн будет масштабироваться в зависимости от размера окна.

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

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

Адаптивные сайты (обычно) выглядят лучше

Похоже, что в прошлом году многие веб-сайты увеличили свои основные изображения и возможности выбора, поэтому их проще выбирать на планшете. Например Игра а также Играть Раньше были красиво оформленные сайты.

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

Попробуйте Форк CMS веб-сайт, чтобы увидеть это в действии (перетащите размер окна, чтобы увидеть, как верхняя навигация меняется с текста на ПК на значки на планшете).

Как мне начать?

Я надеюсь, что это помогает понять, что адаптивный дизайн является жизненно важной частью будущего Интернета. это Smashing Magazine статья делает большую работу по объяснению основ адаптивного дизайна, чтобы вы могли начать и .сеть иметь полный набор инструментов, необходимых для разработки этих концепций.

Как мне начать?