Size: a a a

Дизайн-чат

2021 January 25

G

Gustavo in Дизайн-чат
Константин
Спасибо. А 1100 не сильно мало для контента? На 1920 мониторе получается почти пол экрана пустого. Воздух это конечно хорошо, но не до такой степени же. Я пока только учусь, но веб делаю 1400
Смотри, у большинства людей десктопы 15"  с разрешением 1400 - 1500. Плюс - если разраб с руками, то адаптив для него это не только малые, но и большие экраны.
Я в ответе сделал важную оговорку, вернее по ходу обсуждения их две:
1. Пиксель-пёрфект или вёрстка под меда запросы viewport - тогда в стандарте будут работать твои 1100 с полями, там есть ещё узкие заморочки как это решать, не буду останавливаться, в вёрстке есть не только фикс ширина, а мин и макс, но это - не про дизайн.
2. Второе ето сам viewport, то есть очень грубо - твой браузер, которые есть окно просмотра, статья как раз об этом. То есть на iphone с разрешением, допустим 760пикселов (если я не ошибаюсь - СЕ, как эталон самого маленького экрана), viewport браузера около 360+ пикселей.
источник
2021 January 26

G

Gustavo in Дизайн-чат
Cosmic
1100 это стандарт бутстрапа древнее говно мамонта которрое морально потеряло всякий смыл, но его юзают только потому что это дефолтная сетка

реально 1366 это то под что новые сайты уже давно пилят
Чуть не так. Страп использует в своей сетке 1170, те же 1100 + 70 пикс (это сумма пропусков между полосками сетки). 1100 - это минимально возможная сейчас ширина экрана, по этому рабочую область берут именно такого размера. Она на средних экранах не даёт больших полей, 100% не слетит на экране соответствующего размера, а для экранов 1600+ это решается технически так же как для маленьких - отдельные стили CSS. Повторю -это не древнее или не древнее, а   технический аспект работы в проекте. ТО есть если заказчик или тот же дизайнер топает ножками и кричит хочу пиксель-пёрфект (есть даже браузерная проверялка с точностью до 1пкс) - то верстаться будет медиа запросами под определённые диапазоны ширин экрана.
Если главное - резиновость и +/- правильное долевое соотношение элементов, тогда - просто задаётся всё в процентах от 100% ширины экрана и оно "резинится", то есть на любом экране даст одинаковое соотношение элементов, если я Вас правильно понял - это то, что в Вашем понимании мамонты не делали😉
Но в реальности живёт и то и то, зависит от поставленной задачи.
источник

C

Cosmic in Дизайн-чат
Gustavo
Чуть не так. Страп использует в своей сетке 1170, те же 1100 + 70 пикс (это сумма пропусков между полосками сетки). 1100 - это минимально возможная сейчас ширина экрана, по этому рабочую область берут именно такого размера. Она на средних экранах не даёт больших полей, 100% не слетит на экране соответствующего размера, а для экранов 1600+ это решается технически так же как для маленьких - отдельные стили CSS. Повторю -это не древнее или не древнее, а   технический аспект работы в проекте. ТО есть если заказчик или тот же дизайнер топает ножками и кричит хочу пиксель-пёрфект (есть даже браузерная проверялка с точностью до 1пкс) - то верстаться будет медиа запросами под определённые диапазоны ширин экрана.
Если главное - резиновость и +/- правильное долевое соотношение элементов, тогда - просто задаётся всё в процентах от 100% ширины экрана и оно "резинится", то есть на любом экране даст одинаковое соотношение элементов, если я Вас правильно понял - это то, что в Вашем понимании мамонты не делали😉
Но в реальности живёт и то и то, зависит от поставленной задачи.
так может быть подскажешь про ситуацию когда у меня есть макет в 1366
кто и что должен сделать чтобы изначально 1366 осталось, а все остальное резинилось?

потому что получилось так, продукт был готов на 100 процентов весь сделан под 1366
но разраб сказал срезать до 1100 и мне пришлось 40-50 страниц ресайзить
источник

АФ

Александр Филомено Ф... in Дизайн-чат
#дизайнсайта
#требуетсядизайнер
#дизайнер
#дизайнсайта
#требуетсядизайнер
#дизайнер

Дизайнер сайта.

Необходимо создать дизайн сайта (небольшого интернет магазина для магазина мужских костюмов)

Предлагайте свои услуги в лс скину ТЗ и примеры на которые стоит опираться.

Бюджет: 50 000 рублей
Связь: @aleksandrfilomeno
источник

G

Gustavo in Дизайн-чат
Cosmic
так может быть подскажешь про ситуацию когда у меня есть макет в 1366
кто и что должен сделать чтобы изначально 1366 осталось, а все остальное резинилось?

потому что получилось так, продукт был готов на 100 процентов весь сделан под 1366
но разраб сказал срезать до 1100 и мне пришлось 40-50 страниц ресайзить
Не так, просто рабочую область, то есть весть контент делай на 1100 или без привязки к пикселям в долях. То есть - если ты видишь экран, допустим в фигме, сколько он бы не был шириной у тебя в пикселях - принимай его за 100%. Элементы, отступы и всё остальное рассчитывай в процентах, а не пикселях. В этой ситуации - тебе всё равно какой экран и разрешение в любой версии и ресайзить ты ничего не будешь. Единственный момент - надо будет как-то указать разрабу ширину в процентах (может фигма и знает, но этого не знаю я про фигму😉, фотошоп после каких-то версий знает проценты XD, тоеж, но это не точно😉). Разрабу сразу говори, что ты делал резиновый дизайн, если разраб в материале - ему так даже легче.
источник

C

Cosmic in Дизайн-чат
Gustavo
Не так, просто рабочую область, то есть весть контент делай на 1100 или без привязки к пикселям в долях. То есть - если ты видишь экран, допустим в фигме, сколько он бы не был шириной у тебя в пикселях - принимай его за 100%. Элементы, отступы и всё остальное рассчитывай в процентах, а не пикселях. В этой ситуации - тебе всё равно какой экран и разрешение в любой версии и ресайзить ты ничего не будешь. Единственный момент - надо будет как-то указать разрабу ширину в процентах (может фигма и знает, но этого не знаю я про фигму😉, фотошоп после каких-то версий знает проценты XD, тоеж, но это не точно😉). Разрабу сразу говори, что ты делал резиновый дизайн, если разраб в материале - ему так даже легче.
отступы в процентах, это как?
источник

G

Gustavo in Дизайн-чат
Это как в математике - пересчитать. Мы так и делаем, если сайт резинить должен))))
источник

G

Gustavo in Дизайн-чат
У тебя экран - 1500 пикселей, допустим, для ровности счёта и привычности восприятия
источник

C

Cosmic in Дизайн-чат
Gustavo
Это как в математике - пересчитать. Мы так и делаем, если сайт резинить должен))))
а если по брейкпоинтам, тотогда как?
источник

G

Gustavo in Дизайн-чат
10% - 150 пикселей, то есть рабочая область 1200 пикселей у тебя будет иметь два отступа по 150 пикелей с каждой стороны или по 10% ширины экрана. В чём плюс? Если я его так положу, то на любом экране он будет смотреться одинаково. ибо браузер знает 6-7 метрических единиц, в том числе - проценты.
источник

G

Gustavo in Дизайн-чат
Cosmic
а если по брейкпоинтам, тотогда как?
Сори, я  не дизайнер - поясни, что ты имеешь в виду, если знаю - отвечу
источник

A

Alex in Дизайн-чат
Cosmic
а если по брейкпоинтам, тотогда как?
Посмотри статистику и нарисуй дизайн под каждое из популярных разрешений. И чем меньше разрешений ты будешь рисовать, тем легче тебе) потому 1120 (потому что это хорошо будет на больших размерах), чтоб рисовать 3 разрешения. А резиновые сайты надо ещё спроектировать грамотно
источник

G

Gustavo in Дизайн-чат
Alex
Посмотри статистику и нарисуй дизайн под каждое из популярных разрешений. И чем меньше разрешений ты будешь рисовать, тем легче тебе) потому 1120 (потому что это хорошо будет на больших размерах), чтоб рисовать 3 разрешения. А резиновые сайты надо ещё спроектировать грамотно
+++
источник

G

Gustavo in Дизайн-чат
Alex
Посмотри статистику и нарисуй дизайн под каждое из популярных разрешений. И чем меньше разрешений ты будешь рисовать, тем легче тебе) потому 1120 (потому что это хорошо будет на больших размерах), чтоб рисовать 3 разрешения. А резиновые сайты надо ещё спроектировать грамотно
А чё 1120?))))
источник

A

Alex in Дизайн-чат
Gustavo
А чё 1120?))))
Потому что удобно, колонка 64, межколонник 32, все кратно 8
источник

G

Gustavo in Дизайн-чат
Alex
Потому что удобно, колонка 64, межколонник 32, все кратно 8
Ну, это типа бутстрапа сетка тогда. Тоже вариант живой полностью, только надо пояснять эти соотношения разрабу, тогда верстаться будет не в процентах, а есть там ещё варианты метрик
источник

Э

Элина Агутина... in Дизайн-чат
Gustavo
Я чуть добавлю - посмотрите в нете статьи на тему расширений экранов "обычно" - оно чуть не обычно на самом деле. Если Вы хотите, чтоб макеты верстались качественно - нужно чуть посмотреть. Есть такая классная статья - "Пиксель не пиксель" - очень важно её понять, если у Вас веб.
Вау, круто! Добавила в избранное, чтобы на утро прочитать! Спасибо большое! А можете еще посоветовать полезного для самостоятельного изучения?
источник

G

Gustavo in Дизайн-чат
Элина Агутина
Вау, круто! Добавила в избранное, чтобы на утро прочитать! Спасибо большое! А можете еще посоветовать полезного для самостоятельного изучения?
Вряд-ли, я ж не дизайнер, я разработчик.  Есть темы по веб-дизайну на хабре и стек-оверфло. Там есть, что почитать. Тостер - это типа русский вариант стека, там есть вопросы и на них - куча ответов, так сёрфите помаленьку и учитесь решать узкие проблемки
источник

G

Gustavo in Дизайн-чат
Элина Агутина
Вау, круто! Добавила в избранное, чтобы на утро прочитать! Спасибо большое! А можете еще посоветовать полезного для самостоятельного изучения?
Тут, просто, смежный вопрос попался
источник

Head ® in Дизайн-чат
А у пятого бутстрапа кстати макс. брекпоинт какой?
источник