Как верстать сайты большой ширины ?

[Agony741]

Здравствуйте. 

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

2. Объясните, пожалуйста, как в команде разработчики и дизайнеры работают ?
Например, в интернете я нахожу только макеты для десктопа, ну и шаблон под мобилу и планшеты разумеется делаю как мне вздумается,
а как в командах? как быть в таких случаях когда ты в команде - но макет только для десктопа, тоже на глаз, сам как хочешь и выкручиваешься ? 

3. Скиньте, пожалуйста, ссылки где можно скачать макеты с полным набором (мобильные, планшетные, десктопные) 

 

[klierik]

1 час назад, Agony741 сказал:

Я так понял, будет какое-то ТЗ, или указание, которому нужно будет следовать?

Вопрос не понятен.

В реалиях опыт Синьёра позволяет выполнять большую часть таких задач автономно (при взаимном доверии с заказчиком), но опыт подсказывает когда и в каких вопросах значения «переменных» следует делегировать заказчику (это страхует исполнителя от ошибочного решения и экономит его время).

Краеугольным камнем в разработке можно считать Время. Есть решения которые принимает разработчик сам, опираясь на опыт. Но, когда не знаешь как поступить - спроси!

[Super_Saimon]

Я, конечно, может че не понял до конца в вашем вопросе... но, зачем задавать ширину самого "сайта" в 1400? Если уж вам и надо задавать сайт определенной ширины - я вижу решении тогда в media queries с контрольными точками для разных ширин экрана. Но... смысла в этом я не вижу. Вы  просто задаете ширину блока-обертки(wrapper) размером блока-родителя(body),а блок с самим контентом действительно задаете согласно размерам из макета и центрируете его по горизонтали.  Коненчно, повторюсь - я мог не до конца понять суть. 

Edited March 30, 2018 by Super_Saimon

[Agony741]

12 часов назад, Super_Saimon сказал:

Я, конечно, может че не понял до конца в вашем вопросе... но, зачем задавать ширину самого "сайта" в 1400? Если уж вам и надо задавать сайт определенной ширины - я вижу решении тогда в media queries с контрольными точками для разных ширин экрана. Но... смысла в этом я не вижу. Вы  просто задаете ширину блока-обертки(wrapper) размером блока-родителя(body),а блок с самим контентом действительно задаете согласно размерам из макета и центрируете его по горизонтали.  Коненчно, повторюсь - я мог не до конца понять суть. 

Насчет 1400, это размер сайта в макете указан такой, я вот не знаю/понимаю, что должно произойти с сайтом если ширина экрана больше 1400px, например: предположим что пользователь зайдет на сайт и у него размер монитора по ширине 1600px, а фоновые изображения у меня всего на 1400px в ширину, как мне быть? просто сделать фиксированную ширину фонового изображения 1400px (чтобы изображение не тянулось) и если экран шире у пользователя задавать заднему фону какой то цвет ? (чтобы изображение не растянулось на 1600px, ведь в данном случае изображение у меня фоновое с шириной 1400px).

[klierik]

1. Зависит от ожиданий заказчика. Сайт как может быть шире 1400 так и нет.

2. Чаще всего Десктоп+мобайл в макетах. Так же в командах есть ПМ который решает насущие вопросы с заказчиком

10 часов назад, Agony741 сказал:

например: предположим что пользователь зайдет на сайт и у него размер монитора по ширине 1600px, а фоновые изображения у меня всего на 1400px в ширину, как мне быть?

И это так же зависит от ожиданий заказчика. Но я бы, скорее всего, задал фоновое изображение по ширине окна без ограничений.

[user]

14 часов назад, Agony741 сказал:

Насчет 1400, это размер сайта в макете указан такой, я вот не знаю/понимаю, что должно произойти с сайтом если ширина экрана больше 1400px, например: предположим что пользователь зайдет на сайт и у него размер монитора по ширине 1600px, а фоновые изображения у меня всего на 1400px в ширину, как мне быть? просто сделать фиксированную ширину фонового изображения 1400px (чтобы изображение не тянулось) и если экран шире у пользователя задавать заднему фону какой то цвет ? (чтобы изображение не растянулось на 1600px, ведь в данном случае изображение у меня фоновое с шириной 1400px).

Можно растягивать фон с помощью background-size, но смотрите, чтоб качество картинки не терялось при увеличении, в этом случае картинку желательно брать по размеру больше. Можно вместо фонового изображения подкладывать под контент блок с картинкой с width:100%, это стоит делать в случаях, если нужный браузер не поддерживает background-size. А, вообще, надо смотреть по требованиям заказчика-одни хотят, чтоб картинка была фиксированная, другие-резиновая, третьи-чтоб обрезалась, четвертые-чтоб менялась и так далее. По второму вопросу-в идеале дизайнер должен создавать версии для разных экранов. Если он этого не сделал, то просите об этом или берете работу по придумке и верстке мобильной версии на себя, предварительно согласовав с дизайнером/заказчиком/менеджером и получить за это дополнительную оплату.

Edited March 31, 2018 by user

[Agony741]

10 часов назад, klierik сказал:

1. Зависит от ожиданий заказчика. Сайт как может быть шире 1400 так и нет.

2. Чаще всего Десктоп+мобайл в макетах. Так же в командах есть ПМ который решает насущие вопросы с заказчиком

И это так же зависит от ожиданий заказчика. Но я бы, скорее всего, задал фоновое изображение по ширине окна без ограничений.

Я так понял, будет какое-то ТЗ, или указание, которому нужно будет следовать ?

6 часов назад, user сказал:

Можно растягивать фон с помощью background-size, но смотрите, чтоб качество картинки не терялось при увеличении, в этом случае картинку желательно брать по размеру больше. Можно вместо фонового изображения подкладывать под контент блок с картинкой с width:100%, это стоит делать в случаях, если нужный браузер не поддерживает background-size. А, вообще, надо смотреть по требованиям заказчика-одни хотят, чтоб картинка была фиксированная, другие-резиновая, третьи-чтоб обрезалась, четвертые-чтоб менялась и так далее. По второму вопросу-в идеале дизайнер должен создавать версии для разных экранов. Если он этого не сделал, то просите об этом или берете работу по придумке и верстке мобильной версии на себя, предварительно согласовав с дизайнером/заказчиком/менеджером и получить за это дополнительную оплату.

Короче говоря - "разбирайся с дизайнерами и заказчиками" так ?