Бесплатный курс

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

30377 студентов 1750 сообщений

Последнее обновление: 05 декабря 2022

Включено в курс

11 уроков (видео и/или текст)

1 упражнение в тренажере

18 проверочных тестов

Дополнительные материалы

Помощь в «Обсуждениях»

Чему вы научитесь

Создавать базовую разметку HTML-документа.
Подключать стили для страницы.
Использовать возможности веб-инспектора Chrome DevTools.
Публиковать свой сайт в интернете на хостинге GitHub Pages.
Использовать базовые концепции веб-дизайна.

Описание

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

CSS3 Веб-дизайн HTML5 GitHub Pages вёрстка Developer Tools

Программа курса

Продолжительность 5 часов

1

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

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

теория
2

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

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

теория

тесты
3

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

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

теория

тесты
4

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

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

теория

тесты
5

Основы CSS

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

теория

тесты
6

Chrome DevTools

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

теория
7

Каскад

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

теория

тесты
8

div, span и display

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

теория
9

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

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

теория

упражнение
10

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

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

теория
11

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

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

теория
12

Дополнительные материалы

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