З чого складається сторінка

HTML описує структуру, а не зовнішній вигляд. Браузер читає теги й збирає дерево: що заголовок, що абзац, що посилання. Стиль потім накладе CSS, поведінку — JavaScript. Сама сторінка починається з документа, а не зі шматка розмітки посеред файлу.

<!DOCTYPE html> каже браузеру: це сучасний HTML, а не старий режим сумісності. Без нього сторінка однаково відкриється, але частина правил рахуватиметься інакше. html — корінь. Усередині рівно дві дитини: head (для браузера й пошуковика) і body (те, що бачить людина).

Атрибут пишеться у відкривальному тегу: ім'я і значення в лапках. href каже, куди веде посилання, alt — що на картинці, якщо її не видно. Порядок атрибутів не важливий. Значення без лапок спрацює лише доти, доки в ньому немає пробілу, — не покладайся на це.

• head — заголовок вкладки, кодування, опис. На екрані цього немає.
• body — видимий вміст. Усе, що має побачити людина, клади сюди.
• Вкладеність читається як матрьошка: список усередині nav, пункт усередині списку.
• Пробіли й переноси між тегами браузер схлопує. Гарно форматуй для себе, а не для виведення.

Незакритий p браузер закриє перед наступним. Незакритий li — теж. Сторінка «працює», але дерево інше, і стилі зі скриптами потраплять не туди. Пиши закривальні теги сам, крім одиночних. Докладно про документ — у MDN · Початок роботи з HTML.