Как сделать сайт действительно удобным для мобильных устройств. Рекомендации Платона Щукина
Некоторое время назад Яндекс начал отмечать в мобильной выдаче страницы, оптимизированные для мобильных устройств, меткой «Мобильная версия», а также отдавать им предпочтение при ранжировании.
Платон Щукин опубликовал рекомендации, которые помогут вебмастерам сделать сайт действительно удобным для мобильных девайсов.
1. Какие бывают мобильные сайты
Поисковые роботы с одинаковым приоритетом воспринимают:
- сайты с мобильной версией на поддомене;
- сайты с адаптивной версткой;
- сайты с динамической версткой.
Платон советует обратить внимание на три нюанса:
- Не рекомендуется создавать мобильную версию сайта в отдельной папке (директории), так как робот может некорректно ее воспринять.
- Если вы остановились на варианте с поддоменом, выбирайте простое и понятное для пользователей доменное имя с явным указанием на мобильный сайт.
- При перенаправлении пользователей на мобильную версию важно, чтобы с десктопной версии страницы стоял редирект только на соответствующую страницу мобильной версии, а не на весь сайт.
2. Несколько слов о создании сайта
При создании мобильного сайта важно думать не только о технологической стороне вопроса, но и о контенте. Стоит размещать ту информацию, которая будет полезна именно для пользователей мобильного интернета.
После создания мобильной версии следует просмотреть ее с нескольких мобильных устройств и проверить, удобно ли с ней работать.
3. Как проверить сайт на мобилопригодность
Для проверки сайта можно воспользоваться инструментом в бета версии сервиса Яндекс.Вебмастер «Проверка мобильных страниц».
4. Что делать, если обнаружены ошибки
Самыми распространенными ошибками, которые позволяет выявить инструмент в Яндекс.Вебмастере, являются наличие горизонтальной прокрутки, много мелкого текста, отсутствие или неверное расположение мета (организация признана экстремистской, деятельность на территории РФ запрещена)-тега «viewport», а также наличие невоспроизводимого видео.
Горизонтальная прокрутка
Если при проверке сайта в Яндекс.Вебмастере выявлена горизонтальная прокрутка, возможно, ширина его страниц больше среднего.
Как правило, большинство пользователей использует смартфоны c разрешением 320 px, поэтому можно ориентироваться на эту величину. Также следует проверить отступы, встроенные картинки и логотипы – возможно, именно из-за них меняется итоговая ширина той или иной страницы.
Много мелкого текста
Если на сайте обнаружено много мелкого текста, то это также может быть следствием большой ширины страницы.
В данной ситуации необходимо либо увеличивать размер шрифта таким образом, чтобы после масштабирования он оставался читаемым, либо менять ширину страницы, приводя её к рекомендуемой.
Отсутствие мета (организация признана экстремистской, деятельность на территории РФ запрещена)-тега «viewport»
Мета (организация признана экстремистской, деятельность на территории РФ запрещена)-тег «viewport» позволяет браузеру мобильного устройства понять, что на сайте есть адаптивная верстка. Если выявлено, что на сайте отсутствует данный мета (организация признана экстремистской, деятельность на территории РФ запрещена)-тег, проверьте, что он расположен именно в контейнере head, что соответствует стандарту HTML.
Кроме того, желательно установить динамическую область просмотра в зависимости от ширины экрана устройства:
meta (организация признана экстремистской, деятельность на территории РФ запрещена) name="viewport" content="width=device-width, initial-scale=1"
Тогда не придется устанавливать фиксированную величину и удастся избежать горизонтальной прокрутки.
Наличие Flash-элементов
Если на сайте размещены видеоролики, убедитесь, что они корректно воспроизводятся с мобильных устройств и имеют формат HTML5. Большинство мобильных браузеров не воспринимает форматы Flash, Silverlight и Applet, поэтому лучше их не использовать.