Считаем ширину экранов у посетителей сайта

[Urvin]

Люди пересели на ноутбуки да большие дешевые экраны. нормуль.

[pluser]

Так какими в итоге были выбраны высота и ширина контента?

[shoorick]

О высоте мы не задумываемся — нас больше интересовала ширина. Получается, что я, как сторонник узких мониторов, был не совсем прав — доля широких экранов всё-таки достаточно высока. С другой стороны, диапазон 1024—1600 охватывает почти 80 процентов аудитории, то есть, можно ориентироваться на 1600, как максимальную ширину из числа распространённых.

[pluser]

Высота тоже важный момент, очень часто народ пишет, мол а где цены? А они ниже на пол прокрутки.
Выясняется что некоторым не очевидно что внизу что-то есть потому как высота их экрана такая что пробел контента внизу выглядит как конец.

[signalizator]

Все больше становится необходим адаптивный дизайн.

[shoorick]

Это-то понятно. Адаптивный дизайн мы с недавних пор применяем. Другое дело, что media queries у нас в сайте, о котором мы дискутировали с дизайнером, прописаны для максимальных значений ширины 1080, 1020, 880, 770 и 480 точек — где-то меняется размер всего одного элемента, а где-то и весь сайт меняет облик. Просто конкретно в этом случае надо будет предусмотреть отображение сайта на очень больших мониторах и в будущем тоже его учитывать.

[anor]

Адаптивый дизайн вам в помощь)

[shoorick]

Ужé. А теперь ещё и знаем, на каких размерах его тестировать.

[pewpew]

В сухом остатке, получается, нужно делать 3 вёрстки (в порядке приоритетности):

• стандартная (1024-1366)
• мобильная (480)
• широкая (1600)

Всё свелось к этому?

[whiteTigr]

У меня на широком мониторе браузер занимает примерно 2/3 ширины экрана (максимальная ширина страницы хабра + еще чуть-чуть, около 1200 пикселей в абсолютном выражении). Если развернуть браузер во весь экран, то становится неудобно читать кучу сайтов — текст расползается.

[shoorick]

Вот! Вот я то же самое и говорил дизайнеру: слишком широкое окно посетитель может уменьшить, в вот узкий экран растянуть — не может.

Я сам и дома и на работе сижу за мониторами шириной 1280, в телефоне — 480×800.

А вы на каком расстоянии от монитора сидите?

[whiteTigr]

На расстоянии «вытянутой руки». Около 0.5 — 0.6 метров.

[shoorick]

вытянул руку, измерил линейкой) У меня чуть больше — почти метр. А если за ноутбуком — сантиметров 40–50.

[shoorick]

Меня интересовали ответы на вопросы типа «Какова доля посетителей с экраном ýже/шире заданного значения» — мой график на эти вопросы отвечает. Впрочем мне кажется, если бы я провёл через значения гладкую линию (кажется, это называли построением тренда в одной из экономических дисциплин, что нам читали) — было бы чуть нагляднее: наибольшая популярность была бы там, где больше угол наклона.

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

[shoorick]

Правда, в таком графике у меня не сгруппированы близкие значения (1360, 1366 и 1440, 1600 и 1680).

[DimaLondon]

Статистику по популярным расширениям можно посмотреть и по статистике вконтакте
www.liveinternet.ru/stat/vkontakte.ru/resolutions.html

Но то, что разрешения мониторов пользователей сети постоянно уменьшается — это нужно предвидеть. Зависит это в основном от двух факторов:
1) рынок насыщается дешевыми мощными ноутбуками, стандартный размер мониторов которых 15"-17".
2) люди сталь активно юзать смартфоны, яблокофоны, планшеты…

Считаю, что для первого случая необходимо учитывать ширину экрана не более 700-900 пикселей (для нормального отображения контента на мониторе в 14").

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

Но это сугубо мое мнение.

[alcanoid]

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

[citrin]

А почему на www.liveinternet.ru/stat/vkontakte.ru/resolutions.html так много (23%) посетителей, для которых не определено разрешение?

[pred8or]

Считая только расширения экрана, вы теряете массу информации. В дополнение к этому я обычно считал (в прошедшем времени, т.к. последние пару лет несколько переквалифицировался) размеры окна браузера, а также размеры клиентской области.

Все три параметра в сочетании давали массу пищи для размышлений.

Ну и графики неправильные. Надо ширину — по горизонтали, высоту — по вертикали, а размер и густота пятна на пересечении будут показывать популярность того или иного размера. При этом отдельные точки (особенно в случае размера клиентской области) естественным образом кластеризуются.

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

[note]

Как уже заметил pred8or, считать следует не только разрешения экранов пользователей.
Информации только по разрешениям недостаточно, чтобы делать полноценные выводы о размере области экрана, в которой отобразится ваша страница у пользователя.
habrahabr.ru/company/mailru/blog/142193/ — здесь чуть подробней описан ход мыслей и результаты похожих подсчетов на нашем проекте.

[corpor]

А почему не учесть оба варианта?! Допустим, для широких мониторов будут поля по бокам, а для квадратных — этих полей не будет. Сам делал. Работает. Скрипт весьма простой!

[mr_jok]

разговоры о разрешении экрана без учёта устройства доступа смысла не имееют