Самые распространённые ошибки мобильных сайтов

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

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

О чём речь: я составил список из 10 проблем, которые мотивируют посетителя поскорее закрыть вкладку и забыть о вашем сайте, как о страшном сне. Ну и если я что-то пропустил, напишите в комментариях.

Переключение на обычную версию без спроса

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

Если вы делаете мобильную версию, доводите дело до конца. Я был очень удивлён, когда на одном из сайтов мне пришлось зарегистрироваться с мобильного и для этого меня переадресовали на версию для ПК. Стоит ли говорить, что число зарегистрировавшихся в данном случае будет стремиться к нулю?

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

Крошечные кнопки призыва к действию (Call To Action, CTA)

Многие владельцы магазинов уверены: чем крупнее и ярче оформлена кнопка «Купить», тем больше шансов на покупку. В чём-то они будут правы.

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

Нерабочая кнопка «назад»

Очень плохая идея делать сайты, на которых нажатие «назад» не возвращает на предыдущую страницу. Это правило действует не только для мобильных, но и для обычных форматов сайта. Запомните — кнопка возврата должна вести на страницу, которая была просмотрена предпоследней и никаких исключений.

Я видел примеры, когда нажимая «назад», я попадал на стартовую страницу, хотя просмотрел уже с десяток страниц. Я не знаю, что движет людьми, которые такое делают…

Попапы и всплывающие окна

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

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

Крошечные ссылки

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

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

Крошечные текстовые поля

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

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

Медленные сайты

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

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

Не забудьте оптимизировать графику и скрипты. Чем быстрее загрузится страница, тем больше шансов что-то через неё продать.

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

Бесполезные кнопки

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

Печальное зрелище — наблюдать красивую кнопку, которая не работает. Не забывайте проверить не только в стандартном бразуере, но и всех остальных: Opera Mini, Safari mobile, Chrome mobile, Firefox mobile.

Мёртвые интерактивные сайты

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

Нерабочее видео и звук

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

Вот только не показывайте посетителю зачёркнутый кружок с текстом «чтобы посмотреть видео, перейдите на обычную версию сайта».

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