Сделайте свой сайт более удобным для мобильных устройств с помощью PageSpeed Insights

Понедельник, 19 мая 2014 г.

Чтобы помочь разработчикам и веб-мастерам сделать свои страницы удобными для мобильных устройств, мы недавно обновили PageSpeed Insights, добавив рекомендации по мобильному юзабилити.

Плохое юзабилити может свести на нет преимущества быстрой загрузки страниц. Мы знаем, что средняя мобильная страница
загружается более 7 секунд, и используя
инструмент PageSpeed Insights
и следуя его рекомендациям по скорости, вы можете сделать так, чтобы ваша страница
загружалась намного быстрее. Но предположим, что ваш быстрый мобильный сайт загружается всего за 2 секунды вместо 7. Если мобильным пользователям все равно приходится тратить еще 5 секунд после загрузки страницы на увеличение и прокрутку экрана, прежде чем они смогут начать читать текст и взаимодействовать со страницей, то в конечном итоге этот сайт не так уж и удобен в использовании. Новые правила пользовательского опыта PageSpeed Insights помогут вам найти и исправить эти проблемы с юзабилити.

Эти новые рекомендации в настоящее время охватывают следующие области:

• Настройте область просмотра (viewport) : Без тега meta-viewport современные мобильные браузеры будут считать, что ваш сайт не оптимизирован для мобильных устройств, и переключатся на десктопную область просмотра, возможно, применив увеличение шрифта, что нарушит предполагаемый макет вашей страницы.
  Настройка области просмотра
  на width=device-width должна стать вашим первым шагом к мобильной оптимизации сайта.
• Масштабируйте контент под область просмотра: Пользователи ожидают, что мобильные сайты прокручиваются вертикально, а не горизонтально. После настройки области просмотра убедитесь, что содержимое вашей страницы
  соответствует ширине этой области просмотра, помня о том, что не все мобильные устройства имеют одинаковую ширину.
• Используйте читаемые размеры шрифтов: Если пользователям приходится увеличивать масштаб только для того, чтобы прочитать текст статьи на экране смартфона, значит, ваш сайт не оптимизирован для мобильных устройств. PageSpeed Insights проверяет,
  достаточно ли велик текст вашего сайта
  , чтобы большинство пользователей могли читать его с комфортом.
• Настройте размеры интерактивных элементов (тап-целей): Нет ничего более разочаровывающего, чем пытаться нажать на кнопку или ссылку на сенсорном экране телефона или планшета и случайно попасть не туда, потому что подушечка вашего пальца намного больше курсора мыши на компьютере. Убедитесь, что
  тап-цели
  на сенсорном экране вашего мобильного сайта достаточно велики, чтобы по ним было легко нажимать.
• Избегайте плагинов: Большинство смартфонов не поддерживают Flash или другие плагины браузера, поэтому убедитесь, что ваш мобильный сайт
  не зависит от плагинов.

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

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

Опубликовано Мэтью Стили и Доантам Фан, команда PageSpeed Insights