Веб дизайн самоучитель – Книга «Основы Web-дизайна. Самоучитель» — Дунаев Вадим Вячеславович скачать бесплатно, читать онлайн


04.02.2018 Facebook Twitter LinkedIn Google+ Советы художника


Содержание

Обучение веб-дизайну с нуля — пошаговая инструкция (2018)

Многие молодые люди желают связать будущую профессию с разработкой сайтов. Естественно, не все хотят быть программистами, часть из них их вполне устраивает веб-дизайн.

Обучение этой профессии с нуля – дело не легкое, ведь кроме навыков работы в графических редакторах необходимо быть креативным человеком, хотя бы немного разораться в коде (знать CSS и HTML), уметь общаться с заказчиком на одном языке и т. д.

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

Давайте разберёмся, с чего начинать обучение веб-дизайну, какие знания для творчества понадобятся, где и в каком порядке их добывать, сколько времени уделять практическим занятиям, как обзавестись первым опытом и заказом…и с массой сопутствующих вопросов.

Cодержание:

Этап первый – выясните, почему вы хотите этим заниматься

С одной стороны, это простой вопрос, ведь большинство хочет заниматься веб-дизайном ввиду хорошей оплаты труда.

Сайтостроение – очень прибыльное дело, а опытного, и главное, толкового разработчика днём с огнём не всегда сыскать.

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

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

И данная область может послужить отличным средством для реализации своих талантов на практике с извлечением из этого финансовой выгоды.

Рис. 1 – Увлекательная и творческая профессия веб-дизайнер

Важно! Для какой бы цели не знакомились с веб-дизайном, помните, что как обучение, так и работа должна быть интересной, выполняться с желанием и приносить удовольствие, но не превратиться в рутину.

Ввиду того, что графический художник – молодая профессия, её точного определения пока не существует, и многие специалисты трактуют понятие по-своему.

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

Без уникальных решений, оригинальных идей и индивидуального творческого подхода задача не решается.

Дизайнер сайтов – это технический художник, работающий над внешним видом и оптимизацией загрузки сайта и веб-приложений.

В задачи этих людей входят:

  • работа над логической структурой страницы – дабы любому начинающему пользователю всё было понятно, он с первого раза смог отыскать то, что ищет, все важные ссылки должны быть на виду;
  • разработка наиболее рационального способа подачи контента – способность заинтересовать посетителя, заставить его подольше задержаться на ресурсе, полистать страницы сайта;
  • графическое оформление – где какие элементы будут размещаться, какими будут кнопки и надписи после клика, как осуществляется взаимодействие с клиентом, как и что будет изменяться в процессе работы посетителя, изменения масштаба и т. п.

Вот мы вкратце и выяснили, почему люди хотят заниматься графической частью сайтов.

Для будущих программистов достаточно ознакомиться с азами визуального оформления веб-ресурсов, хотя бы поверхностно освоить графические редакторы, верстку по шаблону.

Уж жаждущим многие годы жизни посвятить созданию интерфейса интернет страниц и получить соответствующую профессию поначалу придётся потрудиться, им и посвящена данная статья.

вернуться к меню ↑

Этап второй – выберите направление веб-дизайна в котором вы хотите себя попробовать

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

Нынче различают целых семь направлений в их оформлении, и это только основных.

Рис. 2 – Основные направления современного веб-дизайна

Жесткий

Старый как само сайтостроение вид оформления страниц, не требующий прикладывания усилий, отлично подойдёт для новичков.

Суть заключается в том, что все элементы ресурса размещаются в виртуальных ячейках таблицы с фиксированными размерами, которые задаются дизайнером.

Такая страничка будет абсолютно одинаково выглядеть на всех устройствах, независимо от платформы и размера экрана.

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

Гибкий

Также табличный дизайн, но ширина ячеек виртуальной таблицы не строго задана, а зависит от размеров экрана (соотношения сторон, разрешения). Объекты будут стараться заполнить всё пространство ячейки, изменяя её размер. Главная особенность подобного решения – повышение удобства визуального восприятия данных за счёт динамически изменяющихся параметров отображения. На подобных страницах нет пустых, свободных от контента, мест.

Сложностями подобного дизайна являются:

  • отсутствие гарантии, что на старых «квадратных» и огромных широкоформатных дисплеях ресурс будет отображаться правильно, без растягивания или сжимания содержимого;
  • далеко не все браузеры нормально справляются с обработкой так называемых гибких ячеек, да и интернет-обозреватели, созданные на различных движках, делают это каждый по-своему;
  • на подгонку и доведение проекта до идеала уходит много времени.

Рис. 3 – Гибкий веб-дизайн

Комбинированный

Соединение двух предыдущих методов: если размеры монитора (соотношение его сторон) сильно отличаются от параметров дисплея, что использовался при создании сайта, применяется гибкий дизайн, в ином случае используются и те, и иные ячейки, в зависимости от наличия свободного пространства в них.

Текстовый

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

Полиграфический

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

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

Рис. 4 – Полиграфический дизайн страницы: насыщенный цветами и картинками

Интерфейсный

Обращаются к нему в основном опытные мастера. Их задача – угодить всем запросам пользователя, как правило методом минимизации программного кода, оптимизации графических элементов и создания удобной навигационной системы с расположением меню в верхней части страницы. Такие ресурсы быстро грузятся, с ними легко работать как с компьютера, так и с мобильных устройств

.

Динамический

Наиболее трудоёмкие, сложные варианты оформления веб-страниц. Данный тип дизайна заключается в размещении на странице динамического контента (анимация, скрипты, двигающиеся и изменяющиеся элементы, широкоформатные видео).

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

вернуться к меню ↑

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

Прежде, чем скачивать книги по тому или иному графическому редактору, нужно ясно себе представлять те элементы, что используются при графическом оформлении сайтов: фигуры, цвета, формы, игра света и тени, линии – это базовые элементы, из которых и создаётся вся композиция.

Как ни крути, знания каскадных таблиц и гипертекстовой разметки нужны едва ли не в первую очередь.

Понадобятся дизайнеру и знания в области компьютерной анимации, популярных CMS, SEO, а может и трехмерного моделирования.

Так сложилось, что Photoshop стал самой востребованной программой для графического дизайна и используется фактически во всех сферах, где нужна обработка изображений.

Он хоть и сложный для освоения новичками, потраченное на изучение функционала редактора время окупится с лихвой. Масса уроков, книг, материалов и готовых проектов сети помогут в этом.

В добавок ко всему практически все проекты макетов хранятся в формате psd – родном формате Photoshop.

Рис. 5 – Основные инструменты для веб-дизайна

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

Также стоит обратить вниманием на Sketch (только для OS) – ближайшего конкурента Photoshop.

Последний обрастает функционалом, который востребован в десятках сфер, и преумножению возможностей относительно веб-дизайна ребята с Adobe внимания уделяют мало.

Другое дело Sketch – заточена для рисования графических интерфейсов с нуля, не имеет ни единого лишнего элемента, более проста в освоении и легко обгоняет Photoshop по основным показателям.

Обязательно выберите наиболее удобный текстовый редактор, поддерживающий синтаксис и подсветку: VIM, Sublime, Axure RP.

вернуться к меню ↑

Этап четвертый – изучите полезные книги для начинающих веб-дизайнеров

Интернет тем и хорош, что позволяет бесплатно обзавестись книгами, которые ещё десяток лет назад пришлось бы приобретать или искать в единомышленников.

С популяризацией профессии веб-дизайнера и количество книг по теме увеличилось. Без наставника и учителя книга – лучший способ получать знания.

Обучение веб-дизайну с нуля следует начинать с той литературы, где даются основные понятия, теория и небольшие практические задания:

1Итан Маркотт «Отзывчивый веб-дизайн» – практическое руководство для веб-дизайнеров, после освоения которого новичок избежит сотен типичных для начинающих ошибок, узнает о целесообразности создания мобильной версии сайта. Написано в ней и как верстать страницы, которые будут одинаково отображаться на всех устройствах.

2Якоб Нильсен «Веб-дизайн» – в книге масса руководств по созданию эффективных интерфейсов, правильному расположению элементов навигации и заполнению ресурса контентом.

3Ю. Сырых «Современный веб-дизайн»  – справочник, описывающий тонкости работы над интерфейсом, начиная с этапа подбора контента в зависимости от тематики ресурса, и заканчивая тестированием и отладкой готового макета. В ней масса информации не только по рисованию интерфейса, но и по его оптимизации и наполнению.

4Д. Кирсанов «Веб-дизайн» – автор создал самый полный и подробный теоретический и практический курс веб-дизайна. Книга написана простым языком, для её освоения даже HTML и CSS знать не обязательно.

Электронный учебник – очень хорошо. Благодаря ему можно пробовать реализовать в деле полученные знания, быстро переключаться между книгами и сравнивать информацию с различных источников, но заменить ими бумажную книгу нельзя. Если хотите зарабатывать себе на жизнь оформлением и оптимизацией сайтов, не пожалейте денег на приобретение бумажных вариантов книг и справочников. Они всегда окупятся, да и домашнюю библиотеку расширят.

Кстати, читайте также у нас:

Рис. 10 – Обложка книги «Настольная книга веб-дизайнера»

  • Дженнифер Нидерст Роббинс «Web-дизайн. Справочник»  — третье издание, где автор делится опытом многолетней работы в динамически развивающейся отрасли — web-дизайне. Особое внимание уделено работе с изображениями, подготовке материалов сайта к печати и публикации и использованию Java-скриптов.

Кроме отечественных авторов необходимо знакомиться и с книгами западных дизайнеров, именно от них можно узнать о чем-либо новом в области.

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

Рис. 11 – Книги для обучения веб-дизайну

При выборе литературы стоит опираться не столько на описание книги, сколько на отзывы практикующих дизайнеров о ней.

вернуться к меню ↑

Этап пятый просто попробуйте создать первый проект

Если есть идеи или желание создать свой первый сайт, самое время реализовать их, параллельно набираясь опыта работы с графическим реактором и продумыванием будущего вида сайта.

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

Ещё можно взять и скопировать какой-либо понравившийся сайт, стараясь всё сделать аналогично.

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

Сначала продумываем концепцию оформления и подбираем контент, соответствующий тематике ресурса. Затем пойдёт работа над структурой макета (создание меню, разделов сайта, сортировка контента по разделам) и её доведением до ума (рисуем приблизительную схему расположения элементов на готовой странице).

Основными элементами являются:

  • Логотип – занимает, как правило, центральную часть страницы и отличает ресурс от иных;

  • Элементы навигации – размещается вверху страницы горизонтально, реже – вертикально и содержит ссылки на основные разделы;

  • Футер – строка внизу сайта с данными о разработчике, правах, ссылки, кнопки «Поделиться»;

  • Основной блок, где размещён контент – занимает основную часть экрана, текст всегда сопровождается рисунками, таблицами, схемами, анимацией и т. д.

Модульная сетка

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

Использование модульной сетки сильно упростит дальнейшую вёрстку, посвятите время знакомству с ней.

Рис. 12 – Модульная сетка сайта

вернуться к меню ↑

Этап шестой – онлайн-тренинги

Практикующие дизайнеры всегда готовы поделиться опытом и знаниями о новых достижениях в области, не за бесплатно, конечно. Способов попасть на подобные курсы, в общем-то, два:

  • посещение семинаров и тренингов;
  • участие в обучении по сети (удалённо).

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

1Уроки веб-дизайна для начинающих

2Краткий практический курс для новичков

3Основы работы в Photoshop по созданию макетов от дизайнера с 10-тилетним опытом

4Мастер-классы и советы от бывалого художника

Более опытные разработчики, владеющие английским языком, обязательно должны ознакомиться с курсами западных коллег. Как и в случае с книгами, западные технические художники раньше практикуют новые технологии и решения в области, во-вторых, концепция работы среди иностранных дизайнеров может изрядно отличаться, а перенять чужой опыт всегда полезно. От курсов люди получают большую отдачу, чем от десятков прочитанных книг, что касается практических навыков.

вернуться к меню ↑

Этап седьмой – найдите единомышленников

В трудовой деятельности важно общаться с людьми, которые занимаются тем, чем и вы.

Так не только друзьями можно обзавестись, но и делиться опытом, знаниями, советами, оказывать помощь и оценивать проекты один одного.

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

Для этого сообщества в социальных сетях есть, тематические форумы и сайты:

Рис. 13 – Живой форум веб-дизайнеров

вернуться к меню ↑

Этап восьмой – следите за трендами и тенденциями

Чтобы быть готовым ко всему при работе с заказчиком в области, где ни дня не проходит без новинок, нужно постоянно следить за новыми разработками, решениями и технологиями.

Они и визуальный вид сайтов изменяют к лучшему, и оптимизируют загрузку ресурса, и эмоциональную привлекательность страницы повышают.

Проще всего посещать ресурсы, где опытные и не очень дизайнеры выставляют свои работы на показ:

Не бойтесь скопировать что-либо у других для своего нового проекта и поделиться готовыми работами.

вернуться к меню ↑

Этап девятый – попробуйте свои силы на фриланс-бирже

Работать техническим художником можно как самому от себя, так и на какую-либо фирму. Начинающим пользователям лучше набираться опыта на биржах фриланса:

Рис. 14 – Удалённая работа веб-дизайнером

Работаем поначалу за дёшево: берём недорогие заказы и долго и усердно трудимся над их выполнением, пока заказчик не останется довольным.

Удачные проекты – это опыт не только в дизайне, но и в общении с различными клиентами, пополнение пока ещё пустого портфолио работами.

Побольше внимание уделите заполнению профиля и расценкам на работу.

Несложные, но доведённые до ума макеты можно и продавать, беря за основу подобные проекты, выставленные на продажу.

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

вернуться к меню ↑

Этап десятый – превратите веб-дизайн из хобби в профессию

Заниматься дизайном сайтов обычно начинают студенты и молодые люди, для которых это занятие становится увлечением.

Они выходные и вечера посвящают любимому делу, а когда набираются немного опыта и увлечение приносит первые доходы, всерьёз подумывают о смене рода деятельности.

Вот только бросить работу и перейти на вольные хлеба или заменить текущее место работы на комфортное кресло в офисе за компьютером многие опасаются.

Тут и недостаток опыта сказывается, и невысокие шансы отыскать заказчика или обзавестись постоянными клиентами, и стабильного заработка в случае работы на биржах фриланса и соответствующих форумах никто не гарантирует.

Рис. 15 – Со временем веб-дизайн должен стать профессией

И все же, если занятие по разработке графических интерфейсов сайтов привлекает, превращать его в основную профессию определённо стоит, и затягивать с этим не обязательно.

Со временем и знания появятся, и опыт, и постоянные заказы.

А если хочется большей стабильности, обратите внимание на работу в офисе среди единомышленников с возможностью периодически работать удалённо.

Главное, стремиться становиться лучше, постоянно развиваться и получать удовольствие от того, чем занимаешься!

 

 

 

Обучение веб-дизайну с нуля — пошаговое руководство для начинающих (десять этапов)

5 (100%) 2 голос[ов]

geek-nose.com

web master | Учебники по Web-Дизайну

Главная » Учебники по Web-Дизайну

В этом разделе представлена  коллекция хороших учебников и книг по веб-дизайну и программированию. 

 Приведенные материалы доступны для бесплатного скачивания.

 



Стив Круг | Веб-дизайн или «не заставляйте меня думать!» [2008] 
  

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

Формат: PDF

                                                                                   


Патрик Макнейл | Веб-дизайн. Идеи. Секреты. Советы [2012] 
  

Интернет — динамично развивающаяся среда, работая в которой дизайнеры должны следить за новейшими тенденциями. Патрик Макнейл, создатель популярного блога для веб-дизайнеров designmeltdown.com, собрал и упорядочил тысячи примеров сайтов, самые лучшие из которых попали в данную книгу. В издании объясняются базовые принципы веб-дизайна, подробно рассматриваются типы сайтов, элементы дизайна, стили и темы, структурные стили и структурные элементы сайтов. Книга включает более 650 примеров веб-сайтов, упорядоченных тематически, благодаря чему вы сможете легко отыскать креативные образцы для использования в своей работе.2012

Формат: PDF

                                                                                


Не забывайте написать ваш комментарий, понравилась ли статья. От вас пару слов, а мне — признание поисковых систем, что пишу нормальные человеческий статьи. Заранее спасибо вам!

profwebsit.ru

с чего начать обучение новичку?

С развитием коммерческой сферы в интернете появилось много новых профессий. И пока все эти специальности не начали преподавать в университетах, спрос на хороших специалистов велик.

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

Интернет-маркетинг

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

Сейчас интернет-маркетинг зависит от нескольких специалистов, которые помогают спланировать стратегию развития сайта, разработать его, наполнить контентом и продвинуть в Сети.

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

Понятие

Если студент не в полной мере понимает задачи будущей специальности, то и работать в этом направлении ему будет непросто.

Веб-дизайн — это классическое проявление дизайна в веб-разработке, задачей которого является проектирование пользовательских интерфейсов сайтов и приложений. Чем занимаются специалисты:

  • Проектировкой логической веб-структуры ресурса.
  • Разработкой и внедрением удобных способов подачи контента (юзабилити).
  • Художественным оформлением сайта.

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

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

Терминология

Если отнестись более углубленно к термину «веб-дизайн», то это графический дизайн, благодаря которому можно разрабатывать и оформлять объекты информационной среды Интернета. Помимо визуального качества, специальность работает и над удобствами пользования.

Такое объяснение помогает отделить данный термин от понятия «веб-программирование», наделяя первый творческим направлением.

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

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

К примеру, W3C — это организация, которая внедряет технологические стандарты для Интернета. Специалист должен следить за изменениями и работать с ними.

Кроссплатформенность — это возможность программы работать на нескольких платформах, то есть быть универсальной под любые системы.

Интернет-маркетинг также диктует свои правила оформления ресурса, внедрение элементов, которые бы влияли на потенциального покупателя.

Важно также знать азы SEO-оптимизации и рекламы в интернете.

Процесс

С чего начать веб-дизайн? С изучения того, что должен делать специалист этой сферы. Уникальное оформление обычно стоит дороже, поскольку является колоссальной работой, которая требует уделять внимание каждой детали.

В этом случае заказчик создает подробное ТЗ, которое прописано до мельчайших подробностей. Дизайнер занимается тем, что разрабатывает концепцию ресурса, либо, получив требования, следует им, создавая макет. Лишь после этого готовый шаблон передается веб-разработчику.

Иногда веб-дизайнер на основе шаблонов предлагает свои решения. Такой способ ускоряет работу и оказывается значительно дешевле.

Некоторые веб-дизайнеры работают не над конкретными проектами, а над разработкой шаблонов, которые позже можно устанавливать на любой ресурс. Есть большое количество сайтов с подобными решениями. Даже неопытные пользователи могут приобрести за 40-60 долларов понравившийся шаблон и установить его на свой будущий сайт.

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

Чтобы главная страница также выделялась, веб-дизайнер занимается отдельным макетом, в который можно вносить дополнения или изменения, соответствующие тематике либо специальными событиями.

Веб-дизайн: обучение с нуля

Лучший способ разобраться с тем, с чего начать изучение этой специальности, — это зайти на любой курс и прочитать учебный план. Первое занятие, как правило, является вводным. На нем рассказывают:

  • Что такое веб-дизайн.
  • Объясняют восприятие человеком визуальных образов.
  • Обучают теории цвета и психологии его восприятия.
  • Рассказывают о форме в графическом дизайне.
  • Объясняют пропорции и композиции в веб-дизайне.
  • Учат различать векторную и растровую графику.
  • Рассказывают о цветовых моделях и современных трендах.
  • Кратко описывают основные программы для работы с компьютерной графикой.

Обычно несколько занятий посвящаются работе с программой Adobe Photoshop. На первом уроке изучают интерфейс приложения, панель инструментов, настроек, создание простого документа, виды и типы шрифтов.

Далее студенты знакомятся с понятием пользовательского интерфейса ресурса и с основными его элементами. Они изучают взаимодействие с пользователем. После этих уроков проходят итоговые занятия с практикумом по созданию отдельных элементов.

Но это не все, с чего начинают web-дизайн. Будущий специалист должен познакомиться с еще одной программой — Adobe Illustrator. Как и c Adobe Photoshop, в этом случае происходит знакомство с целями программы, рабочим пространством, созданием документов, монтажных областей, панелью инструментов.

Важным занятием является изучение основы архитектуры сайтов. В нем рассказывают о типах и видах сайтов, структуре страницы, элементах взаимодействия, задачах и функциях, ТЗ при разработке, а также об особенностях проектирования. Кроме того, затрагивают тему HTML и CSS.

Коммерческие сайты

С чего начать изучение веб-дизайна? Как уже упоминалось ранее, важную роль играет знание интернет-маркетинга. Поэтому сайты коммерческой направленности также рассматриваются на курсах данной специальности.

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

Если вы не знаете, с чего начать самообучение веб-дизайну, поищите в интернете ТЗ. На чужих заданиях вы сможете потренироваться создавать главную страницу коммерческого сайта, разрабатывать каталог и карточки товара.

Посадочная страница

Landing page — это еще одна форма коммерческого сайта. Ее называют целевой или посадочной страницей. Главной задачей такой формы отображения контента является сбор контактных данных целевой аудитории.

Такая страница является усилителем эффективности рекламы и увеличения аудитории. Она содержит информацию о товаре или услуге.

Урок на эту тему начинается с определения посадочной страницы, структуры и практического создания дизайна. Далее важно провести практикум по верстке landing page. С точки зрения интернет-маркетинга, посадочная страница должна иметь много важных деталей.

Анализ

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

Самостоятельное обучение дома

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

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

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

Цвет

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

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

Шрифт

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

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

Программы

О программах, которые нужны веб-дизайнеру, мы уже упоминали. О них нужно знать все, уметь ими пользоваться и понимать принцип работы. Adobe Photoshop и Illustrator — основные инструменты работы с растровой и векторной графикой. В этот список можно добавить программу Sketch, о которой говорят специалисты этой области.

Специальная литература

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

  • Джереми Кит «HTML5 для веб-дизайнеров».
  • Дэн Сидерхолм «CSS3 для веб-дизайнеров».
  • Стив Круг «Веб-дизайн, или Не заставляйте меня думать».
  • Тим Кедлек «Адаптивный дизайн. Делаем сайты для любых устройств».

Подобных книг очень много. Вместе с учебным планом, важно постоянно читать и получать дополнительные знания.

Выводы

Если вы задались целью самостоятельно изучить веб-дизайн, то у вас обязательно все получится. На первом этапе важно внимательно продумать учебный план и следовать ему.

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

Намного проще будет тем, кто уже умеет пользоваться «Фотошопом», знает интернет-маркетинг и основы дизайна. Им несложно будет понять, с чего начать изучать веб-дизайн. Самообучение может занять два-три месяца. Но помните, важно каждый день уделять хоть немного времени изучению данной специальности.

fb.ru

Книги по Веб-дизайну, CSS, HTML




Также смотрите разделы связанные с разделом Книги по Веб-дизайну, CSS, HTML, создание сайтов и верстка:
  • Обучение информатике, презентации по информатике
  • Книги, задачники и учебники по информатике
  • Книги и учебники по программированию
  • Обучение пользованию Интернет
  • Полезные сайты, ссылки, утилиты, программы
  • Уроки и советы по PHP, HTML, CSS, JavaScript, Java, JSP, Servlet
  • Уроки и советы по CSS
  • Обучение компьютерным программам
  • Решебники и ГДЗ по Информатике
  • ГИА, экзаменационные билеты по Информатике
  • Словари по информатике и компьютерам
  • ЕГЭ по информатике
  • Все книги по информатике


Ниже Вы можете бесплатно скачать электронные книги и учебники и читать статьи и уроки к разделу Книги по Веб-дизайну, CSS, HTML верстка, разметка Web-страниц, каскадные таблицы стилей:





  • CorelDRAW ХЗ, Учебный курс, Миронов Д.Ф., 2006
  • HTML — Популярный самоучитель — Чиртик А.А.
  • HTML — Просто как дважды два — Рева О.Н.
  • HTML, Популярный самоучитель, Чиртик А.А., 2006
  • Высший пилотаж в Photoshop CS2, Клосковски М., 2006
  • Построй свой супер-сайт за 21 день — Морозова О.М.
  • Построй свой супер-сайт за 21 день, Морозова О.М., 2006
  • Создание Web-страниц и Web-сайтов — Самоучитель — Печников В.Н.










Описание раздела «Книги по Веб-дизайну, CSS, HTML»

   В данном разделе к вашему вниманию предоставлены Книги по Веб-дизайну, CSS, HTML верстка, разметка Web-страниц, каскадные таблицы стилей. Вы мечтаете стать Web дизайнером, хотите разрабатывать интересные Web порталы, но не знаете как? Тогда скачивайте книги с нашего сайта бесплатно и без регистрации.

     У нас собраны книги самых популярных авторов: Musciano С., Kennedy B., Едомский Ю.Е., Niederst J.R., Борисенко А.А., Молли Э., Айзекс С., Ашманов И., Иванов А., Новичков Д.Ю., Сатин Д.К., Костин А.Н., Мейер Э., Дубаков М., Вилдермьюс Ш., Чанг Т., Кларк Ш., Гурвиц М., Вильямсон Х., Исагулиев К., Уотролл Э., Гербер Н., Смит С., Ошман М., Болдуин Д., Макдоналд Д., Петере К., Стир Д., Уильямс Э., Барбер К., Ньюкирк П. и другие.

     В книгах написано все о программах для Веб дизайнера: Adobe ColdFusion Enterprise 8.0, Adobe Contribute, Adobe Dreamweaver, Adobe Fireworks, Adobe Flash Professional, Adobe Photoshop, Microsoft Expression Web и другие.

     Если вы планируете стать веб-дизaйнерoм, то Фoтoшoп будет oснoвнoй графической прoгрaммoй, с кoтoрoй вам предстоит иметь дело. Далее вы изучите html. Если html знaете — тo css выучите зa пaру-трoйку дней. Так же обязательно пользуйтесь Macromedia Dreamweaver.

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

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

 

nashol.com

Книги для веб-дизайнеров и лучшие сайты для новичков

Доброго времени суток, дорогой читатель! Мы подготовили для вас лучшие сайты и книги для веб-дизайнеров, которые только существуют на просторах интернета. Данная информация будет полезна как для начинающих, так и для профессионалов.

Для каждой интернет-профессии существует множество книг, которые заслуживают внимания любого, кто увлечён своей деятельностью. Мы предлагаем обзор книг на русском и английском языках.

Лучшие русскоязычные книги для веб-дизайнера

  1. «Эмоциональный веб-дизайн» А. Уолтера – это книга для вдохновения. Цель автора — поделиться знаниями о том, как делать яркие, уникальные веб-страницы, которые не только вызывали бы положительные эмоции у аудитории, но и заинтересовывали пользователя продуктом. Это кладезь новых идей и фишек для разработки захватывающего сайта.
  2. «Энциклопедия WEB-дизайнера» Бориса Леонтьева – это основы основ, которые важно знать начинающим веб-дизайнерам. Прочитав эту книгу, вы освоите языки гипертекстовых документов, получите базу знаний по графическому дизайну, а также познакомитесь с программами и редакторами.
  3. Для того, чтобы юзабилити сайта было на высшем уровне мы рекомендуем изучить работу Стива Круга «Как сделать сайт удобным». Также в свет вышла вторая книга этого автора под названием «Веб-дизайн: не заставляйте меня думать», которая, в свою очередь, адресована специалистам маркетинга, дизайна, программирования и менеджмента.
  4. «Веб-дизайн» Дмитрия Кирсанова считается одной из лучших книг по веб-технологиям. Это полноценный самоучитель для начинающих. Книга легко читается, потому что писал её профессионал, который всё опробовал на своём личном опыте и с лёгкостью может это объяснить другим людям.
  5. «Адаптативный дизайн. Делаем сайты для любых устройств» — данная книга Тима Кедлека очень востребована. Она освещает вопрос о том, как создать универсальный сайт, который будет работать на разных устройствах и экранах любых размеров. Это будет актуально не только для создателей мобильных приложений, но и для веб-разработчиков. Создать адаптивный сайт – это ценный и важный навык в карьере веб-дизайнера.
  6. «Дизайн-мышление: от разработки новых продуктов до проектирования бизнес-моделей» Тима Брауна поможет понять, как зарабатывать и преувеличивать свои финансы.
  7. «Настольная книга веб-дизайнера» от Патрика Макнейла стала очередным инструментом в помощь дизайнерам. Она проведёт вас в мир создания современных сайтов любого предназначения. Автор раскрывает секреты разработки мобильных приложений и интернет-магазинов.
  8. Книга «Искусство цвета» Иоханнес Иттен подробно расскажет о всех тонкостях колористики.
  9. «HTML5 для веб-дизайнеров» — эта книга для тех, кто создаёт веб-страницы и разрабатывает интерфейсы. Благодаря ей вы разберётесь в том, как работать с картинками в JavaScript, использовать разметку, добавлять на сайт различную векторную графику и многое другое.
  10. «Типографика: шрифт, вёрстка, дизайн» Джеймса Феличи приоткроет завесу технических тонкостей при компьютерной вёрстке, выборе и применении различных шрифтов.
  11. «Погружение в HTML5» Марка Пилигрима — это простое руководство для тех, кто хочет изучить современную версию языковой разметки.
  12. «Learning Web Design» Дженнифера Роббинса – данная книга представляет собой целый учебник, где вы освоите не только азы, но и пополните свой словарь веб-дизайнера. Самое ценное — это практические домашние задания. Ведь для того, чтобы закрепить материал, нужно тренироваться, что и предлагает автор.

Книги на английском языке

  1. «Just Ask: Integrating Accessibility Throughout Design». Автор этой удивительной книги делиться знаниями о создании сайтов, сервисов для пожилых людей, а также тех, кто имеет ограниченные возможности. Эти знания помогут сделать проект более универсальным и доступным. Книга совершенно бесплатная.
  2. «Type Classification» — это руководство по шрифтам, где вы узнаете основные классификации, их историю. Наличие фотоматериалов не даст вам заскучать. После этой книги вы с лёгкостью сможете отличать один шрифт от другого.
  3. «Web Designer’s Success Guide». Если вы не знаете, с чего начать новичку-фрилансеру в веб-дизайне, то это руководство точно создано именно для вас. Из него вы узнаете с чего начинать, как находить первых и постоянных клиентов, а также как создавать успешные проекты.
  4. «Web Style Guide» — это ещё одно увлекательное руководство, где рассказано обо всех этапах создания сайтов, критериях успешного дизайна, а также удобствах интерфейса.

ТОП-25 полезных сайтов для веб-дизайнеров

Для тех, кто любит черпать информацию из более современных источников, быть в курсе новостей и всех инноваций, мы подготовили ТОП-25 лучших сайтов. Веб-дизайнер всегда находится в творческом поиске, поэтому изучайте, вдохновляйтесь, развивайтесь!

  • webdesignerdepot.com – интересные новости в пространстве веб-дизайна.
  • ruseller.com – здесь много шаблонов, уроков, особенно для новичков.
  • flatuicolorpicker.com – удобный сервис, который поможет выбрать цвет интерфейса.
  • smashingmagazine.com – на этом портале информация по дизайну и веб-разработке.
  • instantshift.com – ресурс помогает выбрать дизайн для сайта.
  • animator.ru – всё об анимациях и видео.
  • paratype.ru – информация о шрифтах.
  • veerle.duoh.com – профессионально созданный блог. Наполнен качественными профессиональными статьями. Автор предоставляет консультации по web-дизайну.
  • thedieline.com – этот сайт предлагает массу информации по дизайну упаковки.

  • psd.tutsplus.com – полезный портал, который предлагает пошаговые уроки для начинающих.
  • dafont.com – тут вы найдёте более одиннадцати тысяч разнообразных шрифтов на любой, даже самый изысканный вкус.
  • bluevertigo.com.ar – на этом ресурсе предоставлен список самых популярных фотобанков сети.
  • thefwa.com — вдохновляющая подборка сайтов.
  • flasher.ru — всем, кто любит работать с flash-технологиями, сюда, тут масса полезных советов, уроков, вакансий.
  • webdesign.tutorials — самая большая библиотека для веб-дизайнера.
  • psd tuts – тут собраны все лучшие уроки по работе и обучению в Photoshop.

  • оnextrapixel — здесь вы всегда найдёте самые свежие уроки по Photoshop, Illustrator, а также много интересного по теме CSS, WordPress. Как бонус, — масса материалов для вдохновения и новых идей.
  • behance – здесь вы увидите работы популярных и профессиональных веб-дизайнеров со всего мира.
  • аdobe kuler – поможет вам подобрать цветовые схемы.
  • brusheezy – на этом ресурсе можете выбрать любые кисти для фотошопа.
  • logoinstant – отличный сайт для создания креативных логотипов.
  • 365psd – лучшая коллекция фонов для сайтов на разные тематики.
  • pixelkit.com – огромное количество бесплатных шаблонов.

Заключение

Уверены, мы смогли вам помочь в поиске стоящей литературы и качественных ресурсов как для настоящих гуру, так и для тех, кто только начинает свой путь в этой удивительной и интереснейшей профессии. Этого набора вполне будет достаточно, чтобы заняться самообучением веб-дизайну и совершенствованием своих навыков.

Если данная статья помогла вам в увлекательном путешествии в профессию веб-дизайнера, то обязательно поделитесь этим в комментариях.

Всего вам доброго!

подпишись и начни получать лучшие статьи первым

Подписаться

Подписалось уже 6999 человек

iklife.ru

читать книгу или смотреть видео уроки

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

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

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

Надеюсь, вы не только прочитайте мой труд, но и подключитесь к дискуссии. Оставляйте свои комментарии к этой статье.

Web-дизайн для «чайников»

Давным-давно меня начала преследовать книга Лайзы Лопак, тут и там мне предлагали ее скачать в fb2, epub, pdf и так далее. На тот момент меня это не слишком интересовало. Однако, информация с названием плотно засела у меня в голове. Чуть позже я начал сам ее искать.

Сначала, как водится, прочитал уйму отзывов. Это укрепило мой интерес, хоть я и не слишком доверяю комментариям, начинающимся со слов «Вы когда-нибудь задумывались о создании сайтов?».

Я не понимаю, как это видят авторы этих самых отзывов? Представляете, купил такой вот мадмуазель муж пельменей, просит прокомментировать, она бегом переодевается в платье советских времен, красит губы красной помадой и начинает восторженно лепетать: «Эти прекрасные пельмени не содержат вредных компонентов, массовая доля мяса достигает свыше 70%, а изысканный вкус с легкой перечной горчинкой!». Ужас, да и только.

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

Я не слишком доверяю не только комментариям, но и ссылкам со странных порталов. Качать мне ничего не хотелось, а стоило кликнуть на «читать онлайн», как возникал серый экран смерти. Ничего не отвечало.

Я уже нашел тысячу оправданий: «Книга устарела и поэтому доступ прикрыли», «Ну что они мне могут рассказать издание 2008 года», «Наверное, вот-вот выйдет современное переиздание». И тут я наткнулся на бесплатную ссылку Вконтакте. Открыл книгу и было меня уже не остановить. Знаете, редкий случай, когда мне настолько нравится литература для начинающих. Читается очень быстро и увлекательно.

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

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

Почему лично мне было это интересно? Коротко, ясно и структурировано. Все о чем я давно знал начало укладываться в единую схему. Я как будто свои статьи читал, но не от одной к другой, а по порядку, как они создавались. В общем, я рекомендую.

Если не хотите тратить время на сбор сведений со всего интернета, то вот вам отличный альтернативный вариант. Если год все-таки смущает, могу предложить список самых популярных книг по web-дизайну для начинающих.

Или все-таки видео

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

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

Еще один миф, это топовость автора. Мол, если человек действительно зарабатывает по 80-120 тысяч за сайт ему и в голову не придет тратить время на создание роликов. И так проблем хватает.

Опять-таки, на Нетологии обучением начинающих веб-дизайнеров занимаются директора крупных московских компаний, именитые специалисты. Помимо этого, они постоянно посещают мероприятия такие как «Кинза», популярный съезд профессионалов интернет-бизнеса. Зачем они это делают? Дополнительный доход, PR, привлечение новых клиентов, а также элементарная смена деятельности.

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

Курс называется «Секреты веб-дизайна». В нем вы можете узнать все то же самое, что и в книге Лайзы Лопак, но в дополнение получить информацию о конкретном опыте действующего дизайнера Алексея Захарова.

Книги создаются профессиональными авторами, а курсы специалистами. Записывать видео легче, чем писать. Времени уж точно уходит меньше.

Я не могу сказать что лучше. Все дело в формате. Кому что ближе. К примеру, я не признаю аудиокниги, не воспринимаю сведения. Другим тяжело сидеть и читать концентрированную информацию. Третьи охотнее посмотрят фильм, и ни за что не ставят себя включить обучающий ролик.

У каждого метода есть и свои плюсы. Мне интересно смотреть конкретную информацию в сочетании с интересными фактами из жизни профессионалов. Без них курсы не обходятся. Мне нужен контакт. Другие по несколько раз перечитывают одни и те же фразы, подчеркивают, запоминают и в случае чего обращаются к конспекту. Третьи спокойно едут в машине или смотрят в окно, пока им в уши вливается ценная информация.

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

start-luck.ru

25 советов начинающим веб-дизайнерам — Лайфхакер

Никита Обухов

Дизайнер. Основатель сервиса Tilda Publishing. Руководитель дизайн-студии FunkyPunky. Куратор курса по веб-дизайну в Британской высшей школе дизайна.

Это учебник нового формата, в котором знания и опыт, накопленные за 15 лет работы в вебе, систематизированы и упакованы в 20 увлекательных лонгридов, написанных простым языком.

1

Создание сайта — это технология

Каким бы творческим ни было задание, успех в создании сайта — это дисциплина. Соблюдение сценария производства сайта и выдерживание последовательности — некоторая гарантия получения удовлетворительного результата.

2

Нельзя работать над проектом, который ты ненавидишь

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

3

Любая разработка начинается с боли и неудовлетворённости

Если исходить из того, что дизайн — это решение проблем, то дизайнеры — это «проблеморешатели». Чтобы устранить проблему и найти эффективное решение, нужно сначала провести исследование и точно определить проблему, затем сфокусироваться на конкретных «болевых точках». Для этого нужно понять, что делают люди, для которых вы создаёте сайт, зачем они это делают, как они видят окружающий мир, какие у них ценности и потребности.

4

Умение слушать — первое, чему следует научиться дизайнеру

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

Нужно понять мир, в котором существует человек. У каждого из нас есть уникальный опыт (события, которые мы пережили), который детерминирует наше отношение к миру. Часто мы говорим: «Да, я это знаю, мне всё понятно». Но оказывается, что разница кроется в деталях и она может быть принципиальной. Поэтому, когда мы слушаем человека, нужно постараться вжиться в его образ, как это делают актёры. Почувствовать себя на его месте.

Иллюстрация из лекции об эмпатии курса «Дизайн в цифровой среде». Автор: Юлия Засс

5

Идея требует времени

После того как вы сформулировали задачу, не терзайте свой мозг, дайте время подсознанию найти решение.

Переключитесь на другую задачу, а ещё лучше возьмите паузу: займитесь спортом, погуляйте по городу, пообщайтесь с друзьями. Совет не новый, но он действительно работает — через какое-то время идея обязательно появится.

6

Используйте майндмэппинг для генерации идей

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

7

Проводите исследования

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

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

8

Смотреть картинки — это работа

Для хорошего дизайнера просмотр профильных ресурсов — ежедневная рутина, такая же обязанность, как рисование макетов. В вашей голове должны уложиться сотни стилей и направлений. Арт-директор отличается от начинающего дизайнера не только тем, что он сделал сотни сайтов, но и тем, что арт-директор элементарно много видел. Он видел всё.

Фото: Tilda Publishing

9

Следите за трендами

Дизайнер — это проводник развития визуальной культуры, поэтому важно находиться в современном контексте.

Модный сайт не самоцель, но избегайте устаревших решений. Сегодня они могут сойти за здоровый консерватизм, но мир так быстро меняется, что через полгода ваша работа будет выглядеть динозавром.

10

Хороший дизайн — это результат вашего саморазвития и самообразования

Не переставайте учиться. Мир меняется очень быстро, и если вы хотите выигрывать конкуренцию, то нужно постоянно узнавать новое. Следите за трендами, изучайте теорию дизайна, чтобы понять фундаментальные вещи. Это поможет найти смысл в том, что вы делаете. Хороший дизайн начинается не в компьютере, а в вашей голове. Заполните её качественными знаниями.

11

Учитесь не только веб-дизайну

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

Дизайнер всё время решает разные задачи, и чем больше вы будете разбираться в разных областях, тем будет легче общаться с коллегами и заказчиками. Вам придётся ставить задачи для иллюстратора или фотографа, и проще это будет сделать, когда вы сможете быстро собрать референсы и показать, что вы хотите увидеть.

12

Направляйте критику в конструктивное русло

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

13

Найдите вдохновляющих людей

Подпишитесь на Twitter, Facebook или блоги дизайнеров, чьи работы вас впечатляют. Следите за тем, чем они делятся. Профессионалы обычно являются распространителями качественной информации, и через них можно узнавать что-то новое. Наблюдая за ними, вы поймёте, как они мыслят, и сможете перенимать их систему ценностей.

Скриншот Twitter-аккаунта Стефана Загмайстера

14

Не жалейте времени на хорошую композицию

Композиция — это основа любого визуального продукта. Плохая композиция испортит работу, даже если техника в деталях будет совершенной.

Людей давно соблазняет мысль рассчитать идеальные пропорции математически (канон Виллара де Оннекура, ряд Фибоначчи и так далее). Но никакие цифры не позволят создать такую композицию, которую вы почувствуете, раз за разом меняя положение объектов. Это непросто, требует навыков и опыта, но это самый интресный и плодотворный способ.

15

Ограничьте цветовую палитру

Цвет — это просто. Это такая супербазовая единица, как буква. Но это не значит, что нужно покрасить всё в разные цвета. Наоборот, используйте один цвет, который займёт 80–90%, и дополнительный цвет в качестве акцента. Один — лучший вариант. Три использовать нельзя. Два — очень аккуратно.

16

Подключите фирменный шрифт

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

17

Используйте сетку как вспомогательный инструмент

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

18

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

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

Фото: Tilda Publishing

19

Итерации — основа хорошего дизайна

Большее количество итераций ведёт к более верному решению. Вы отходите от широкой концепции к конкретным решениям, которые помогают реальным людям сделать их жизнь удобнее и комфортнее.

20

Главный навык дизайнера — уметь рассказать историю

Навык рассказывания историй стоит освоить. Сейчас это новый формат, но скоро он станет привычным и естественным. Слово «сторителлинг» используется в разных контекстах. Например, у актёров свое понятие сторителлинга — определённая последовательность изложения, где есть завязка, кульминация и развязка.

В веб-дизайне под сторителлингом мы понимаем способ подачи информации. Цифровой сторителлинг — сочетание контента и интерфейса.

21

Рисуйте каждую страницу как Landing Page

В идеале Landing Page — это страница, где человек получает ответы на все ключевые вопросы по услуге или продукту без перехода на другие страницы. Формат Landing Page появился как способ увеличить конверсию при рекламе, но постепенно те принципы, которые сложились в формате Landing Page, стали распространяться и на страницы в целом.

22

Добавьте «воздуха»

Даже сейчас, когда простота стала трендом, самой распространённой ошибкой начинающих дизайнеров остаётся желание уместить на небольшой площади слишком много информации. Особенно это касается обложки (первого экрана), на которую почему-то стараются поставить вообще всё.

Не бойтесь увеличить отступы, не скучивайте элементы. Пользователь гораздо легче и лучше воспримет информацию, если выдавать её дозированно.

23

Не перегружайте меню

Один из признаков хорошего сайта — понятная навигация. Меню поможет её организовать. Добавив меню, убедитесь, что оно визуально хорошее: не слишком большое, не перегружает всю страницу. Пунктов меню не должно быть много, лучше всего не больше пяти. Смело укрупняйте разделы. Названия делайте короткими. Три слова как пункт меню явно не годятся. Они должны считываться с первого взгляда.

Скриншот сайта дизайн-студии Surf

24

Продавайте себя, а не портфолио работ

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

25

Увлеките пользователя продуманной типографикой

Контент должен быть хорошо оформлен. Недостаточно просто выложить кусок текста — нате, читайте! Вниманием читателя нужно управлять. Используйте приёмы из графического дизайна.

Большие заголовки, использование ультратонких начертаний шрифтов, интересные комбинации шрифтов, которые задают стиль сайта, — всё то, что раньше было характерно для печати, перешло в веб и адаптировалось под новый формат.

Теоретический курс «Дизайн в цифровой среде» можно почитать тут.

lifehacker.ru

Comments