7 Ошибок, которые вам следует избегать при проектировании мобильной версии сайта

Posted on by riasevastopol

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

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

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

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

1) Не воспроизводимый контент

Гугл не приветствует применение не поддерживаемых форматов. Изображения, видео и контент смогут прекратить трудиться в силу многих событий, что в действительности очень не хорошо не только для пользователей, но и для мобильного сайта.7 Ошибок, которые вам следует избегать при проектировании мобильной версии сайта самый ярким примером есть применение flash-объектов на странице. Это разочаровывает и предоставляет нехорошей пользовательский опыт. Для разработчика принципиально важно убедиться, что на сайте нет не воспроизводимого контента.

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

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

  • Стандарты HTML5 возможно применять для анимации
  • Видео должно воспроизводиться на всех главных и запасных типах устройств.
  • Транскрипт видео неизменно должен быть дешёв.

2) Медленная загрузка страницы

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

Низкая производительность страницы кроме этого воздействует на покупательское поведение пользователей. Вот мало статистики:

  • 45% пользователей желают, дабы сайты загружались за 2-3 секунды.
  • 40% пользователей покидают сайт, что загружается более 3 секунд.
  • Всего одна лишняя секунда при загрузке сайта может уменьшить степень удовлетворенности пользователей приблизительно на 15%.
  • 44% пользователей постоянно рассказывают своим приятелям о собственном нехорошем UX.

Вот кое-какие инструменты, каковые смогут оказать помощь вам уменьшить время загрузки сайтов.

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

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

3) Неточность 404, появляющаяся лишь при просмотре с мобильного устройства

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

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

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

Разработчик может применять:

  • Webmaster Tools
  • Настройку сервера для перенаправления пользователей смартфонов на необходимый URL
  • Адаптивный дизайн сайта
  • Диагностику индексированных отчетах об неточностях в Webmaster Tools
  • Верно настроенное обнаружение пользовательского агента.

4) Заблокированный контент

Разработчикам принципиально важно обеспечить доступ Googlebot к JS и CSS файлам . В случае если подобный доступ отсутствует, то это скорее всего приведет к нехорошей индексации страницы. Файл robots.txt запрещает Googlebot сбор данных , что со своей стороны, оборачивается проблемой ранжирования и индексирования страницы.

Верстальщикам оптимальнеепредоставлять разблокированные JavaScript, CSS либо графические файлы. Таковой поисковик, как Гугл сам по себе есть прекрасной средством, разрешающим им выяснить, как Googlebot видит контент на сайте. Это оказывает помощь распознать те области, каковые нуждаются в улучшении.

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

5) Размер экрана устройства

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

Принципиально важно, дабы контент отображался подобающим образом на экране сотового телефона без необходимости лишний раз скроллить. В случае если к примеру, устройство, под которое разрабатывается сайт- iPhone 4 / 4s, то нужно располагать контент так, дабы он помещался на 3,5-дюймовом экране.

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

6) Через чур много текста на странице

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

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

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

Мобильные сайты должны смотреться бережно, а это вероятно лишь тогда, в то время, когда контент комфортно размещен и отформатирован.

7) Антисоциальный сайт

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

Разработчику направляться помещать на сайт кнопки соцсетей, таких как Facebook, Twitter, Гугл Plus, и т.д. Плавающие виджеты с указанными кнопками легко нужны, чтобы пользователям было комфортно твиттнуть контент, послать его по email, лайкнуть и т. п.

Последнее замечание

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

на данный момент самое время для них, поразмыслить об оптимизации мобильных сайтов, дабы избежать вероятных “наказаний” от Гугл

Высоких конверсий!

Случайные статьи:

6. Способы просмотра мобильной версии сайта на разных девайсах


Подборка похожих статей:

riasevastopol

More Posts