Ответ
Структура валидного HTML5-документа состоит из следующих обязательных и необязательных частей:
-
Декларация типа документа (DOCTYPE): Указывает браузеру, что это документ HTML5.
<!DOCTYPE html> -
Корневой элемент
<html>: Обёртывает весь документ. Атрибутlangзадаёт язык страницы для доступности и SEO.<html lang="ru"> -
Секция
<head>: Содержит метаинформацию, не отображаемую напрямую на странице.<title>— заголовок вкладки браузера.<meta charset="UTF-8">— кодировка символов.<meta name="viewport" content="width=device-width, initial-scale=1.0">— для адаптивного дизайна.<link>— подключение CSS-стилей, иконок (favicon).<script>— подключение JavaScript (обычно перед закрывающим</body>).
-
Секция
<body>: Содержит всё видимое содержимое страницы — текст, изображения, ссылки, формы и т.д.
Пример минимальной валидной структуры:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Моя страница</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>Шапка сайта</header>
<main>Основное содержимое</main>
<footer>Подвал</footer>
<script src="app.js"></script>
</body>
</html>Ответ 18+ 🔞
А, ну вот, слушай, смотри, блядь. Опять эти ваши HTML-документы. Ну, вроде бы, хуйня простая, а народ, сука, как начнёт городить — овердохуища получается, в рот меня чих-пых!
Короче, чтобы твоя страничка не была говном в глазах браузера, надо соблюсти порядок. Как в армии, блядь. Не так, чтобы «а я тут картинку всуну, а тут скрипт, а че так нельзя?». Нельзя, сука! Есть устав, ёпта!
Вот смотри, по пунктам, как блядь по нотам:
1. Первое, что кричишь браузеру — «Я НОРМАЛЬНЫЙ, Я ПЯТЫЙ!» Это типа объявление, что ты не древний уёбок, а современный парень. Пишешь одну строчку и всё.
<!DOCTYPE html>Вот и вся магия. Не надо там хуйни с длинными цитатами из прошлой жизни. Просто так.
2. Потом, блядь, обёртка для всей этой движухи.
Весь твой код, всю эту пиздопроебибну, засовываешь в тег <html>. И не забудь языком ткнуть, а то поисковики обидятся.
<html lang="ru">3. Дальше идёт голова — <head>.
Это, типа, мозги страницы. Там ничего не видно, но без этого — пиздец. Там живут:
- Заголовок (
<title>) — то, что в названии вкладки. Не «Документ без названия», а нормальное имя, блядь! - Кодировка (
<meta charset="UTF-8">) — чтобы русские буквы не превращались в кракозябры, ёпта! Без этого — «РџСЂРёРІРµС‚, РјРёСЂ!» и волнение ебать. - Вьюпорт (
<meta name="viewport"...>) — это чтобы на телефоне твой сайт не выглядел как хуй с горы, а нормально масштабировался. Обязательно, блядь, в наше время! - Стили (
<link>) — платье для твоего уродца. Без них он голый и страшный.
4. Ну и наконец, тело — <body>.
А вот это уже то, что все видят. Текст, картинки, кнопки — вся эта видимая хуйня живёт тут. Шапку (<header>), основную часть (<main>), подвал (<footer>).
5. Скрипты (<script>) — это как допинг. Их обычно в самый конец тела суют, перед тем как попрощаться. Чтобы сначала страница нарисовалась, а потом уже скрипты её оживляли. Иначе пользователь будет смотреть на белый экран и думать «ну и пизда этому сайту».
Вот, смотри, как это всё вместе выглядит в минимально боеспособном виде:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Моя страница</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>Шапка сайта</header>
<main>Основное содержимое</main>
<footer>Подвал</footer>
<script src="app.js"></script>
</body>
</html>Вот и вся структура, блядь. Запомни этот скелет, а потом уже наращивай на него мясо — дизайн, функционал, анимашки. А если скелет кривой — всё развалится, и будет у тебя не сайт, а манда с ушами. Всё, вопрос есть?