Проверка адаптивности сайта

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

Использовать их очень легко:

  1. Переходите на сервис;
  2. Вводите адрес сайта, у которого хотите проверить адаптивность;
  3. Первоначально получите результат для экрана с разрешением 1024*768;
  4. Дальше можно экспериментировать. В шапке сайта имеется выпадающее меню, где можно выбрать интересующее вас устройство.

Инструменты для проверки адаптивности сайта.

Кратко опишу плюсы и минусы двух, на мой взгляд самых подходящих инструментов для проверки адаптивности:

1. Screenfly

проверить адаптивность

2. viewlike.us

проверка адаптивности сайта

Плюсы:

  • Интуитивное управление, хотя в плане инструментов и функционала я бы выделил 1-ый ресурс;
  • Поддерживают достаточное количество устройств

Минусы:

  • 2-ой ресурс имеет неудобное выпадающее меню и порой это вызывает трудности.

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

ПоделитьсяShare on Facebook0Share on VKShare on Google+0Tweet about this on TwitterShare on LinkedIn0Pin on Pinterest0

2 комментария

  • Олег:

    Здравствуйте.
    Ресурсы, которые вы описали утрачивают популярность, т.к. разработчики браузеров встраивают функционал проверки адаптивности сайта. По крайне мере это есть в mozile.

  • Настя:

    А я как раз их и использую для проверки адаптивности)

Добавить комментарий