me_edu
Основы веб-разработки: HTML и CSSШаг 14 из 30 · 0% пройдено
Семантика, таблицы и формы · Структура и ввод данных

Семантические теги

Шаг 14 из 307 минТеория
Цель

Понять основной механизм темы «Семантические теги» без заучивания отдельных терминов.

Как работать

Прочитайте блок один раз целиком, затем вернитесь к схеме или примеру и перескажите идею своими словами.

Критерий

Сформулированное правило, пример применения и одно ограничение метода.

PROCESS DIAGRAM1<header>2<nav>3<main> + <section>4<footer>
Семантический каркас страницы сверху вниз
Опорная идея

Раньше страницы строили из множества одинаковых <div>. Современный HTML предлагает семантические теги — элементы, которые своим именем говорят о роли блока:

• <header> — шапка (логотип, меню). • <nav> — навигация, набор ссылок. • <main> — основное содержимое страницы (одно на странице). • <section> — смысловой раздел. • <article> — самостоятельная единица (статья, карточка товара). • <footer> — подвал (контакты, копирайт).

Зачем это нужно: семантика помогает поисковикам понять структуру, скринридерам — навигировать, а вам — читать собственный код. <div> по-прежнему нужен, но как «обёртка без особого смысла», когда подходящего семантического тега нет.

Назад

Обсуждение

Войдите, чтобы участвовать в обсуждении.

Пока нет сообщений.