Домашнє завдання #1: Створення багатосторінкового сайту

Тема: Основи HTML — створення багатосторінкового сайту

Це твоє перше домашнє завдання — і воно особливе. Репозиторій, який ти зараз створиш, житиме з тобою весь курс: кожне наступне ДЗ додаватиметься в нього окремою папкою. Наприкінці курсу це буде готове портфоліо з зеленим графіком контрибуцій — те, що показують роботодавцю.

Мета завдання

Закріпити знання з першого уроку: створення HTML-документів, використання заголовків та посилань.

Що потрібно зробити

1. Створити репозиторій курсу

Створи публічний репозиторій на GitHub з назвою my-web-course — у ньому житимуть усі твої домашні завдання (детальні кроки — у секції «Як здати» нижче).

2. Створити 3 HTML-сторінки

У папці hw-01/ мають бути три файли:

Файл	Призначення
`index.html`	Головна сторінка
`about.html`	Сторінка "Про мене"
`contacts.html`	Сторінка "Контакти"

3. Вимоги до кожної сторінки

Кожна сторінка повинна містити:

Повну HTML-структуру — <!DOCTYPE html>, <html>, <head> з <title>, <body>
Заголовок <h1> — унікальний для кожної сторінки, щоб було зрозуміло, де ми знаходимось
Навігаційні посилання — з кожної сторінки можна перейти на інші дві
Трохи контенту — кілька абзаців тексту <p> (напиши щось про себе — це ж твій сайт!)

Структура сторінки (схематично)

┌────────────────────────────────┐
│ <h1> Заголовок сторінки        │
├────────────────────────────────┤
│ [Про мене]  [Контакти]         │  ← посилання на дві інші сторінки
├────────────────────────────────┤
│ Абзац тексту...                │
│ Ще один абзац...               │
└────────────────────────────────┘

Підказки (відкривай поступово)

Рівень 1 — напрямок думки. Кожен HTML-файл — окрема самостійна сторінка з повною структурою. Посилання між файлами в одній папці працюють просто за іменем файлу.

Рівень 2 — що використати. Тег <a> з атрибутом href; для посилання на сусідній файл достатньо href="about.html" (відносний шлях, без https:// і без / на початку).

Рівень 3 — покроково. Створи index.html → напиши структуру документа → додай <h1> і два <a> → скопіюй файл двічі і перейменуй на about.html та contacts.html → на кожній сторінці зміни <title>, <h1>, текст і посилання (сторінка не посилається сама на себе).

Як здати

Це перше ДЗ, тому розберемо здачу детально:

Зареєструйся на GitHub, якщо ще не маєш акаунта (безкоштовно)
Створи публічний репозиторій my-web-course: натисни + у правому верхньому куті → New repository → назва my-web-course → видимість Public → постав галочку Add a README file → Create repository. Цей репозиторій — на весь курс: кожне ДЗ буде в ньому окремою папкою hw-NN/
Створи папку hw-01/ і поклади в неї три HTML-файли та README.md (2-3 речення: що зроблено). Поки що можна через веб-інтерфейс GitHub: Add file → Create new file, у полі імені набери hw-01/index.html — папка створиться автоматично. У Block 1 ти навчишся робити це з терміналу
Зроби мінімум 3 коміти з осмисленими повідомленнями (не "fix" чи "update", а "Додано головну сторінку", "Додано навігацію між сторінками"). Кожне збереження файлу через веб-інтерфейс — це окремий коміт
Перевір, що посилання працюють, і надішли посилання на репозиторій (можна одразу на папку hw-01)

Критерії оцінювання

Критерій	Тип	Бали
Публічний репозиторій `my-web-course` з папкою `hw-01/`	[код]	10
Є 3 HTML-файли: `index.html`, `about.html`, `contacts.html`	[код]	15
Кожна сторінка має повну структуру (DOCTYPE, html, head з title, body)	[код]	20
Кожна сторінка має унікальний заголовок `<h1>`	[код]	15
Навігаційні посилання між сторінками працюють (відносні шляхи)	[код]	20
`README.md` у папці `hw-01/` з описом	[код]	5
Мінімум 3 коміти з осмисленими повідомленнями	[код]	5
Якість коду	[код]	10
Разом		100

Бонусні завдання (необов'язково)

Бонус	Бали
Додай зображення на одну зі сторінок (`<img>` з `alt`)	+5
Створи список улюблених речей (`<ul>`, `<li>`)	+5
Увімкни GitHub Pages, щоб сайт був доступний онлайн	+10

Що далі

Не видаляй цей сайт після здачі! У ДЗ #6 ти повернешся до нього і стилізуєш його за допомогою CSS — з простих чорно-білих сторінок він перетвориться на справжній сайт.