Как адаптировать сайт под мобильные
Вы уже слышали про мобайл-фёрст алгоритм от Google? Вкратце: если раньше в ранжировании в первую очередь обращали внимание на основную версию сайта, то теперь – на мобильную. Имеется ввиду поиск с мобильных устройств. Так что если ваш сайт до сих пор не оптимизирован – бедаааа.
И эту беду я часто вижу, когда провожу аудиты сайтов. Сайт получает какой-то трафик, но весь он слит в трубу, потому что люди сразу закрывают страницу. Растет показатель отказов. Почему? потому что на странице ничего не разобрать – с мобильного она меленькая, по меню переходить неудобно, картинки не разглядеть. Представить страшно, сколько клиентов вы теряете, просто не оптимизировав сайт под мобильные.
Если же вы никак не можете начать оптимизацию, потому что не знаете, с чего начать, ловите несколько советов.
1. Помните о том, что у пользователя нет курсора мышки. Зато есть пальцы, которыми нужно нажимать на кнопки на сенсорном экране. Потому эти кнопки должны быть достаточно большими, чтобы по ним мог попасть каждый. Но при этом не настолько большими, чтобы закрывать на экране все остальное.
2. Интерфейс мобильно версии должен быть максимально простым. Лишние декоративные элементы будут только красть место (которого и так немного) и отвлекать внимание. Так что если дизайнер показал вам простой макет (на ваш взгляд — слишком простой), то он не ленивая *опа, а хочет как лучше.
3. Обратите внимание на адаптивный дизайн. Штука в чем: кто-то сидит с планшета, кто-то со смартфона. Тот же планшет или смартфон могут держать как вертикально, так и горизонтально. Верстка при этом не должна ломаться. Адаптивный дизайн быстро подстраивается под любой размер и любую ориентацию экрана.
4. Вам непременно придется что-то прятать. Скорее всего – меню. На маленьком экране классическое горизонтальное меню не просто не помещается – пользоваться им крайне неудобно. На выручку придет гамбургер-меню. Спрячьте все пункты под характерную иконку из трех линий – большинство пользователей уже знают, что это такое.
5. Обратите внимание на таблицы. О них часто забывают, но именно с ними больше всего проблем. Сделать так, чтобы они нормально отображались на маленьком экране, непросто. Возможно, визуально таблица не будет такой, как на десктопе. Возможно, есть смысл вообще ее скрыть – рассмотрите любые варианты.
6. Не бойтесь скрывать те виды контента, с которыми будет неудобно взаимодействовать на маленьком экране, или которые попросту на него не поместятся. Например, интерактивные карты.
7. Обратите внимание на скорость загрузки сайта именно на мобильных устройствах. Недопустимо, чтобы страница загружалась дольше 10 секунд. Никто не станет ждать столько. Стремитесь к результату 6 секунд и меньше.
8. Тестируйте и проверяйте. Старайтесь проверить отображение сайта на как можно большем количестве гаджетов. Ориентируйтесь на современные устройства. Устаревшими занимайтесь только тогда, когда существенная часть вашей ЦА – люди пенсионного возраста.
А твой сайт оптимизирован под мобильные? Нет проблем с загрузкой или отображением? Если не уверен, обращайся за SEO-аудитом. Если проблемы есть, я их обнаружу, и подскажу, как исправить.
seohead.pro
