Семантические теги говорят браузеру и поисковику, что за кусок контента перед ними. Разберём четыре тега: nav, aside, section, article. Только суть и примеры. nav — навигация Тег нужен для блоков с ссылками, которые помогают перемещаться: меню, пагинация, «хлебные крошки». Пример: html <nav aria-label=»Основное меню»> <ul> <li><a href=»/»>Главная</a></li> <li><a href=»/catalog»>Каталог</a></li> <li><a href=»/articles»>Статьи</a></li> </ul> </nav> Зачем: скринридеры […]
  Загрузка... |
Просмотров: 88 | Читать статью |
<section> и <article> — оба семантические контейнеры, и новички часто путают, где какой ставить. Главное отличие: самостоятельность <article> — это самодостаточный, законченный контент. Его можно вырезать со страницы, отправить в RSS, опубликовать на другой площадке — и он останется понятным. Примеры: статья в блоге, новость, комментарий, карточка товара. <section> — это смысловой раздел, который сам по себе не «живёт». Он часть чего-то […]
| Загрузка... |
Просмотров: 169 | Читать статью |
Семантические теги — это способ сказать браузеру и поисковику: «Вот тут у меня шапка, тут основной контент, тут подвал». Это не про красоту, а про понятную структуру. Разберём три самых базовых тега: <header>, <main>, <footer>. <header> — шапка страницы <header> обычно ставят вверху страницы. В нём размещают то, что относится ко всей странице или сайту: […]
| Загрузка... |
Просмотров: 80 | Читать статью |
Разметка в HTML — это не просто «теги ради тегов». Это скелет страницы: он говорит браузеру и поисковику, где навигация, где основной контент, где боковая панель. Разберём, как логично разметить три типовых страницы: главную, статью и каталог. Главная страница: баланс блоков Главная — это витрина. В ней обычно есть навигация, «первый экран» с главным посылом, блоки преимуществ/услуг, […]
| Загрузка... |
Просмотров: 100 | Читать статью |
Блок <head> содержит служебную информацию о странице — её не видно напрямую в контенте, но она критически важна для браузера, поисковых систем и пользователей. Разберём, какие элементы в <head> нужны почти всегда, а какие добавляют только при конкретных задачах. Обязательные элементы <meta charset=»utf-8″> Это самый важный метатег. Он задаёт кодировку документа. Для веба стандартом считается UTF‑8 — она корректно […]
 1,00 (3) Загрузка... |
Просмотров: 81 | Читать статью |
Тег <html> — корневой элемент любой HTML‑страницы. Всё содержимое документа должно находиться внутри него. У этого тега часто используют атрибут lang, чтобы указать основной язык страницы, например: <html lang=»ru»>. На первый взгляд это мелочь, но у такого подхода есть вполне практические последствия — и для пользователей, и для поисковых систем, и для работы вспомогательных технологий. Что делает тег html […]
| Загрузка... |
Просмотров: 73 | Читать статью |
Строка <!DOCTYPE html> — это не HTML‑тег, а объявление типа документа. Её единственная задача — подсказать браузеру: «этот файл нужно обрабатывать по современным правилам». Несмотря на внешнюю простоту, отсутствие этой строки может заметно повлиять на то, как страница отобразится у пользователя. Что такое DOCTYPE и как он работает DOCTYPE (Document Type Declaration) сообщает браузеру, какой стандарт разметки используется в […]
| Загрузка... |
Просмотров: 64 | Читать статью |
Ссылка в HTML это элемент, по которому пользователь переходит на другую страницу, скачивает файл, открывает телефон или email, либо запускает действие на текущей странице. Если ссылка не срабатывает при клике, причина почти всегда в одной из простых вещей: неверный синтаксис, перекрытие другим элементом, ошибка в адресе или логика JS. Базовый синтаксис: тег <a> и атрибут […]
| Загрузка... |
Просмотров: 79 | Читать статью |
Тег <label> в HTML нужен, чтобы связать подпись с полем ввода. Это не просто текст рядом с инпутом — это функциональный элемент: клик по подписи активирует поле. И важно сделать это так, чтобы всё работало одинаково в браузерах и на разных устройствах. Два способа связать label с полем Есть два рабочих варианта: по атрибуту for […]
| 1,00 (1) Загрузка... |
Просмотров: 75 | Читать статью |
Цвет фона в CSS задаётся через свойство background-color. На первый взгляд это простая настройка: поставил цвет — и готово. Но если смотреть с точки зрения доступности, тут есть важные нюансы: текст должен нормально читаться на фоне, а интерфейс — быть удобным для людей с особенностями зрения. Как задать цвет фона Синтаксис простой: css .box { background-color: #f5f5f5; } Можно […]
| Загрузка... |
Просмотров: 80 | Читать статью |