Имея опыт программирования, с чего мне начать изучать веб-дизайн?

Я веб-разработчик, в основном занимаюсь фронтенд-разработкой. Мои основные поля — это HTML5, CSS3 и Flash ActionScript 3.0.

Здесь, в Иране, для большинства людей командная работа ничего не значит, но я думаю, что это самый важный аспект нашей работы, особенно в веб-дизайне.

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

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

Так что лучший способ обойти это — улучшить свои навыки в графическом дизайне. Я просто хочу иметь возможность создавать хорошие макеты, правильно выбирать цвета и т. д. для своих веб-сайтов. Я не хочу заниматься дизайном иллюстраций и делать тяжелые графические работы. Просто создавайте веб-сайты без иллюстраций Photoshop, таких как плакаты и т. д.

Что вы делаете для своих графических работ, и если вы делаете их сами, какие книги или ссылки вы предлагаете мне прочитать? С чего начать?

Был отличный ответ на очень похожий вопрос, который был удален из stackoverflow давным-давно, и его можно увидеть в архиве по адресу web.archive.org/web/20100813080556/http://stackoverflow.com/… . Я связался с парнем, написавшим это, и предложил разместить его здесь. ( к сожалению, этот исходный вопрос и ответ, по-видимому, не могут быть перенесены )
@ user568458, отличная работа!
Принципы дизайна. Элементы дизайна. Интернет для доступности.

Ответы (1)

Это ответ, который я разместил на аналогичный вопрос о переполнении стека. Спасибо за внимание.

У меня может быть уникальная точка зрения на это, поскольку я изучал компьютерные науки и искусство в колледже. На самом деле это не похоже на то, что у вас действительно есть амбиции стать графическим дизайнером настолько, насколько вы хотите иметь возможность создавать веб-сайты самостоятельно, чтобы они не выглядели как дерьмо. Замечательная цель :) Без серьезного драйва и без скрытых художественных способностей вам никогда не стать графическим дизайнером. Но не бойтесь! Вы не должны быть. Вы можете продвинуться чертовски далеко, просто используя некоторые основные правила.

  1. Установите хорошую визуальную иерархию. Это 20 000 футов материала. Где ваша навигация? Где ваш контент? У вас есть указания о том, где вы находитесь и куда вы можете пойти? Всегда помните о том, как человек читает страницу. От верхнего левого угла к нижнему правому показано, насколько что-то важно. Крупные шрифты важнее, чем мелкие. Это здравый смысл, но это имеет огромное значение.
  2. Белое пространство. Белое пространство — это роскошь, не спешите от нее отказываться. Не тесните все в как можно меньшем пространстве. Пустое пространство помогает сгруппировать информацию для облегчения чтения, а также делает дизайн менее громоздким.
  3. Обратите внимание как на последовательность, так и на разнообразие. Последовательность чрезвычайно важна для того, чтобы сайт выглядел «разработанным», а не слепленным. Но не заходите слишком далеко. Постоянство не означает, что все одинаково. Без небольшого разнообразия на странице все сливается воедино. Так, например, вам нужно убедиться, что есть разница между вашим шрифтом заголовка (не обязательно семейством шрифтов, но размером, весом, цветом и т. д.) и вашим шрифтом абзаца. Но вы должны быть уверены, что все заголовки определенного уровня одинаковы. И вы не хотите, чтобы было слишком много разных шрифтов и размеров, или это просто выглядит слишком занятым. Вот где css великолепен.
  4. Цвета. Цвета, я думаю, являются тем дополнительным штрихом, с которым борются большинство недизайнеров. Возможно, стоит немного изучить теорию цвета, чтобы понять, какие цвета сочетаются друг с другом, но вот несколько советов. Думайте об этом, как об украшении комнаты.
    • Не используйте слишком много цветов, иначе ваша комната будет выглядеть как карнавал. То же самое с веб-страницей. Выберите 2 цвета, которые работают, и просто измените оттенок и тон, чтобы получить больше. Это создаст тему.
    • Используйте приглушенные или нейтральные цвета. Чем больше область цвета, тем более приглушенной она должна быть. Под подавленным я подразумеваю как более легкий, так и менее первичный. Представьте себе комнату, стены которой выкрашены в яркий вишнево-красный цвет. Пугающий. Яркие цвета очень хорошо привлекают внимание и могут использоваться в меньших дозах, когда это уместно. Например, более темная отделка в светлой комнате. Это может хорошо работать на ссылках или границах.
    • Как и в случае с пустым пространством, убедитесь, что вы определились с основным цветом фона. Это становится цветом, который вы на самом деле не видите, ваш разум просто отодвигает его на задний план. Часто это белый цвет, но он также может быть слегка окрашенным или тонированным. Используйте его много. Это создает передышку и делает поверхность приятной для чтения. В некоторых проектах для фона используется более темный цвет, но я бы оставил это на усмотрение профессионалов. Если вы не используете белый цвет для этого цвета, то белый становится цветом, который вы видите. Попробуйте следовать тем же правилам, что и для более ярких цветов, потому что это будет самый яркий цвет на экране.

Помимо этого списка, это действительно просто вопрос практики. Во время работы покажите дизайн кому-нибудь и послушайте. Посмотрите на другие дизайны и попробуйте добавить в свой дизайн то, что вам нравится. Просто не забудьте начать медленно. Вам не нужны причудливые вещи до конца. После того, как вы просмотрели список, и он выглядит довольно хорошо, но, может быть, немного простовато, вы можете добавить некоторые дополнения. Несколько закругленных углов здесь и логотип там, и очень скоро это выглядит так, как будто это сделал дизайнер.

Просто помните, что контент — это король. Вы не создаете сайт для портфолио дизайнеров, поэтому весь графический дизайн на самом деле просто доводит контент до пользователя таким образом, чтобы он был легко читаемым, удобным для навигации и приятным для глаз. Хороший дизайн — это тот, который пользователь даже не замечает, потому что, если он его замечает, он, вероятно, мешает.