Количество пользователей смартфонов и планшетов в России неуклонно растет. Сегодня уже сформировалась целая категория пользователей, которые в 90% случаев выходят в интернет через мобильные устройства. Под таких пользователей подстраиваются не только владельцы сайтов, но и поисковики: Google в конце апреля даже ввел новый алгоритм мобильного поиска, в результате которого сайты, не адаптированные под смартфоны и планшеты, не показываются в органической выдаче.

Подробнее о том, как адаптировать сайт под мобильные устройства, вы можете узнать из видеозаписи вебинара специалиста по качеству поиска Google Андрея Липатцева, а также из материалов наших рассылок: «Сайт, удобный для мобильных пользователей», «Техники мобильной адаптации сайта» и «SEO для мобильных сайтов».

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

Принцип первый: Flash-элементы

noflash

Не используйте Flash элементов в дизайне сайтов для мобильных. Далеко не все мобильные устройства поддерживают Flash, а значит, пользователи смартфонов и планшетов просто-напросто ничего не увидят на вашем сайте. Эта ошибка ведет к увеличению показателя отказов, что негативно влияет на поведенческие факторы ранжирования сайта в целом. Если вы хотите сохранить визуальный эффект, достигаемый с помощью Flash, то рекомендуем использовать JavaScript, который хорошо работает на всех типах устройств. Если же ваш сайт целиком построен на Flash, то для мобильных устройств необходимо сделать его html версию.

Принцип второй: многоступенчатое меню

mnogo-menu

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

Принцип третий: онлайн-формы

register-form

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

Принцип четвертый: разрешение экрана

smartphone-screen-size

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

Вот данные по разрешению экранов некоторых популярных моделей смартфонов и планшетов:

    • Apple iPad (планшет): 1024 х 768 пикселей;
    • Apple iPad 2 (планшет): 1024 х 768 пикселей;
    • Apple iPad 3 (планшет): 2048 х 1536 пикселей;
    • Apple iPhone 3 (смартфон): 480 х 320 пикселей;
    • Apple iPhone 4S (смартфон): 960 х 640 пикселей;
    • Apple iPhone 5S (смартфон): 11360 х 640 пикселей;
    • Apple iPhone 6 (смартфон): 1334 х 750 пикселей;
    • Asus Transformer TF101 (планшет): 1280 х 800 пикселей;
    • Asus Transformer Prime TF201 (планшет): 1280 х 800 пикселей;
    • HTC Amaze 4G (смартфон): 960 х 540 пикселей;
    • HTC Evo 3D (смартфон): 960 х 540 пикселей;
    • HTC Flyer (планшет): 1024 х 600 пикселей;
    • HTC Sensation 4G (смартфон): 960 х 540 пикселей;
    • HTC Thunderbolt (смартфон): 480 х 800 пикселей;
    • Lenovo IdeaPad A1 (планшет): 1024 х 600 пикселей;
    • Lenovo ThinkPad (планшет): 1280 х 800 пикселей;
    • Samsung Galaxy S2 (смартфон): 800 х 480 пикселей;
    • Samsung Galaxy S3 (смартфон): 1280 х 720 пикселей;
    • Samsung Galaxy S5 (смартфон): 1920 х 1080 пикселей;
    • Samsung Galaxy S6 (смартфон): 2560 х 1440 пикселей;
    • Samsung Galaxy Tab S 8.4″ (планшет): 2560 х 1600 пикселей;
    • Samsung Galaxy Tab S 10.5″ (планшет): 2560 х 1600 пикселей.

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

Принцип пятый: скорость загрузки

Site-speed

Речь пойдет о скорости загрузки. Сайт на мобильных устройствах должен грузиться мгновенно. Иначе пользователь просто его закроет. Если на PC пользователи готовы долго ждать загрузки сайта, то на мобильных устройствах они ждут от 3 до 5 секунд и без раздумий закрывают сайт, который никак не хочет открываться.

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

Еще раз напоминаем, что наличие мобильной версии сайта обеспечивает вам качественный трафик из мобильной выдачи поисковиков. Нет мобильной версии – нет мобильного трафика. Помните это.

⌃ ↩

Вот сами бы и создали бы сначала на seopult мобильную версию, а то очень неудобно читать с мобильного)

0

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

0
Галина Дорофеева

За табличку спасибо. Но Яндекс.Вебмастер все, что крупнее 320 уже не считает адаптированным

0

Сама бы я это не сделала))

0
Профессиональный инструмент
для создания продающих виджетов
Вы выбираете площадки для рекламы
Повышение продаж с
сайта в 2 клика

Настоящий сервис собирает информацию, зарегистрированную в файлах «cookies» для целей адаптации функционала сервиса к потребностям пользователей, в целях сбора статистической информации для анализа и улучшения качества работы сервиса, а также в рекламных целях. При использовании данного сервиса, вы подтверждаете свое согласие на использование файлов «cookies». Файлы «cookies» будут сохранены в памяти вашего устройства (ЭВМ). Вы можете изменить настройки файлов «cookies» в вашем браузере, однако такие изменения могут повлиять на функциональность сервиса и ограничить его использование.

Настоящим Я даю свое полное согласие на получение электронных уведомлений (на указанные мой абонентский номер и адрес электронной почты), а также выражаю явное и полное согласие на сбор, хранение, обработку и передачу персональных данных, согласно положениям, изложенным в Политике конфиденциальности, расположенных по адресу: promopult.ru/rules.html?op=private, с которыми я ознакомился и принял.