</> Praktum

Главная / HTML / Проверка разметки

Урок 16 · HTML

Как за минуту найти сломанный тег

Браузер прощает ошибки и достраивает дерево сам. Поэтому страница может выглядеть почти нормально и всё равно быть сломанной.

Почему это следующий шаг

Комментарии и структура уже есть. Перед стилями разметку стоит проверить, иначе CSS будет красить не тот элемент.

Как сделать

Открой инструменты разработчика и посмотри дерево. Сверяй его с файлом: кто чей родитель. Закрывай теги в обратном порядке. Валидатор W3C или встроенная проверка редактора покажет незакрытый тег и повтор id. Если русский текст превратился в кракозябры, проверь charset и UTF-8.

<!-- правильно -->
<p>Изучаю <strong>HTML</strong></p>
<!-- неправильно: strong закрыт после p -->

Что проверить

  • В дереве браузера список действительно внутри секции.
  • Нет двух элементов с одним id.
  • Вкладка называется так, как title, а не как имя файла.

Попробуй

Специально не закрой один li, посмотри дерево, затем почини.