Стать веб-дизайнером

Список литературы

1. 100 принципов дизайна

2. Интуитивный веб-дизайн

3. Пиши, сокращай. Как создавать сильный текст

4. Психология влияния

5. Искусство цвета

6. Воронка продаж в интернете

7. Отзывчивый веб-дизайн

8. Эмоциональный веб-дизайн

9. Основы контентной стратегии

10. Сначала мобильные!

11. CSS3 для веб-дизайнеров

12. HTML5 для веб-дизайнеров

13. Дизайн – это работа

14. Контентная стратегия для мобильных устройств

15. Создаем динамические веб-сайты с помощью PHP, MySQL, JavaScript, CSS и HTML5

16. React.js. Быстрый старт

17. Пользовательские стратегии. Искусство гибкой разработки ПО

18. UX-стратегия. Чего хотят пользователи и как им это дать

19. Разработка пользовательских интерфейсов

20. Основы разработки веб-приложений

21. The best interface is no interface: The simple plan to brilliant technology

22. Mobile Usability

23. Smashing UX Design

24. Mobile Design Book

25. The elements of user interface: User-centered design for the web and beyond

26. About face: the essentials of interaction design

27. Ководство

28. Не заставляйте меня думать

29. UX-дизайн. Практическое руководство по проектированию опыта взаимодействия

30. Дизайн привычных вещей

31. Умный дизайн. Простые приемы разработки пользовательских интерфейсов

32. Donald Norman “Emotional Design: Why We Love (or Hate) Everyday Things” (эмоциональная сторона проектирования)

33. Tim Ash “Landing Page Optimization: The Definitive Guide for Testing and Turning for Conversation” (проектирование страниц маркетинговых сай

Необходимые программы

1. Adobe Photoshop

2. Adobe Illustrator

3. Adobe XD

4. Adobe AfterEffects

HTML и CSS верстка

1. Базовая HTML-разметка

2. Знакомство с CSS

3. Блочные и инлайновые элементы

4. Семантическая разметка документа

5. Управление блоками в потоке

6. Позиционирование блоков

7. CSS-селекторы

8. Стили текста и оформления

9. Стили позиционирования, отступы и размеры блоков

10. Сетки

11. Процесс верстки сайта

12. Оформление кода

13. Работа с Photoshop, верстка в соответствии с макетом

14. Возможности JavaScript

15. Знакомство с Front-end

16. Знакомство с Back-end

Знакомство с основами веб-дизайна

1. Введение в профессию

2. Модульные сетки

3. Скетчинг и прототипирование

4. Пользовательское взаимодействие

5. Композиция

6. Веб-типографика

7. Теория цвета

8. Применение цвета в веб-дизайне

9. Адаптивный дизайн

10. Веб-анимация

11. Системы ведения проектов

12. Составление технического задания

13. Подготовка портфолио

Проектирование интерфейсов (UX)

1. Введение в предметную область

2. Азбука пользовательского интерфейса

3. Психофизиология восприятия интерфейсов

4. Методология командной работы

5. Качественные исследования аудитории

6. UX-стратегия

7. Информационная архитектура

8. UX-дизайн

9. Карты пользовательских сценариев и прототипы

10. Инструменты прототипирования

11. UI-дизайн

ПРАКТИКА: Разработка и прототипирование интерфейсного решения

Верстка адаптивного макета

1. Верстка резинового макета

2. Резиновые изображения

3. Введение в медиа-запросы

4. Медиа-функции

5. Особенности верстки для мобильных устройств

6. Адаптивная графика

7. Breakpoints

8. Адаптивные изображения

ПРАКТИКА: Проектирование, дизайн и верстка веб-сервиса

Типографика - продвинутый уровень

1. Особенности экранных шрифтов

2. Размер шрифта для OSX и Windows

3. Особенности лицензирования шрифтов

4. Подбор шрифтовых пар, составление композиций

5. Ошибки в работе со шрифтами

6. Тренды в типографике

7. Иерархия текста

8. Работа с модульными сетками

9. Создание ритма и пространства в макетах

10. Пропорции и отступы

11. Типографика и композиция

Копирайтинг

1. Введение в контент-маркетинг: задача контент-стратегии

2. Анализ целевой аудитории и конкурентов

3. Азы писательского искусства

4. Проверка и редактура. Сервисы, которые упрощают работу

5. SEO тексты

6. Продающий текст — виды, особенности, техники

7. Эффективные заголовки

8. Призыв к действию

9. Email-маркетинг

ПРАКТИКА: Верстка лонгрида

Инфографика

1. Подготовка данных к анализу

2. Типы данных и виды графиков

3. Введение в инфографику и визуализацию данных

4. Онлайн и офлайн инструменты

5. Создание интерактивной инфографики

6. Основы картографии

7. Сторителлинг в инфографике

8. Этапы создания инфографики

9. Мультимедийные истории

10. Анимация в инфографике

ПРАКТИКА: Создание инфографики с нуля

Анализ пользовательских потребностей (UI)

1. Инструменты дизайн-мышления

2. Бизнес-анализ

3. Методы анализа

4. Феномены зрительного восприятия

5. Моделирование поведения

Инструменты usability-тестирования

1. Качественные исследования

2. Количественные исследования

3. Отбор аналитических инструментов

4. Мобильная аналитика

5. Математика А/В тестов

6. Accesibility-статистика

7. Eyetracking-тестирование

ПРАКТИКА: Комплексный ux-анализ сайта

Брендинг

1. Брендинг и брендбук

2. Анализ рынка и платформа бренда

3. Коммуникационная стратегия бренда и реклама

4. Нейминг и слоган

5. Фирменный стиль

6. Логотип

7. Брендбук

8. Гайдлайн

Медиадизайн

1. Поиск идеи для истории

2. Структура истории

3. Тренды в иллюстрации

4. Пиктограммы

5. Анимация

ПРАКТИКА: Визуальная концепция бренда

Дизайн мобильных интерфейсов

1. Принципы дизайна мобильных интерфейсов

2. Анатомия iOS приложения

3. Принципы проектирования UX для мобильных устройств

4. Основные принципы Material Design

5. Анимация интерфейсов - микровзаимодействия

6. Сетка и цвет в дизайне мобильных интерфейсов

ПРАКТИКА: Дизайн сайта/приложения для мобильного устройства

Front-end разработка (JavaScript, библиотека React.js)

1. Git — система контроля версий

2. Git — организация рабочего процесса

3. Циклы и массивы

4. Объекты и контекст вызова функции

5. Редакции и стандарты

6. Рабочее окружение

7. Unit-тестирование

8. Функции и замыкания

9. Прототипы, конструкторы

10. Классы, наследование

11. Контейнеры

12. Promises, async/await

13. Символы, итераторы, генераторы

14. Модули

15. Работа с DOM

16. Работа с HTTP (jsonp, fetch, async/await)

17. Работа с формами

18. Обработка событий

19. Drag & Drop

20. Работа с файлами

21. SVG

22. Geolocation, Notification, Media

23. Анимации и CSS

24. EventSource, WebSockets

25. WebWorkers

26. JSX

27. Композиция компонентов

28. Одностраничные приложения

29. Интеграция с React

Back-end разработка (Python или PHP7, там видно будет)

Поисковая оптимизация (SEO)

1. Основы поисковой оптимизации. Определение SEO. Что такое поисковые системы, и как они работают

2. Индексация сайтов. SERP - заголовок, сниппеты, быстрые ссылки. Ранжирование и релевантность

3. Определение целей и задач SEO, методы оценки результатов. wordstat.yandex.ru - статистика поиска

4. Частотность и конкурентность запросов - НЧ, СЧ, ВЧ, ВК, СК, НК

5. Продвижение по позициям. Продвижение по трафику. Лиды и конверсии

6. Составление семантического ядра (СЯ) и формирование структуры сайта. Проверка позиций - программы и сервисы

7. Формирование основных этапов продвижения сайта. Техническая подготовка сайта. Внутренняя оптимизация контента и кода

8. Работа с внешними ссылками. Дополнительные источники трафика

9. Изучение инструментов Яндекс.Вебмастер и Google webmaster - регион сайта, контакты, теги, настройка выгрузки ссылок

10. Файл robots.txt. XML и HTML карты сайта

11. Установка кодов Google Analytics и Яндекс Метрики. Проверка индексации страниц. Доступность сайта роботам Яндекса

12. Выборочная проверка кеша страниц в Google и Yandex. Проверка индексации страниц через инструменты Вебмастера. Проверка использования на сайт

13. Основной и дополнительный индекс Google. Фильтрация неприемлемого содержания

14. Индексация навигационных элементов сайта. Скорость загрузки страниц. Проверка на валидность HTML и СSS

15. Изучение инструментов Яндекс.Вебмастер и Google webmaster - регион сайта, контакты, теги, настройка выгрузки ссылок

16. Взгляд на сайт глазами поискового робота, сравнение с тем, что видит пользователь. Title, Description, Keywords

17. Протокол http, заголовки сервера. Параметр last-modified

18. Несуществующие URL и битые ссылки. Использование канонических ссылок. Дублирование контента внутри сайта. Главная страница. Дубли внутренних

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

20. Аффилиаты. Проверка дополнительных доменов (зеркал). Полные и частичные дубли сайта

21. Редиректы с www и без www. Редиректы страниц со слешем и без слеша

22. Настройка 404 страницы. Анализ страниц и файлов вызывающих ошибки индексации. Проверка и настройка ЧПУ

23. Использование хлебных крошек (breadcrumbs). Фавикон. Разбор наиболее частых технических ошибок оптимизации

24. Внутренняя перелинковка. Классический алгоритм PR, "Вес" ссылки. Trust Runk или "Вес" страницы

25. Схемы перелинковки. Внутренняя оптимизация. Структура html страницы. Релевантность контента. Употребление в текстах ключевых слов

26. Заголовки H1-H6. Выделение ключевых слов в тексте тегами. Оптимизация изображений - размер, аттрибуты alt и title

27. Типы контента и их влияние на ранжирование сайта. Создание ТЗ на тексты. Работа с копирайтерами и текстовыми биржами

28. Проверка уникальности текстов - методология, сервисы, программы. "Оригинальные тексты" от Яндекса

29. Формирование файла-отчета по SEO. Ссылочные доноры и реципиенты. Типы ссылок - текстовые, графические, JavaScript

30. Анкоры ссылок. Контекст ссылки. Взаимные ссылки, схемы обмена ссылками. ТИЦ. Влияние ссылок на ранжирование сайта, НПС. Естественная ссылочн

31. Анализ внешних ссылок. Типы покупных ссылок и способы покупки - арендные ссылки, статьи, новости, постовые в блогах. Составление анкор-листо

32. Параметры качества внешних ссылок. Покупка ссылок вручную у вебмастеров

33. Покупка ссылок в Sape. Покупка ссылок в Seopult. Покупка ссылок в Miralinks. Покупка ссылок в Gogetlinks

34. Основы работы с микроразметкой на примере schema.org. Типы данных schema.org. Разметка страницы контактов. Другие расширенные сниппеты для Я

ФИНАЛЬНАЯ ПРАКТИКА: Fullstack-дизайн для одной компании от разработки бренда до серверной части сайта

Набор портфолио

1. Работа 1

2. Работа 2

3. Работа 3

4. Работа 4

5. Работа 5

ТА-ДАААМ! Выход на биржи фриланса фул-тайм

1. Создание прайс-листа с описанием услуг и их стоимости

2. Подготовка всех материалов для удобной работы, организация рабочего места

3. Регистрация на биржах фриланса

4. Заработано 5 000 р/месяц

5. Заработано 10 000 р/месяц

6. Заработано 15 000 р/месяц

7. Заработано 20 000 р/месяц

8. Заработано 25 000 р/месяц

9. Заработано 30 000 р/месяц

10. Увольнение с текущего места работы