{"type":"doc","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"HTML-документ состоит из "},{"type":"text","marks":[{"type":"bold"}],"text":"трёх основных секций"},{"type":"text","text":", которые формируют его логическую и техническую структуру."},{"type":"hardBreak"},{"type":"text","text":"Каждая из них выполняет свою роль при отображении страницы в браузере 👇"}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔹 1. "},{"type":"text","marks":[{"type":"code"}],"text":""},{"type":"text","text":" — объявление типа документа"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Это "},{"type":"text","marks":[{"type":"bold"}],"text":"служебная строка"},{"type":"text","text":", которая стоит "},{"type":"text","marks":[{"type":"bold"}],"text":"самой первой"},{"type":"text","text":" в файле."},{"type":"hardBreak"},{"type":"text","text":"Она сообщает браузеру, что документ написан на "},{"type":"text","marks":[{"type":"bold"}],"text":"HTML5"},{"type":"text","text":" (актуальный стандарт)."}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"📘 Пример:"}]},{"type":"codeBlock","attrs":{"language":"html"},"content":[{"type":"text","text":"\n"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"🟢 Без этого объявления браузер может перейти в \"режим совместимости\" и неправильно отобразить страницу."}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔹 2. "},{"type":"text","marks":[{"type":"code"}],"text":"..."},{"type":"text","text":" — корневая секция"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Всё содержимое HTML-документа находится "},{"type":"text","marks":[{"type":"bold"}],"text":"внутри этого тега"},{"type":"text","text":"."},{"type":"hardBreak"},{"type":"text","text":"Это "},{"type":"text","marks":[{"type":"bold"}],"text":"корень"},{"type":"text","text":" страницы — именно с него начинается иерархия элементов (DOM-дерево)."}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"📘 Пример:"}]},{"type":"codeBlock","attrs":{"language":"html"},"content":[{"type":"text","text":"\n ...\n\n"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"🧩 Атрибут "},{"type":"text","marks":[{"type":"code"}],"text":"lang"},{"type":"text","text":" указывает язык страницы (важно для поисковиков и экранных читалок)."}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔹 3. "},{"type":"text","marks":[{"type":"code"}],"text":"..."},{"type":"text","text":" — служебная часть (метаданные)"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Эта секция "},{"type":"text","marks":[{"type":"bold"}],"text":"не отображается на странице"},{"type":"text","text":", но содержит важную информацию для браузера и поисковых систем:"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"кодировка страницы ("},{"type":"text","marks":[{"type":"code"}],"text":""},{"type":"text","text":");"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"название вкладки ("},{"type":"text","marks":[{"type":"code"}],"text":""},{"type":"text","text":");"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"подключение CSS-файлов ("},{"type":"text","marks":[{"type":"code"}],"text":"<link rel=\"stylesheet\" href=\"style.css\">"},{"type":"text","text":");"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"подключение иконок, шрифтов, метатегов для SEO и соцсетей."}]}]}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"📘 Пример:"}]},{"type":"codeBlock","attrs":{"language":"html"},"content":[{"type":"text","text":"<head>\n <meta charset=\"UTF-8\">\n <title>Мой сайт\n \n\n"}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"🔹 4. "},{"type":"text","marks":[{"type":"code"}],"text":"..."},{"type":"text","text":" — основная часть (контент)"}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Это "},{"type":"text","marks":[{"type":"bold"}],"text":"главная секция"},{"type":"text","text":", где находится всё, что "},{"type":"text","marks":[{"type":"bold"}],"text":"видит пользователь"},{"type":"text","text":":"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"текст ("},{"type":"text","marks":[{"type":"code"}],"text":"

"},{"type":"text","text":", "},{"type":"text","marks":[{"type":"code"}],"text":"

"},{"type":"text","text":" и др.),"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"изображения ("},{"type":"text","marks":[{"type":"code"}],"text":""},{"type":"text","text":"),"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"ссылки ("},{"type":"text","marks":[{"type":"code"}],"text":""},{"type":"text","text":"),"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"таблицы ("},{"type":"text","marks":[{"type":"code"}],"text":""},{"type":"text","text":"),"}]}]},{"type":"listItem","content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"формы, видео, кнопки и т.д."}]}]}]},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"📘 Пример:"}]},{"type":"codeBlock","attrs":{"language":"html"},"content":[{"type":"text","text":"\n
Добро пожаловать!
\n
Это мой первый сайт.
\n $\"Фото\"$ \n\n"}]},{"type":"horizontalRule"},{"type":"heading","attrs":{"textAlign":null,"level":3},"content":[{"type":"text","text":"💡 Итого:"}]},{"type":"table","content":[{"type":"tableRow","content":[{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Секция"}]}]},{"type":"tableHeader","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Назначение"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":""}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Указывает, что документ — HTML5"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":""}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Корневой контейнер всей страницы"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":""}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Метаданные (заголовок, кодировка, стили, скрипты)"}]}]}]},{"type":"tableRow","content":[{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"code"}],"text":""}]}]},{"type":"tableCell","attrs":{"colspan":1,"rowspan":1,"colwidth":null},"content":[{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","text":"Основное содержимое, видимое пользователю"}]}]}]}]},{"type":"horizontalRule"},{"type":"paragraph","attrs":{"textAlign":null},"content":[{"type":"text","marks":[{"type":"bold"}],"text":"Простыми словами:"},{"type":"hardBreak"},{"type":"text","text":"HTML-документ — это "},{"type":"text","marks":[{"type":"bold"}],"text":"каркас из трёх уровней"},{"type":"text","text":":"},{"type":"hardBreak"},{"type":"text","text":"📄 объявление ("},{"type":"text","marks":[{"type":"code"}],"text":"DOCTYPE"},{"type":"text","text":") → 🧠 настройки ("},{"type":"text","marks":[{"type":"code"}],"text":"head"},{"type":"text","text":") → 🧍‍♀️ содержание ("},{"type":"text","marks":[{"type":"code"}],"text":"body"},{"type":"text","text":")."},{"type":"hardBreak"},{"type":"text","text":"Браузер читает их сверху вниз и на основе этого "},{"type":"text","marks":[{"type":"bold"}],"text":"строит визуальную страницу"},{"type":"text","text":"."}]}]}

Какие основные секции входят в HTML-документ?

Комментарии