Насколько важен адаптивный веб-дизайн?

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

Вот некоторые подвопросы, которые у меня есть по этому поводу:

1. Лучше использовать адаптивный веб-дизайн, чем использовать отдельный код для разных измерений / устройств?

2. Может ли это потенциально повлиять на SEO (положительно или отрицательно)?

3. С какими основными проблемами я могу столкнуться при оптимизации веб-сайта для бизнеса с использованием этого метода дизайна?

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

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

По состоянию на май 2012 года адаптивный дизайн - рекомендуемая Google наилучшая отраслевая практика при разработке смартфонов. Одним из основных преимуществ является то, что вы работаете с одним сайтом: это один сайт для проектирования, создания, поддержки и продвижения. Это эффективно.

С точки зрения SEO, размещение отдельного мобильного сайта, например egmexample.com, означает, что вам нужно оптимизировать 2 отдельных сайта и разделить ценность вашего бизнеса (PageRank, авторитет и т. Д.) Между двумя местоположениями. Хотя вы можете избежать этого, предоставляя контент по одним и тем же URL-адресам посредством обнаружения пользовательского агента, это не решает проблему дублирования усилий (это все еще 2 отдельных сайта), а также создает дополнительные технические проблемы, например обеспечение вашего пользовательского агента. обнаружение работает и постоянно обновляется, что поисковые системы индексируют правильный контент в правильном индексе и т. д.

В целом, адаптивный дизайн - элегантное решение.

Чтобы ответить на другие ваши вопросы:

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

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

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

3. Я думаю, что основная проблема заключается в определении того, какой контент показывать мобильным пользователям. В зависимости от вашего сайта это может не быть проблемой, но во многих случаях это так. Главное здесь - понять, что пытаются делать ваши мобильные посетители. Например, кто-то на iPhone, вероятно, хочет получить быструю, легкую информацию или транзакции. Тот же человек на iPad, скорее всего, будет заинтересован в более неторопливом просмотре страниц.

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

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

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

2. SEO: нет. Как хорошо, так и плохо, как невосприимчивый макет.

3. Вы должны сделать немного больше планирования в начале. Какой контент должен отображаться на самом маленьком устройстве, каким должен быть порядок контента? Такие вещи. Или: мой контент выглядит хорошо во всех моих поддерживаемых измерениях? Возможно, вы также захотите оптимизировать размеры ваших изображений для каждого из измерений, чтобы получать не только изображения, масштабированные браузером, но и изображения с реальным размером. Если ваша CMS не поддерживает, это еще немного работы.

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

Редактировать:

Позвольте мне добавить, что если у вас есть исторические данные веб-аналитики (скажем, Google Analytics), вы можете легко узнать количество мобильных и не мобильных пользователей, определить используемые устройства (вплоть до фактического оборудования) и взглянуть на разрешение экрана. («Они действительно видят мои страницы или просто часть их и должны прокручивать?»).

Второе редактирование:

Согласно этому сообщению "Мобильные сайты против адаптивного дизайна: какое решение подходит для вашего бизнеса?" «В блоге Google Analytics сайт, созданный с учетом адаптивного дизайна, имеет следующие плюсы:

• Легкость обновления
• Оптимизирован для поисковых систем
• Добавление кодов конверсии и перенаправления

Плюсы отдельного мобильного сайта:

• Проектирование для потребностей мобильных пользователей
• Quicke создание сайта
• Отличные варианты DIY

Статья «Адаптивный дизайн - использование возможностей медиа-запросов» в официальном центральном блоге Google Webmaster дает хорошее представление о том, как на самом деле реализуется «Адаптивный дизайн».

«Создание сайтов, оптимизированных для мобильных устройств» в Google Developers гласит:

«Google рекомендует веб-мастерам следовать передовой отраслевой практике использования адаптивного веб-дизайна, а именно предоставлять один и тот же HTML для всех устройств [...]»

Я думаю, что важно сначала осознать, что «отзывчивый дизайн» (RD) - это модный термин (если я добавлю Width: 100% к элементу, у меня есть RD, чтобы преувеличивать), и поэтому его важность кажется более важной, чем она. на самом деле, как в конце концов, это условно, как и все остальное

Нужно ли внедрять RD?

Чтобы ответить на это, вам нужно сформулировать некоторые определения:

1. Кто ваша целевая аудитория
2. Какая аудитория ваша цель
3. Какова цель вашего сайта
4. Откуда ваш сайт будет доступен (в большинстве случаев)
5. и т.п.

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

Лучше использовать адаптивный веб-дизайн, чем использовать отдельный код для разных измерений / устройств?

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

Может ли это повлиять на SEO (положительно или отрицательно)?

SEO - это больше контент, чем дизайн. Только Google знает, весят ли они дизайн, но дизайн / верстка, но в целом, если ваш контент высокого качества, это будет весить больше, чем фактический дизайн.

С какими основными проблемами я могу столкнуться при оптимизации веб-сайта для бизнеса с использованием этого метода дизайна?

Дизайн для неправильной аудитории. Проанализируйте свою цель и предоставьте новейшие технические данные, если это возможно (например, журналы посещений, предоставляющие информацию о платформе и т. Д.)

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

Сделайте это как можно проще. Необычные веб-страницы ценны только в течение очень короткого времени, пока пользователь фактически не должен использовать вашу страницу. Если ему придется ждать 1/2 секунды, чтобы затухание заканчивалось при каждом щелчке, который он делает, пользователь будет довольно быстро потерян. Такие вещи.

Я просмотрел другие ответы, простите меня, если я избыточен ... Я занимаюсь адаптивным дизайном каждый день по 8+ часов в день на этом этапе ... Мои клиенты хотят этого, потому что они хотят, чтобы у мобильных пользователей был «уникальный» опыт, мои работодатели хотят этого, потому что он хвастается Google как предпочтительный метод и оптимизирует. (и если хвастаться Google как способ сделать что-то, скорее всего, лучше всего работать для SEO)

Лучше использовать адаптивный веб-дизайн, чем использовать отдельный код для разных измерений / устройств?

Я бы сказал, что лучше, да. Большая часть вашего кода - это тот же код, что приводит к меньшему количеству работы, чем написание приложения для iPhone, приложения для дроида, приложения для iPad, приложения для разжигания ... Вы понимаете.

Может ли это потенциально повлиять на SEO (положительно или отрицательно)?

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

С какими основными проблемами я могу столкнуться при оптимизации веб-сайта для бизнеса с использованием этого метода дизайна?

Поначалу это немного сложно сделать ... вам нужно провести некоторое исследование медиазапросов и, желательно, иметь несколько мобильных устройств для тестирования. Имейте в виду, изменение размера окна на рабочем столе близко, но то, как мобильные устройства отображают Интернет, иногда отличается от того, что вы ожидаете. Например, я разработал адаптивный сайт, где я использовал bg repeat для заголовка, а на рабочем столе он охватывает всю видимую область; однако на iOS это почему-то обрывается ...

Я рекомендую изучить и попробовать адаптивный дизайн. проверить этот сайт для начала работы: http://html5boilerplate.com

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

Адаптивный веб-дизайн имеет решающее значение - если вы создаете новый сайт, вы ДОЛЖНЫ сделать свой сайт отзывчивым. Уже сейчас 50% трафика приходится на мобильные устройства и планшеты, и не только это будет расти, но и станет явно доминирующей формой использования Интернета.

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

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

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

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

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

В наши дни главное в SEO - это «Качество сайта» - качество сайта сложно измерить, но в целом Google использует показатель отказов и время на сайте, чтобы измерить это. Если ваш сайт отстой на мобильном телефоне, у 50% вашего трафика будет высокий показатель отказов и большое количество посетителей с низким уровнем активности (менее 10 секунд на странице).

Это подвергает вас риску штрафов Google - посмотрите на Google Panda и новые (на прошлой неделе) штрафы Exact Match Domain , которые штрафуют сайты за «низкое качество».

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

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

Вот основы того, что вам нужно сделать:

1. Отрегулируйте отступы тела и поля
2. Вместо этого переместите меню влево или вправо в раскрывающиеся списки, возможно, спрячьте их под кнопкой параметров вверху.
3. Изменить размер контейнеров, использовать ширину 100%, где вы можете
4. Измените все ваши изображения на ширину 100%
5. Решите, какие вещи не нужны на телефоне (реклама?) И удалите их (дисплей: нет)

Вот пример кода:

@media screen and (max-width:480px) {
body {
margin:5px;
padding:0px;
}
.advertbox {
display:none;
}
}

То, что это делает, это удаляет что-либо с классом "Adboxbox" из смартфонов (с максимальной шириной 480 пикселей) и уменьшает запас тела.

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

Надеюсь, это поможет!

Я просто хотел бы присоединиться с другой точки зрения:

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

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

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

Вам нужно смотреть только на% пользователей на мобильных устройствах, на которые вы ориентируетесь. Особенно в приложениях B2B большинство людей не собираются смотреть на свои телефоны в свое свободное время. Вы получите трафик с понедельника по пятницу на настольных компьютерах.