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

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

787

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

 

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

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

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

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

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

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

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

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

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

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

Низкая производительность странички также влияет на покупательское поведение пользователей. Вот незначительно статистики:

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

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

  • Page Speed Online это веб-инструмент, который позволяет получать представление о высочайшей и низкой приоритетности исправлений. Он предоставит  вам не лишь инсайт о вашем сайте, но и улучшит скорость загрузки.
  • Плагин Google 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 либо графические файлы. Такой поисковик, как Google сам по для себя является чудесной средством, позволяющим им узнать, как Googlebot лицезреет контент на сайте. Это помогает выявить те области, которые нуждаются в улучшении. Применяя данный подход, также можно совладать с выявленными проблемами.

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

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

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

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

6) Слишком много текста на странице

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

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

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

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

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

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

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

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

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

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

www.webdesignmagazine.ru