1

Этап 1

Знакомство

2

Этап 2

Структура HTML-документа

3

Этап 3

Разметка текста

4

Этап 4

Ссылки и изображения

5

Этап 5

Знакомство с таблицами

6

Этап 6

Знакомство с формами

7

Этап 7

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

8

Этап 8

Селекторы, часть 1

9

Этап 9

Наследование и каскадирование

10

Этап 10

Оформление текста, часть 1

11

Этап 11

Фоны, часть 1

12

Этап 12

Блочная модель документа

13

Этап 13

Сетки

14

Этап 14

Позиционирование

15

Этап 15

Мастерская: создаём меню

16

Этап 16

Мастерская: декоративные элементы

17

Этап 17

Кексби. Разметка, оформление текста

18

Этап 18

Кексби. Ссылки и изображения

19

Этап 19

Кексби. Знакомство

20

Этап 20

Кексби. Таблицы

21

Этап 21

Кексби. Формы

22

Этап 22

Кексби. Промежуточное испытание

23

Этап 23

Кексби. Сетки

24

Этап 24

Знакомство с HTML5

25

Этап 25

Формы и HTML5

26

Этап 26

Кексби. Разметка, оформление текста

27

Этап 27

Кексби. Ссылки и изображения

28

Этап 28

Селекторы, часть 2

29

Этап 29

Селекторы, часть 3

30

Этап 30

Рамки и фоны, часть 2

31

Этап 31

Игра теней

32

Этап 32

Линейные градиенты

33

Этап 33

Двумерные трансформации

34

Этап 34

Оформление текста, часть 2

35

Этап 35

Анимация

36

Этап 36

Плавные переходы

37

Этап 37

Мастерская: декоративные эффекты на CSS3

38

Этап 38

Таблицы на CSS

39

Этап 39

Кекстаграм: Начало. CSS-фильтры

40

Этап 40

Кекстаграм: Эпилог. JavaScript

41

Этап 41

Флексбокс, часть 1

42

Этап 42

Флексбокс, часть 2

43

Этап 43

Знакомство с LESS

44

Этап 44

Примеси в LESS

45

Этап 45

Знакомство с SVG

46

Этап 46

Оформление SVG-фигур

1

Этап 1

Знакомство

2

Этап 2

Структура HTML-документа

3

Этап 3

Разметка текста

4

Этап 4

Ссылки и изображения

5

Этап 5

Знакомство с таблицами

6

Этап 6

Знакомство с формами

7

Этап 7

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

8

Этап 8

Селекторы, часть 1

9

Этап 9

Наследование и каскадирование

10

Этап 10

Оформление текста, часть 1

11

Этап 11

Фоны, часть 1

12

Этап 12

Блочная модель документа

13

Этап 13

Сетки

14

Этап 14

Позиционирование

15

Этап 15

Мастерская: создаём меню

16

Этап 16

Мастерская: декоративные элементы

17

Этап 17

Кексби. Разметка, оформление текста

18

Этап 18

Кексби. Ссылки и изображения

19

Этап 19

Кексби. Знакомство

20

Этап 20

Кексби. Таблицы

21

Этап 21

Кексби. Формы

22

Этап 22

Кексби. Промежуточное испытание

23

Этап 23

Кексби. Сетки

24

Этап 24

Знакомство с HTML5

25

Этап 25

Формы и HTML5

26

Этап 26

Кексби. Разметка, оформление текста

27

Этап 27

Кексби. Ссылки и изображения

28

Этап 28

Селекторы, часть 2

29

Этап 29

Селекторы, часть 3

30

Этап 30

Рамки и фоны, часть 2

31

Этап 31

Игра теней

32

Этап 32

Линейные градиенты

33

Этап 33

Двумерные трансформации

34

Этап 34

Оформление текста, часть 2

35

Этап 35

Анимация

36

Этап 36

Плавные переходы

37

Этап 37

Мастерская: декоративные эффекты на CSS3

38

Этап 38

Таблицы на CSS

39

Этап 39

Кекстаграм: Начало. CSS-фильтры

40

Этап 40

Кекстаграм: Эпилог. JavaScript

41

Этап 41

Флексбокс, часть 1

42

Этап 42

Флексбокс, часть 2

43

Этап 43

Знакомство с LESS

44

Этап 44

Примеси в LESS

45

Этап 45

Знакомство с SVG

46

Этап 46

Оформление SVG-фигур

29 января 2017 31 мая 2017
Цель просрочена на 2715 дней

Цель заброшена

Автор не отписывался в цели 7 лет 6 месяцев 20 дней

Образование

Пройти всю програму навчання на HTML Academy

Про курс я дізнався менше місяця назад і він одразу потрапив у мій список справ, але розпочинати вивчення я не поспішав. Та от повернувшись до начання в коледжі (після канікул), в новому розкладі з'явилася пара "Веб програмування", що не могло мене не радувати. І я подумав що чудово булоб "поєднати" вивченя ВЕБ-у на парах та в HTML Academy. Тому в Академії я вчитиму нові матеріали і виконуватиму тести по програмі, а вколеджі виконуватиму лише обов'язкові завданнян (лабораторні, практичні).

Побачу, що з цього вийде. Та всеодно я впевнений, що це хороша ідея!

Ах,мало не забув! Загальна вартість мети зовсім не така. Я просто ще не знаю скільки часу у мене забере вивчення всієї програми HTML Academy, тому кожен платний курс помічаю місячною вартістю навчання. Хоча пізніше постараюся придумати як це виправити, наприклад за місяць я проходитиму по 4-6 курсів, тому вартість місячного навчання можна буде поділити на кількість курсів.

 Критерий завершения

Програма засвоєна і я можу створити сайт на основі здобутих знань

 Личные ресурсы

час, а також гроші на підписку по 100 грн в місяць

 Экологичность цели

доведу навики створення сайтів до хорошого рівня

  1. Знакомство

    Познакомимся с интерфейсами Академии. А заодно рассмотрим базовые понятия вёрстки.

  2. Структура HTML-документа

    Создаём простейшую HTML-страницу, разбираемся из каких тегов она состоит и за что эти теги отвечают. Подключаем к странице CSS-стили и JS-скрипты.

  3. Разметка текста

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

  4. Ссылки и изображения

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

    1. Что такое ссылка?

    2. Задаём адрес ссылки

    3. Абсолютные адреса

    4. Относительные адреса

    5. Ссылка на файл

    6. Ссылка на изображение

    7. Ссылка с якорем

    8. Всплывающая подсказка

    9. Добавим изображение

    10. Размеры изображения

    11. Альтернативный текст

    12. Изображение-ссылка

    13. Фоторепортаж

  5. Знакомство с таблицами

    Узнаем из каких тегов состоит таблица и как управлять количеством строк и столбцов. Научимся оформлять таблицы: задавать рамки, фон строк, размеры столбцов, выравнивать текст внутри ячеек. И самое главное — разберёмся, как объединять ячейки.

    1. Простейшая таблица

    2. Добавляем строки

    3. Добавляем столбцы

    4. Задаём рамки с помощью CSS

    5. Улучшаем отображение рамок

    6. Горизонтальные и вертикальные рамки

    7. Отступы внутри ячеек

    8. Отступы между ячейками

    9. Испытание: простая, но аккуратная таблица

    10. Ячейки-заголовки

    11. Заголовок таблицы

    12. Объединяем ячейки в строках

    13. Объединяем ячейки в столбцах

    14. Закрепление colspan

    15. Закрепление rowspan

    16. Комбо: colspan + rowspan

    17. Испытание: таблица посложнее

    18. Выравнивание содержимого в ячейках

    19. Добавим цвета

    20. Раскрашиваем строки

    21. Задаём размеры таблицы

    22. Задаём размеры отдельных ячеек и столбцов

    23. Испытание: итоговая таблица

  6. Знакомство с формами

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

    1. Первая форма

    2. Текстовое поле ввода

    3. Идентификатор и значение по умолчанию

    4. Подпись для поля ввода

    5. Связываем подпись и поле по id

    6. Добавим ещё одно поле

    7. Поле для ввода пароля

    8. Кнопка отправки формы

    9. Многострочное поле ввода

    10. Чекбокс или «галочка»

    11. Испытание: форма регистрации

    12. Переключатель или «радиобаттон»

    13. ...

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

    Посмотрим на базовые понятия CSS: селекторы, каскадность, наследование, приоритеты. Взглянем на некоторые CSS-свойства для оформления текста, создания сетки страницы и позиционирования элементов.

  8. Селекторы, часть 1

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

  9. Наследование и каскадирование

    Наследование, каскадирование, специфичность: что это и как их правильно использовать?

  10. Оформление текста, часть 1

    Разберёмся с самыми распространёнными CSS-свойствами для оформления текста: жирность, курсив, размер, цвет и многое другое.

  11. Фоны, часть 1

  12. Блочная модель документа

  13. Сетки

  14. Позиционирование

  15. Мастерская: создаём меню

  16. Мастерская: декоративные элементы

  17. Кексби. Разметка, оформление текста

    Добавляем в разметку текстовые теги: заголовки, списки, цитаты.

    Вартість = $/міс підписки

  18. Кексби. Ссылки и изображения

    Вставляем содержательные картинки и добавляем ссылки.

    Вартість = $/міс підписки

    1. Хедер и футер. Теги header и footer

    2. Основное содержание. Тег main

    3. Разделы страницы. Теги article и SECTION

    4. Изображения в формате SVG

    5. Навигация. Тег nav

    6. Завершаем футер

    7. Использование нестандартных шрифтов

    8. Подробнее о шрифтах. Правило @font-face

    9. Дополнительное содержание. Тег aside

    10. Еще раз про article. Анонс поста

    11. Завершаем главную: наполнение

    12. Внутренняя страница: структура поста

    13. Даты для людей и машин. Тег time

    14. Картинки с подписями. Теги figure и figcaption

    15. Видео. Тег video

    16. Форматы и источники видео

    17. Аудио. Тег audio

    18. Форматы и источники звука

    19. Испытание: другой вариант главной

  19. Кексби. Знакомство

    Размечаем основные блоки главной страницы магазинчика Кекса.

    Вартість = $/міс підписки

  20. Кексби. Таблицы

    Создаём таблицу прайс-листа и задаём ей базовое оформление.

    Вартість = $/міс підписки

  21. Кексби. Формы

    Завершаем разметку страницы формой вопросов.

    Вартість = $/міс підписки

  22. Кексби. Промежуточное испытание

  23. Кексби. Сетки

  24. Знакомство с HTML5

  25. Формы и HTML5

  26. Кексби. Разметка, оформление текста

  27. Кексби. Ссылки и изображения

  28. Селекторы, часть 2

  29. Селекторы, часть 3

  30. Рамки и фоны, часть 2

  31. Игра теней

  32. Линейные градиенты

  33. Двумерные трансформации

  34. Оформление текста, часть 2

  35. Анимация

  36. Плавные переходы

  37. Мастерская: декоративные эффекты на CSS3

  38. Таблицы на CSS

  39. Кекстаграм: Начало. CSS-фильтры

  40. Кекстаграм: Эпилог. JavaScript

  41. Флексбокс, часть 1

  42. Флексбокс, часть 2

  43. Знакомство с LESS

  44. Примеси в LESS

  45. Знакомство с SVG

  46. Оформление SVG-фигур

    Базовые понятия об оформлении SVG-фигур. Заливки и обводки

  • 2367
  • 29 января 2017, 07:49
Регистрация

Регистрация

Уже зарегистрированы?
Быстрая регистрация через соцсети
Вход на сайт

Входите.
Открыто.

Еще не зарегистрированы?
 
Войти через соцсети
Забыли пароль?