Сетки и разрешение в вебе. Как правильно расчитывать и есть ли какие то правила?
Начнем с того что я спокойно могу работать в фотошопе, фигме а так же немного умею верстать. Я понимаю что разрешение экрана это то сколько пикселей устройство может отобразить в одном дюйме по ширине и высоте. Я знаю что существует такое понятие как сетки и что это нужно для того чтобы верстальщикам было проще И так далее. Но я не могу четко понять следующие вещи;
1. Что же такое разрешение ? Оно отвечает за качество изображения или за его размер(ширина, высота) и как правильно его расчитывать допустим при создании баннера на сайт или в веб-дизайне когда делаешь макет, как задавать правильное разрешение изображения чтобы получить то что нужно.
Например разрешение моего экрана 1440x900px и если я создам баннер такого же разрешения и залью на сайт оно все равно будет отображаться в увеличенном или в уменьшеном размере.
Или при создании макета веб сайта.Разрешение экрана на айфонах от 1200px старых моделей и до 2688×1242 на iphone xs max, но почему то в фотошопе или фигме нужно выбирать разрешение 320px.Я умею рисовать разные элементы и обрабатывать изображения но когда дело доходит до установки размеров и разрешения я просто беру стандартные значения не понимая как все рассчитать и как это будет выглядеть на том или ином экране
2.Сетки. Я много читал на счет этих вопросов но до меня никак не доходит. Я знаю что такое бутстрап и что сетка структурирует содержимое и задает какие то фиксированные отступы. Но все ли нужно ровнять по сетки и есть ли какие то правила расстановки элементов
P.s может вопрос и кому то покажется глупым, но я смотрел очень много видеоуроков и статей, но так и не понял эти вещи. Буду очень благодарен если кто то может обьяснить на каком нибудь простом примере или хотя бы сказать что я конкретно должен почитать чтобы понять это.
1) физическое разрешение и разрешение в браузере не одно и то же
тут внизу есть инфа по устройствам https://www.mydevice.io/
узнать свое разрешение myresolutionis.ru
2) Если в конкретном блоке нет сетки, то на него придется потратить больше времени. Это можно сделать, но "спасибо" никто не скажет.
Видео по сеткам https://youtu.be/3mV-Yw6cm-E
Это что касается верстки. Но сетки и в самом дизайне важная тема, это система организации объектов в пространстве и тд. Поищи инфу.
А что например на счет изображений, допустим мое разрешение экрана 1440px в ширину, чтобы создать баннер который будет точно так же ровно смотреться на моем экране получается нужно задать ему ширину 1440px ?
nemovalex, если баннер используется на сайте, то учитывайте что скроллбар занимает пространство (примерно 15 пикселей) + границы браузера. Как итог у вас останется не 1440, а 1400-1420 пикселей. Но верстальщик может вместить этот баннер и в 1366 пикселей (учитывайте что есть меньшие/большие размеры экранов). Думаю лучше обсудить это с верстальщиком.
Алекс Глебов, DaBags, Спасибо, начал разбираться по ссылкам которые вы скинули, и уже начал по немного понимать.Это было моей самой большой проблемой так как до этого вообще не разбирался в таких вещах как экраны, разрешения и тому подобное.