Какая оптимальная ширина макета и рабочей области?

Question

[Super_loser]

Я учусь веб-дизайну и не могу разобраться, какая должна быть ширина макета и ширина рабочей области? Обычно берут ширину макета 1920px, но контентную область по сетке то на 1280, то на 1170 или 960. Ну или вообще на нее забивают. От чего это зависит? Надеюсь на развернутый ответ

Comments

[Артур Карапетян]

Да что же с вами не так? Уже 3 такой вопрос на этой неделе. Дам вам совет: есть такая штука - поиск, очень полезная, но это не точно...

[Сергей delphinpro]

Ширина макета 1920.
Ширина содержимого 1170 (1200 - 15 * 2 - отступы по краям)
Это дефолтная сетка бутстрапа. Рисуйте под нее, и не заморачивайтесь. По крайней мере первое время.
Скачайте какой-нибудь шаблон с уже нарисованным слоем с сеткой и рисуйте.
Есть еще скрипты для фотошопа, которые автоматически расставят направляющие по бутстраповской сетке.

Answer 1

[lukoie]

Суперлузер? Серьезно?
Ок, размер рабочей области зависит от предпочтений и фолбеков.
Например, мое разрешение монитора сейчас как раз 1920, то есть картинка шириной 1920 будет как раз 100% ширины экрана... не учитывая полосу прокрутки и рамки окна. То есть нужны поля. Допустим по 15 пикселей(у меня не ретина, так что мой монитор имеет 72 точки на дюйм). Итого 1920 превращается в 1890, если надо контент делать на всю ширину (section-fluid в бутстраповых классах).
1920 это сейчас считаем как дефолтный монитор(смотрим по статистике), а на момент создания бутстрапа они зафиксировали 1170 как минимально допстимое разрешение десктопа, потому контент вписывают на такой размер(учитывая поля по 15 пикселей это разрещение 1200*800) как наиболее используемым разрешением.
Дальше 1280 это популярная ширина в разных разрешениях, как брекпойнт. Но уже без полей.
960 это из за одноименного фреймворка, где это число используется для фолбека на 1024*968 разрешение плюс поля, округление до нормального делительного числа.
Число 960(как и остальные перечисленные Вами) выбрано потому что удобно делить на колонки с полями. На 2/4/6/8/10/12/16/24

Берите ширину в зависимости о того, как будете верстать. А, ну и погодите, если Вы получаете готовый дизайн, то Вам не сильно получится "брать" какую то ширину контента, а придется работать с тем, что дали.
Опять же, будете ли пользовать фреймворки - тоже ограничит/упростит выбор ширины.
Забивать не надо. Если забили на ширину контента, то либо просто накалякали какую-то свою ширину, но все равно единую, либо вообще разброс по секциям/блокам. Вы вполне сможете потом свести всё до единой ширины, которую сами выбрали, если заказчик согласен и не требуется пиксель перфект по контентной области(обычно нет, и вполне обьясняется заказчику требованиями "соответствия для старых мониторов" или что то такое, после чего они соглашаются)

Зависит в основном от этого:

Answer 2

[Johny Smith]

Вам наверное надо разобраться с сеткой, например для Bootstrap, и на её примере пилить свой велосипед, или просто ей воспользоваться

Answer 3

[profesor08]

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