Логотип imagecms

Как протестировать отображение сайта на других устройствах

Всего несколько лет назад одним из основных требований к верстке сайтов была кроссбраузерность, теперь же, одним из обязательных условий является еще и адаптивность. Суть адаптивной верстки сайта в изменении его отображения на экране, в зависимости от того, с какого устройства осуществляется просмотр – монитора настольного ПК или мобильного гаджета.

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

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

Всего через несколько секунд вы получите результат. По умолчанию используется разрешение экрана нетбука: 
 

Как видите, список доступных разрешений довольно большой, и покрывает большинство используемых на экранах настольных систем. Но даже это, далеко не все из доступных. Также, есть возможность протестировать отображение сайта на экранах планшетов, смартфонов и даже телевизоров: 
 

Дополнительно, можно просмотреть страницы в портретной или альбомной ориентации, с помощью кнопки «Rotate Screen», или же задать собственное разрешение, если нужного нет в списке. Для этого нужно нажать кнопку «Custom Screen Size» на панели инструментов Screenfly, и в появившемся меню установить требуемые значения:
 

Результатом работы сервиса можно поделиться с помощью кнопки «Share», что может пригодиться при совместной работе.

Сервис Screenfly совершенно бесплатный, и позволяет быстро протестировать отображение сайта не только на экранах наиболее популярных устройств, но и в случае надобности, установить собственные значения для тестирования.

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

Читайте также:
Подпишитесь на еженедельную рассылку и получайте скидки на популярные e-commerce продукты
И совсем скоро Вы станете гуру в e-commerce, веб-разработке, SEO и в интернет-маркетинге! Развивайте свой бизнес с актуальной информацией, успешными кейсами и вдохновляющими примерами.
Обсуждение этого поста (Комментарии: 2)
Вы должны , чтоб присоединиться к разговору
Давайте дружить!

Узнавайте все новости, получайте обзоры, кейсы
и другие полезные материалы по e-commerce через социальные сети!

  • Спасибо за информацию, этим сервисом еще не пользовалась. А как Вам ScreenQueries?

    Сохранить
    • Тоже интересный сервис, но более сложный на вид для новичка.

      Сохранить
Консультация по ImageCMS Shop
 
Уже уходите? Еще секундочку!

Зарегистрируйтесь, и вам навсегда обеспечены скидки на популярные
e-commerce продукты! Также мы будем делиться с вами самой ценной
информацией для развития вашего бизнеса.

или