Бесплатный курс «Веб-дизайн и создание сайтов с нуля»
О курсе Авторы Содержание
Команда, которая работала над курсом
Среди авторов эксперты с опытом в международных проектах.
Анастасия Свеженцева
Продуктовый дизайнер (UX/UI), веб-дизайнер и бренд-дизайнер. Опыт проектов в международных компаниях Omega-R (агентство), iSpring Solutions (продуктовая) и со стартапами по всему миру. Преподаватель курсов «UI-дизайн и анимация интерфейсов» и «Веб-дизайн» в Институте программных систем и godesign.
Ольга Жолудова
Копирайтер, UX-писатель, редактор и контент-стратег. Увлекается переводами в tech-тематиках. Помогает собрать гибкую контент-стратегию, улучшить коммуникации с пользователями и проработать tone of voice. Работала с UsabilityLab и «iSpring».
Rafal Tomal
Креативный директор в Authentik Studio, в дизайне с 2005.
Содержание курса
Читайте главы последовательно по одной в день или начните с наиболее интересной.
Глава 1
Веб-дизайн с нуля: что читать и где учиться? | Глава 1
В этом бесплатном курсе вы узнаете, с чего начинался дизайн сайтов, кто такой веб-дизайнер, где на него можно учиться и что такое современный веб-дизайн.
Глава 2
Что должен уметь веб-дизайнер? Главные навыки веб-дизайнера | Глава 2
В прежние времена дизайнер сайта сам и проектировал, и кодил, и запускал сайт онлайн. Но тогда не было множества веб-приложений, а дизайн ограничивался тем, что можно было создать в рамках табличной верстки в HTML.
Глава 3
Зачем учиться программировать непрограммистам? Должен ли дизайнер кодить? | Глава 3
Возможно, вы уже встречали кучу статей на эту тему — но все же это самый популярный вопрос всех начинающих дизайнеров. Воспользуюсь шансом и поделюсь своими соображениями, потому что четкого ответа у меня нет.
Глава 4
Чем занимается веб-дизайнер на самом деле и к чему нужно быть готовым | Глава 4
Дизайн совершенно точно ближе к науке, чем к искусству. Большинство решений в дизайне принимаются исходя из целей бизнеса, но в лучших дизайнерских работах наука встречается с искусством.
Глава 5
5 направлений, в которых веб-дизайнеру нужно развиваться постоянно | Глава 5
Дизайн — одна из тех профессий, где и без диплома можно найти классную работу и даже сделать карьеру. Крупнейшие tech-компании не попросят у вас никаких документов об образовании — если, конечно, вы реально круты в дизайне. ← Назад | Продолжение…
Глава 6
Основные этапы работы над веб-проектом | Глава 6
В самом начале мой рабочий процесс был достаточно хаотичным: я легко отвлекался на разные идеи и вдохновляющие штуки и из-за этого не мог сосредоточиться на основной цели проекта. Не разузнав достаточно о целях и ограничениях проекта, я сразу…
Глава 7
Программы для веб-дизайнера: где создавать сайты? | Глава 7
Дизайн создает не программа, а вы. Если вы владеете дизайном, то сможете сделать работу качественно в любой программе. Однако, правильно подобранные инструменты облегчают процесс дизайна и помогают работать эффективнее. ← Назад (Перед вами бесплатный курс Рафаля Томаля «Интро в…
Курсы веб-дизайна в Казахстане с нуля
История курсанта, который захотел стать дизайнером
Я рос в семье военных: отец, мама, брат, муж сестры работали в силовых структурах. Теперь ещё и я. Не то чтобы у меня не было выбора — меня никто не заставлял и не «пропихивал» на службу. Когда заканчивал 11 класс, бегал с огромными глазами, как и все, думал, что дальше делать и куда идти. Мой отец по специальности инженер-электрик, и раньше я часто ездил к нему на работу, помогал и смотрел, как что работает. Заинтересовался.
Однажды отец рассказал, что в академии РВСН им. Петра Великого есть энергетическая специальность, и предложил попробовать. Меня никто не заставлял — я подавал документы и в гражданские вузы: МГСУ, МЭСИ, ещё куда-то.
У детей военных, которые служат сейчас, есть хотя бы минимальное понимание происходящего в армии. А мои родители в возрасте, на пенсии, и то, что было во времена их службы, уже неактуально. И они живут тем временем — отец до сих пор убежден в псевдостабильности. Думает, что в армии всё супергуд и не слишком поменялось с его службы. Поэтому получилось, что я поступал в академию, имея устаревшие представления об армии. А когда начал сам в этом котле вариться — разочаровался. Пообщался с офицерами и понял, что немногие работают по своей специальности. Нам прямо говорили — какая должность будет свободна, ту вами и «заткнут». Увидел, как военные уезжают в поля и месяц не видят семью. Многие говорят, что армию испортили деньгами, нередко кого-то подсиживают и всё такое. Не захотел вариться во всём этом. Понял, что не моё, и начал искать себя в другой стезе. Уйти оказалось непросто — в меня вцепились и до сих пор не хотят отпускать.
Я уже закончил академию, работаю по распределению в Тагиле. Военная служба меня не устраивает уже давно: сейчас я на особом режиме, но есть ребята, которые уезжают в поля и две недели их нет дома. И я думаю — оно мне надо? Кажется, нет.
Пытался отчислиться ещё в академии, но у меня ничего не вышло. Наше министерство обороны считает тебя обязанным, если ты учился бесплатно. Хочешь уволиться — плати за обучение. Если ты учишься гражданском университете по целевому направлению, легко можешь написать заявление на отчисление, и тебе скажут: «Ну ок, плати и уходи». А в военке тебе говорят «Будешь платить деньги, но мы тебя все равно не отпустим». Я доучился и вот уже два месяца пытаюсь уволиться, но мне говорят «Подумай, может еще послужишь? А кто будет родину защищать?». В общем, уйти из армии тяжко.
На третьем курсе академии я заметил, что востребованы профессии, связанные с диджитал. Пробовал заняться рекламой, даже посидел на одной работе, не понравилось. Потом пробовал программирование, но тоже не не заинтересовало. Даже пошел в школу архитектуры и дизайна, на курсы по Photoshop, Indesign и другим редакторам. Так и не доучился, школа не понравилась. Но сама сфера дизайна понравилась — понял, что это интересно и есть возможность зарабатывать. Пошёл учиться, и на втором месяце занятий приключилась история с ноутбуком.
Мы были на пятом курсе в академии, жили в общежитии. Нужно сказать, что в военных учреждениях есть служба защиты гостайны (ЗГТ), и в связи с этим личный ноутбук — серьёзная тема. Всё командование знало, что у нас есть ноутбуки, но не подавало виду — выпускной курс, их трогать не надо, им надо дипломы писать. Но я-то был «рецидивист». Мы увольнялись, пытались отчислиться, нам делали мозги. Я уже учился на курсах веб-дизайнера, и офицеры об этом знали.
В один прекрасный момент меня вызывает начальник, говорит: «Будешь увольняться?» Да, говорю. Тут он достает мой ноут — пока меня не было в комнате, они провели обыск — и вызывает офицера из службы ЗГТ. Говорит: «Изымаем, описываем». Понятно, что у нас на ноутах ничего подозрительно не было, но вообще если находят какую-то запрещенную информацию, это грозит последствиями вплоть до уголовки. Было стрёмно.
Я написал куратору Geekbrains, объяснил ситуацию. Сказал, что нет возможности учиться, и спросил, какие есть варианты. Предыдущий курс я уже полностью оплатил, и куратор ответил, что меня проще перевести на другой поток через несколько месяцев. Так и сделали. Ноутбук мне к тому времени вернули.
Ещё во время учёбы в академии редко, но были проблемы с просмотром вебинаров. Всё устроено так, что задачу поступают сверху, потом спускаются до курсантов и мы сами между собой решаем, кто их выполняет. Когда ты в кругу сверстников, всё проще. Говоришь: «Ребята, у меня тут курсы, за которые я отдал бабки. Давайте я в следующий раз раз схожу, а сегодня у меня занятие». Все относились с пониманием.
Но был другой случай, как раз после того, как меня перевели на другой поток курсов. Мы уехали на стажировку академии на месяц в Йошкар-Олу, и, естественно, я не мог взять с собой ноутбук. Я тогда уже общался с преподавателем Ильей Полянским, и он посоветовал книги, которые нужно прочитать во время стажировки: «Интерфейс» Алана Купера , «Типографика» Эмиля Рудера, «Новая типографика» Яна Чихольда. В общем, я действовал по собственной программе, а курс нагнал, когда приехал домой.
Как я уже сказал, во время учебы начали общаться с Ильей Полянским — сначала по учебе, потом по работе. Дома у меня было достаточно много свободного времени, и я попросил Илью давать мне дополнительные задания, чтобы подтягивать навыки, которые провисают. Он тогда работал в «Инвитро», и там как раз освободилась вакансия дизайнера. Я поинтересовался, что нужно сделать, чтобы попасть туда, Илья накидал теоретические вопросы, которые надо подтянуть. После этого он начал давать тестовые проекты, которые мы сделали вместе.
В итоге Илья дал мне работу в «Инвитро и подтянул ещё в «Ситимобил». В «Инвитро» мы занимались продуктовым дизайном, в «Сити» — коммуникационным. В первом случае переходили на новую дизайн-систему, собирали в соответствии с ней страницы, адаптировали под мобилы. А в «Ситимобил» я с дизайнерами и сммщиками полностью вел соцсети — все рекламные кампании в ВК и Инсте. Плюс у них тогда был проект по «Игре престолов»: выходил последний сезон, и я как раз только пришел в компанию и мы рисовали материалы по сериалу.
Когда я выпустился из академии, курсы ещё не закончились. Я поехал в отпуск, и буквально за две недели случилось сразу два очень неприятных для меня события. «Ситимобил» расширили штат, им стало невыгодно работать с удаленщиками, и меня уволили. А в «Инвитро» пришел новый маркетинговый директор. Она сказала, что они больше не работают с частными лицами, а только с компаниями, и сократила весь отдел дизайна. Я остался без работы буквально в течение недели.
Мы с Ильей продолжали общаться, он подкидывал мне сторонние проекты. Один из крупных — компания «ЛеонМед», они занимаются поставками медоборудования. Илья подкинул мне задачу: сделать презентацию нового оборудования для новых клиентов. С этой компанией работаем до сих пор. Ещё немного поработал в «Альфа-Банке» в коммуникационном дизайне. Им не хватало рук, а я был без работы, и мне подкинули несколько проектов по анимации в соцсетях. Ещё как-то делали заказ для Высшей школы экономики, рисовали им баннеры в соцсети для новых программ обучения. С ВШЭ работаем до сих пор.
Поработал я немного, порисовал, отпуск закончился, и я поехал по распределению академии в Тагил. Здесь стало прям хорошо: Надя Владимирская, наставник на курсах, подкинула мне стажировку в Amber Light, и я до сих пор работаю с этой студией. Надя вообще помогает нам искать работу, сбрасывает в общий чат вакансии. Потом взяли ещё в студию Near, тоже на удаленке и по коммуникационному дизайну. Сейчас намечается ещё кое-что продуктовое.
Проблемы на курсе были не только из-за военной академии. Помню, у меня никак не ладилось с фотошопом. Тогда поставил себе челлендж — рисовать по баннеру в день. Потихоньку выросли руки из нужного места, и я начал мониторить вакансии в ВК и на hh.ru. Помню, тогда в ВК написал парень, сказал, что ему нужен дизайнер-стажер для проекта на Тильде. Преподаватель Артур Громадин тогда тоже делал какой-то проект на Тильде, и я работал с ним. На hh.ru я тоже находил какие-то интересные проекты, но был скромен в профессиональном плане, и меня просто не брали. Один фитнес-клуб написал, что постоянной работы нет, но если что-то будет — напишут, и потом пару раз подкидывали работу по баннерам.
Вообще работодатели смотрят не на сертификаты, а что ты реально умеешь. Можно сказать, что проходил где-то стажировку, но это всё условно. С Ильёй недавно разговаривали на эту тему. На формальное образование мало кто смотрит, если ты сам научился — молодец. Сейчас многие студии гонятся за просмотрами и лайками в Instagram, Dribbble и Behance, при этом абсолютно забивают на пользователя. Им не так важно, чтобы продукт был хороший, как то, чтобы дизайн привлек внимание общественности.
Пока живу в Тагиле, но планирую переезжать обратно в Москву и устроиться дизайнером в штат. Сейчас работаю по всем проектам на удалёнке. Когда прилетают правки, бегу исправлять, весь в мыле — мало ли что, может, кому-то срочно надо. Боялся, что по шапке прилетит, пока мне не сказали: «Чувак, это не армия. Здесь все адекватно относятся ко всему». Есть у меня армейский принцип «умри, но сделай». Это не то чтобы плохая установка, но в таком виде она явно гиперболизирована. Наверное, так проявляется профдеформация.
Основы адаптивного веб-дизайна | Бесплатные курсы Udacity
Бесплатный курс
от
Отличные впечатления на любом устройстве
Об этом курсе
В этом курсе вы изучите основы адаптивного веб-дизайна с помощью Пита ЛеПейджа от Google! Вы создадите собственную адаптивную веб-страницу, которая будет хорошо работать на любом устройстве — телефоне, планшете, компьютере или любом другом устройстве.
Вы начнете с изучения того, что делает сайт адаптивным и как некоторые распространенные шаблоны адаптивного дизайна работают на разных устройствах. Оттуда вы узнаете, как создать свой собственный адаптивный макет, используя тег области просмотра и медиа-запросы CSS. По мере продвижения вы будете экспериментировать с основными и второстепенными точками останова и оптимизировать текст для чтения.
Watch TrailerIncluded in Product
Rich Learning Content
Interactive Quizzes
Taught by Industry Pros
Self-Paced Learning
Course Leads
Cameron Pittman
Instructor
Pete LePage
Instructor
What You Will Learn
урок 1
Почему адаптивный
- Введение в адаптивный дизайн с Питом Лепейджем.
- Почему адаптивный дизайн подходит для любого устройства?
- Удаленная отладка и эмуляция в браузере.
урок 2
Начнем с малого
- Что такое окно просмотра?
- Узнайте об изменении размера содержимого в области просмотра.
- Сенсорные цели и почему они должны быть большими.
урок 3
Наращивание
- Как воспользоваться преимуществами мультимедийных запросов CSS.
- Что такое точка останова и как ее выбрать.
- Как использовать flexbox CSS для изменения макета.
урок 4
Общие адаптивные шаблоны
- Как применить наиболее плавный шаблон.
- Как применить схему перетаскивания столбцов.
- Как применить шаблон смены макета.
урок 5
Оптимизация
- Использование второстепенных точек останова.
- Как оптимизировать расположение текста.
- Как использовать адаптивные таблицы и стратегии работы с ними.
Предпосылки и требования
Вы должны уметь читать и писать HTML и CSS. Вы также должны иметь возможность проверять и изменять веб-сайты с помощью инструментов разработчика браузера (мы используем Google Chrome, но вы должны быть в состоянии выполнить все задачи этого курса с помощью инструментов разработчика любого браузера).
Если вы не знакомы с HTML и CSS или чувствуете, что вам нужно освежить их, начните с нашего Введения в HTML и CSS.
Для этого курса вам не нужно писать JavaScript.
См. Технологические требования для использования Udacity.
Зачем проходить этот курс
То, как люди просматривают веб-страницы, быстро меняется: все меньше и меньше пользователей заходят в Интернет, сидя за столом перед большим монитором с клавиатурой и мышью. Интернетом все чаще пользуются на телефонах, планшетах, носимых устройствах, телевизорах и всем, что между ними. Разрабатывая адаптивный сайт, он будет хорошо выглядеть и хорошо работать независимо от того, какое устройство находится перед вашими пользователями.
На протяжении этого курса вы будете работать над проектом по созданию веб-сайта родного города, который хорошо работает на телефонах, планшетах и настольных компьютерах.
Что я получу?
- видео инструктора
- Учитесь, выполняя упражнения
- , преподаваемые специалистами отрасли
Популярные бесплатные курсы
Введение в Python Programming
Intro to Javascript
Intro to HTMLAMLING
.
Знакомство с TensorFlow Lite
Advanced Android с Kotlin
Центр ресурсов по веб-дизайну | КодHS
Просмотрите наши бесплатные учебные ресурсы и повысьте уровень своих курсов веб-дизайна! Подготовьте учащихся к созданию собственных веб-страниц с использованием HTML и CSS.
Веб-дизайн (Пикассо)
Узнать больше
Веб-дизайн (Матисс)
Узнать больше
Веб-разработка
Узнать больше
Создайте свой собственный курс
Если вы хотите создать свой собственный курс веб-дизайна с нуля или скомбинировать существующий контент CodeHS, вы, безусловно, можете это сделать! Узнайте больше о создании собственного курса на CodeHS.
Руководство по созданию курсов
Web Development Pathway
Web Design (Picasso)
Introduction to Computer Science in JavaScript (Golden)
Web Development
Учебники по веб-дизайну
Учебники — отличный способ освежить в памяти концепцию или заполнить пробелы в содержании, которое может не преподаваться в одном из основных курсов.
Изучите учебники
- Веб-дизайн
- HTML
- Веб-дизайн
- HTML
- Веб-дизайн
- HTML
Демонстрационные программы
- Моделирование DDoS-атаки
- Сделать клавиатуру
- Сделать одеяло
- Стиль доски для игры в бинго с помощью CSS
Кодирование в дикой природе Блог
Предоставьте учащимся реальные связи и образцы для подражания в различных отраслях! Посетите этот блог Coding in the Wild, чтобы поделиться историями людей, которые применяют информатику в своей повседневной работе.
Программирование для веб-разработки
Программирование для художников
Бетси Лам, полнофункциональный веб-разработчик в Threadless
Читать полную статьюПрограммирование для пользовательских веб-приложений
Бранден Ю.
Читать полную статьюРасширение возможностей учащихся с помощью песочницы CodeHS
Читать большеГалактика Метеор Игра
Читать большеЗаписи вебинаров
Вот несколько записей прошлых вебинаров.