С чего начать веб-дизайн?
Если вы занимались разработкой прототипов, то вы (по идее) должны понимать, что такое сетка.
Макеты в Photoshop делать неудобно, для этого сейчас есть специальное ПО типа Figma, Sketch. В них есть инструменты для реализации 90% процентов потребностей современных сайтов. В плане дизайна, конечно же. Отдельные элементы (типа сложных иконок, SVG-масок, графических элементов) уже нужно делать в других программах (Illustrator, Photoshop и т. п.).
Более того, вам нужно иметь понимание о вёрстке (HTML, CSS) — и чем глубже, тем лучше. Иначе вы можете «надизайнить» те вещи, которые реализовать либо технически невозможно, либо архисложно.
Экраны (типичные по ширине; без промежуточных значений):
· 1920 — большинство «больших» мониторов имеют данное разрешение, но за стандарт я бы его не брал. Но желательно учитывать данное разрешение тоже.
· 1300 — условный некий стандарт (ноутбуки). 
· 1024 — планшеты (iPad 9.7" в альбомной ориентации).
· 768 — планшеты (iPad 9.7" в портретной ориентации).
· до 767px — смартфоны.
Я для себя выбрал такие экраны, с которых начинаю:
1. от 0 до 767
2. от 768 до 1023
3. от 1024 до 1199
4. от 1200 до 1300
5. от 1301 до 1900
6. от 1900 до 2500
Но опять же — на конкретном проекте указанные выше диапазоны значений могут меняться или вовсе объединяться, могут добавляться промежуточные и т. д. К примеру, если у вас основное разрешение 1360 пикселей (ноутбуки), но т. н. boxed-layout, то вам надо делать макет шириной меньше, чтобы были видны границы по бокам + учитывайте ширину скроллбара Windows (16–17px).
Update. Так же, как правильно сказали другие люди, не стоит забывать про ширину контейнера с контентом, обычно он имеет фиксированную максимальную ширину, но это тоже зависит от дизайна.
Странные вопросы от человека который занимался ДИЗАЙНОМ... Спрашивать про размеры, сетку.... Как вы работали вообще? Или поди верстальщики от вас стрелялись?Есть хорошие понимание usability интерфейсов программ, приложений и веб-сайтов.
да?