Проверка
адаптива

Проверить
Помощь

Смартфон

320 × 480

Смартфон

360 × 640

Смартфон горизонтально

480 × 300

Мини-планшет

480 × 800

Мини-планшет горизонтально

800 × 480

Планшет

800 × 1280

Планшет горизонтально

1280 × 800

Что это такое?

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

Чтобы всё влезло, переведите браузер в полноэкранный режим клавишей F11.

Адаптивная вёрстка привязана к ширине устройства, и поэтому для адаптивных сайтов данный тест подходит лучше всего. Если у сайта есть мобильная версия, зависящая от платформы, здесь она не отобразится. Вместо этого загрузится полная версия сайта, и вы увидите, насколько она адаптирована к небольшим экранам.

Почему размер отличается от реального количеста пикселей?

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

Размер окна браузера

На  устройствах с ретино-подобными дисплеями показанные размеры будут отличаться от реального разрешения в пикселях, которое указано в спецификации устройства. Смартфоны покажут 320×480 или 480×800 пикселей, планшеты — 1280×800.

Таким образом, для разработчиков важны примерно 3 ключевых мобильных размера: 320, 480 и 800 точек в ширину. 1280 — это уже размер обычной PC-версии. Если остались вопросы, читайте подробнее в заметке про адаптивный дизайн.

© 2015