Какова лучшая абсолютная ширина для веб-страницы?
Предполагая, что гибкий макет не является вариантом (поскольку это совсем другое обсуждение), какова рекомендуемая ширина для макета сайта? Какие плюсы и минусы разных размеров?
10 ответов
Я всегда держал с 960px как это видно на 1024x768и чисто делится на 2, 3, 4, 5, 6, 8, 10, 12, 15, 16, 20, 24, 30, 32, 40, 48, 60, 64, 80, 96, 120, 160, 192, 240, 320 и 480... так что я могу аккуратно разделить дизайн моего сайта (используя правило третей).
РЕДАКТИРОВАТЬ через несколько лет: рассмотрите возможность использования CSS Media Queries, чтобы ваш контент реагировал на множество устройств, если вы не можете использовать гибкий макет. Я не уверен, что можно требовать ширину в один пиксель, чтобы управлять ими в 2012 году.
Проверьте http://browsersize.com/ для некоторых быстрых статистических данных о разрешениях экрана, которые пользователи используют в настоящее время. Вы можете использовать http://setmy.browsersize.com/ чтобы быстро изменить размер своего браузера, чтобы эмулировать просмотр вашего веб-сайта с определенным разрешением экрана. Убедитесь, что ваш макет соответствует как минимум наиболее широко используемому разрешению экрана (1024 x 768).
Кроме того, не обязательно стремиться занять максимальное горизонтальное пространство. Ширина текста (количество слов в строке) в идеале не должна превышать определенного порога для удобства использования:
При очень распространенном разрешении экрана 1024×768 большинство веб-сайтов с фиксированным макетом не используют все доступное пространство слева и справа от своего контента. Гибкие макеты позволяют лучше использовать горизонтальное пространство, но изо всех сил стараются сохранить полезные длины линий. Эксперты по юзабилити сказали нам, что нужно просто написать так много слов. Между 8 и 12 словами, кажется, идеальная длина строки. Печатные СМИ, особенно газеты, не стесняются использовать даже более короткие строки. Зачем? Потому что они могут, размещая текст в нескольких столбцах.
Имейте в виду, что разрешение монитора, часто цитируемое в статистике, не обязательно совпадает с внутренней шириной окна браузера. Пользователи могут иметь дополнительные боковые панели / панели инструментов, использовать не развернутое окно браузера. Чем больше экран, тем менее вероятно, что вы захотите использовать все это только для одной страницы.
Очень длинные строки текста труднее читать. Оптимальным является 25-30em (зависит от многих факторов, но вы не должны просто идти на максимум).
Мобильные браузеры имеют "виртуальное" разрешение экрана, которое они используют для увеличения, и оно составляет ~960 пикселей в Opera Mini/Mobile и Mobile Safari.
Я голосую, чтобы разделить движение здесь. Тот факт, что размеры экрана X, не означает, что X или что-то, что близко к нему, является лучшим дизайном для вашего сайта.
Цель вашего сайта во многом зависит от выбранной вами ширины.
Многие маркетологи считают, что более узкая колонка "превращает" больше посещений в продажи. Возможно, это потому, что легче привлечь внимание людей, если страница узкая.
С другой стороны, сайт, посвященный изображениям, должен отображаться в наилучшем доступном разрешении для каждого посещающего браузера.
Я также использую макет между 950 и 980px и всегда по центру, если клиент не требует иного:)
Если вы используете фиксированную ширину, которая шире, чем наименьший экран, который может посещать ваш сайт, вы будете раздражать и расстраивать пользователей, которым приходится прокручиваться вбок, чтобы добраться до остальной части вашего контента.
Когда-то это было 800px; Однако все больше и больше сайтов начинают использовать 1000px, Это обусловлено тем фактом, что чаще всего нижние конечные разрешения посетителей 1024x768, Дополнительные 24 пикселя оставляют место для браузера Chrome, отступов и полей, которыми вы можете манипулировать и т. Д.
Просто чтобы дать некоторую перспективу, даже новая волна нетбуков с их крошечным экраном имеет разрешение 1024x768,
Но, прежде всего, знайте свою аудиторию так, как подсказывает @warren, и извлекайте из этого выгоду.
Максимальная ширина веб-сайта для оптимальной производительности и совместимости с кросс-мониторами составляет 960 пикселей, если речь идет о настольных компьютерах и ноутбуках.
Для получения более подробной информации о том, как и почему, смотрите следующую статью:
Вы можете попробовать разработать несколько макетов и использовать Javascript для переключения между ними в зависимости от окна посетителя.
Тем не менее, я обычно использую что-то между 950px и 980px.
Согласно этой статистике, минимальная ширина 1024 пикселя охватит большинство пользователей.