Как создать свой первый профессиональный дизайн сайта с нуля

веб-дизайн

От автора: 6 бесплатных видеоуроков покажут Вам, как нарисовать обалденный дизайн сайта с нуля. Если сейчас у Вас найдётся 5 минут, то через 2 часа вы будете прыгать от радости, создав свой первый профессиональный дизайн!

Урок 1. Разметка макета.

Тема: Веб-дизайн

Время ролика: 08:32

Cложность: легкая

Прикладные программы: Adobe Photoshop CS5

Автор: Захаренко Алексей

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Узнать подробнее

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

Урок 2. Рисуем логотип и меню.

Тема: Веб-дизайн

Время ролика: 24:43

Cложность: легкая

Прикладные программы: Adobe Photoshop CS5

Автор: Захаренко Алексей

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

Урок 3. Начало работы над композицией.

Тема: Веб-дизайн

Время ролика: 16:16

Cложность: легкая

Прикладные программы: Adobe Photoshop CS5

Автор: Захаренко Алексей

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

Урок 4. Добавляем деталей в композицию.

Тема: Веб-дизайн

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Узнать подробнее

Время ролика: 24:00

Cложность: легкая

Прикладные программы: Adobe Photoshop CS5

Автор: Захаренко Алексей

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

Урок 5. Доводим композицию до совершенства.

Тема: Веб-дизайн

Время ролика: 38:14

Cложность: легкая

Прикладные программы: Adobe Photoshop CS5

Автор: Захаренко Алексей

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

Урок 6. Работаем над контентом и подвалом.

Тема: Веб-дизайн

Время ролика: 15:21

Cложность: легкая

Прикладные программы: Adobe Photoshop CS5

Автор: Захаренко Алексей

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

Ваши пожелания, отзывы и рекомендации оставляйте в комментариях!

Автор: Алексей Захаренко

Редакция:Команда webformyself.

JavaScript. Быстрый старт

Изучите основы JavaScript на практическом примере по созданию веб-приложения

Узнать подробнее

Веб-дизайн. Быстрый старт

Изучите курс и узнайте, как создать дизайн и протопип сайта в Figma!

Смотреть видео

Метки:

Похожие статьи:

Комментарии Вконтакте:

Комментарии Facebook:

Комментарии (84)

  1. Eric

    Алексей, огромное спасибо за представленный бесплатный курс! Я скачал уроки и теперь осваиваю их. Параллельно осваиваю Фотошоп. Я никогда не занимался такими делами, но мне почти все понятно. Меня интересует та программа, в которой вы написали курс (?), иногда хочется его замедлить, но не получается. Некоторые вещи вы не поясняете, видимо это рассчитано на владеющих основами пользователей. У меня открыт хостинг, я теперь хочу ее заполнить. Как освою эти уроки, приду к вам за следующими. Удачи ВАм!
    Начинающий волшебник, Eric.

  2. Михаил

    Хороший урок.Всё вполне доступно.Жду следующих уроков.Нарисовал сразу на свою тему.Теперь активировать все переходы и наполнить дальнейшим контентом.
    Спасибо!

  3. Евгений

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

  4. Наталья

    Для новичка все очень сложно было понять вообще о чем говорят. Даже слова.

  5. Максим

    Как уже надоели эти всплывающие окна. И на данном сайте в том числе. Только начнешь читать, как появляется эта навязчивость. Весь интерес к сайту пропадает… и… прочь отсюда…

  6. Сергей

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

  7. Ольга

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

  8. Анна

    Я очень благодарна проекту webformyself за качественный, невероятно полезный контент, который к тому же совершенно бесплатный! Ребята, вы такие молодцы! Желаю вам успехов и процветания, а при таком подходе к делу так и будет! СПАСИБО!

  9. Татьяна

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

  10. Игорь

    Спасибо за бесплатный курс! Очень понравился. Дал сыну, 14 лет, быстро освоил, теперь не оторвать от компа. Такой же курс по созданию полиграфической рекламы, и вот готовый курс по фотошопу. Удачи Вам.

  11. stan46

    Уроки скачал, на всякий случай скопировал в Ворде описание, сделал скриншоты, разместил всё это в специальной папке и отложил до лучших времён — нет времени, хотя тема очень интересная.
    С уважением.

  12. Николай

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

  13. Дима

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

  14. Денис

    прошу прощения, но задам вопрос: а зачем Вы второй раз выложили данный курс? Я его проходил гдето месяцев 5 назад

  15. Аркадий

    Этот курс «прошёл» в прошлом году. Огромное спасибо Лёше Захаренко. Свой первый сайт «рисовал» после изучения этого курса. Тема применения Фотошопа в сайтостроении для меня бла новой. Ещё раз спасибо.

  16. Vera

    Этот курс будет очень полезен начинающим.
    Я скачала его, но до конца не прошла пока. В данный момент я делаю свой сайт на Word Press и пытаюсь изменить имеющийся шаблон WP. Может быть, стоит четко определить задачи подобного эскизирования — возможно, человеку, который пока позиционирует себя только как творец экрана, стоит дать некоторые общие рекомендации по данной работе, чтоб программисту потом было удобно с кодом. Кучу всего теперь выполняет CSS3 из того, что раньше было картинкой. Я благодарю команду Web for myself за множество полезных уроков, доступных бесплатно. Для малых (и больших) городов нашей Родины очень важно иметь такой источник информации. Уровень подготовки у всех разный. Предлагаю создать глоссарий на сайте, чтоб человек мог посмотреть значение непонятных слов. Может быть — из глоссария сразу же несколько ссылок по связанным темам. Может быть, сначала составить список подобных запросов.

  17. Виктор

    Спасибо, ребята, хороший материал!На пятёрку!

  18. Виктор

    Спасибо, ребята, материал качественный! На пятёрку!

  19. Елена

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

  20. oleg(waterjet)

    Видео урок отличный. Я получил много нового.
    Побольше бы таких видео уроков. Жду с нетерпением.

  21. sergey

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

  22. Светлана

    Ребята, огромное спасибо! Курс отличный!!!Все понятно, доступно, информативно, ничего лишнего. Спасибо!!!!!!!!!!!!

  23. Рано

    Ребята, спасибо большое . Я учу уроки медленно, т.к. в компьютере еле еле разбираюсь. Потихоньку получается. Спасибо большое!

  24. Alla

    К сожалению, я не смогла скачать материал, не все уроки извлекаются. Попробую еще раз. Спасибо!

  25. АРТЁМ

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

  26. ирина

    Спасибо.Отличный курс.Пока только скачала.Сегодня засяду осваивать.Скорее всего куплю премиум доступ.Вопрос: В премиум доступ входит платный курс по дизайну или покупается всё отдельно?

  27. Сергей Кудренко

    Спасибо. Очень интересно. Как то с программированием на PHP и JavaScript можно найти полезную информацию. Но профессиональный курс по web- дизайну в Photoshop я как-то не встречал. Смотрел тут давеча курс по web дизайну. Ну это полная тягамотита. У Вас лаконично в темпе и по существу. В общем изучать и изучать. Академия web дизайна.

  28. Игорь

    Данный курс, полностью соответствует всем
    параметрам по созданию сайта.
    Ставлю 5+.
    Желаю вам двигаться, в том же направлении.

  29. frmarina

    Молодцы ребята.
    Так держать, все понятно даже для новичков.

  30. fatcat56

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

  31. Сергей

    Отличный материал все доступно и понятно. После начал верстать макет. Жду новых уроков.
    Спасибо.

  32. Елена

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

  33. Владимир

    Спасибо ребята за уроки , хотя я сайт и делаю пока на Word Press но без Ваших уроков я бы и его не освоил , из всех тем которые я на нем переставил ни одна мне так до конца и не понравилась ,все таки своя с нуля она лучше .Я ее еще сделаю но для начала просто хочу понять как с этим сайтом потом в интернете управляться , и уже пришел к выводу что лучше сайт делать самому чем потом думать как чужой шаблон исправлять . Я с этими шаблонами так еще толку и не добился . Хотя и что то типа сайта есть уже как мне кажется в интернете .Если кто зайдет и посмотрит и даст совет что в нем не так я буду очень рад .Это не окончательный вариант , я его как могу так и «складываю» и чем дальше тем больше пробелов замечаю .Ваши уроки и особенно Ваш сайт в целом практически стали центровыми , после того как я втянулся в это дело посредством других , быстрых на руку ребят .Из за них домен и хостинг уплатил а сайта толкового не сделал вот чтоб деньги не пропадали пришлось что нибудь по быстрячку лепить. Надо было сразу идти по Вашим урокам .Эту ошибку исправлю .И Ваши уроки в этом помогут .И если кто в такой ситуации как я ,меня наверное поймет.И еще согласен с коментарием по поводу непонятных для чайников всех смысловых выражений , используемых в этой сфере ,какой термин что выражает , и где найти что это такое и с чем его употреблять , Что то типа сайтостроительного словаря . Ребята спасибо еще раз .

  34. unio

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

  35. Aleksandr

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

  36. Евгений

    Отличный доходчивый ясный понятный курс.
    Впрочем,как и все остальные курсы и уроки Алексея.Спасибо.

  37. Александр

    Все очень доходчиво, даже для людей с минимумом навыков. Очень радует что курс бесплатный — человеческая меркантильность задолбала. Спасибо. Еще бы продолжение для верстки в html и в шаблон joomla, wordpress.

  38. Маргарита

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

  39. Надежда

    Спасибо за обучение! Всё очень четко и ясно объяснено, но я к сожалению застряла только на 2-ом уроке. С такими темпами до 8-го урока доберусь не скоро.

  40. Гриша

    Тоже,огромное спасибо.Очень полезные уроки.Я тоже не спец но изучаю потихоньку.Скор стану спецом.Спасибо Вам всем огромное.

  41. Николай

    Все супер классно!
    Одно «плохо».
    Каждый урок имеет свой объем в mb., что при определенных ограничениях трафика не дает возможность его скачать.
    Совет: Ребята разбивайте урок на части объемом около 50 mb/, тогда постепенно можно скачать все и с БОЛЬШИМ удовольствием освоить!
    Огромное спасибо!!!!

  42. Rimma

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

  43. Екатерина

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

  44. Виталий

    Это даже не урок а скорее практическая часть создания сайта. Главное доступно, никакой «воды», чисто практика. Одним словом то что нужно!

  45. Эльдар

    Спасибо.Всё доходчиво и ясно,будем осваивать.

  46. Юрий

    Урок по созданию сайта понравился, всё понятно,есть идеи, пробовал воплотить, но даёт о себе знать не очень хорошее, (даже очень не хорошее) знание работы в Фотошоп, буду учиться, это ни когда не поздно, но всегда полезно…, спасибо автору.

  47. Олег

    Для начинающих то, что нужно!

  48. Alex

    В принципе понятно и полезно…………но для освоения досконально и применения необходимы приличные знания фотошоп , да и HTML с CSS в паре,…..а особенно время — которого всегда не хватает…….
    Спасибо………….

  49. Евгений Сибиряков

    Алексей! Большое спасибо за уроки,всё очень просто,доходчиво и емко. Фотошоп надо изучить.

  50. ВЛАДИМИР

    Спасибо за урок! Доступно и понятно изложен. Спасибо автору.