HTML для начинающих - Полный курс (2025). Урок №1: Введение — Transcript & Summary

Вводный урок курса по HTML для начинающих: установка VS Code, создание проекта, базовая структура HTML-страницы и настройка автоформатирования Prettier.

Key Takeaways

HTML определяет структуру страницы и задает смысл контенту через теги
Базовый документ HTML включает DOCTYPE, html, head (с title) и body
Контент следует помещать в специальные теги, так как браузер игнорирует лишние пробелы и переносы
Prettier с опцией форматирования при сохранении упрощает поддержание аккуратного кода

What the video covers

Введение в курс: путь от основ HTML до создания веб-приложения на React
Установка редактора кода VS Code и правила именования папок проекта (латиница, нижний регистр, без пробелов)
Открытие папки проекта в редакторе и создание файла index.html
HTML как язык разметки и структура сайта: сравнение с каркасом здания или скелетом
Базовая структура HTML-документа: DOCTYPE html, теги html, head, body, title
Назначение тега head: метаинформация, подключение стилей и шрифтов, заголовок вкладки
Тег body и вывод контента для пользователей
Почему пробелы и переносы строк не отображаются в браузере и необходимость использования специальных тегов (например, p)
Установка расширения Prettier и настройка форматирования при сохранении
Анонс следующего урока: основные теги для заголовков, изображений и ссылок

Chapters

Какой редактор кода рекомендуется использовать в этом уроке?

Автор рекомендует VS Code, так как он бесплатный и самый популярный. Установщик скачивается с официального сайта для нужной операционной системы, а установка выполняется в несколько нажатий «Далее».

Почему нельзя использовать кириллицу и пробелы в названиях папок проекта?

Названия папок должны быть на латинице, в нижнем регистре, без пробелов и больших букв. Это позволяет избежать проблем на разных операционных системах и при работе со сборщиками.

Зачем нужен тег head и что в нём содержится?

Тег head содержит метаинформацию о сайте, которая нужна поисковым системам, а также подключение стилей и шрифтов и тег title, задающий заголовок вкладки браузера.