Основные возможности платформы Hexlet не доступны в вашем браузере. Пожалуйста, обновитесь.

Основы HTML, CSS и веб-дизайна

Курс посвящен базовым концепциям веб-дизайна, языка разметки HTML и CSS. Мы научимся делать статические веб-страницы, задавать стили элементам, думать о пространстве и расстояниях, работать с документом в браузере с Developer Tools, публиковать страницы в интернете и интегрировать их с социальными сетями.

Сначала рекомендуем пройти курс: Введение в веб-разработку

Уроки курса

  • 1

    Верстальщик vs. веб-дизайнер

    Цель: Познакомиться с курсом и рассмотреть специальности «верстальщик» и «веб-дизайнер» в контексте развития технологий.

    теория (10:23)  
  • 2

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

    Цель: Познакомиться с HTML и попробовать его в деле.

    теория   тесты  
  • 3

    Элементы, теги и атрибуты

    Цель: Изучить простую идею HTML и структуру элементов страницы.

    теория   тесты  
  • 4

    Структура страницы

    Цель: Рассмотреть полную структуру целого HTML-документа, видимые и невидимые теги.

    теория   тесты  
  • 5

    Основы CSS

    Цель: Научиться задавать оформление — стили — элементам HTML-страницы.

    теория   тесты  
  • 6

    Chrome DevTools

    Цель: Познакомиться с Developer Tools и веб-инспектором, удобным инструментом для анализа и редактирования страницы прямо в браузере.

    теория (06:56)  
  • 7

    Каскад

    Цель: Понять принцип, по которому стили собираются в один набор из разных источников.

    теория   тесты  
  • 8

    div, span и display

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

    теория  
  • 9

    Правило близости

    Цель: Рассмотреть один из базовых принципов дизайна: правило близости или grouping/proximity principle.

    теория   практика  
  • 10

    Размещение на Github Pages

    Цель: Освежить память по теме хостинга и разместить статичную страницу бесплатно на Github Pages.

    теория  
  • 11

    Интеграция с соц. сетями и семантический веб

    Цель: Рассмотреть инструменты разметки для лучшей интеграции с социальными сетями.

    теория  
  • Course completed

  • Практика после курса

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

Подробнее о курсе

Учащихся
2591
Сообщений
270
Упражнений
0
Часов
2