Комментарии HTML
Вы уже умеете писать заголовки и абзацы, которые видит посетитель. Иногда нужна заметка для себя или команды, которая не должна появляться на странице. Комментарии HTML решают это. Урок показывает синтаксис комментария и когда использовать его осторожно.
Что такое комментарий HTML?
Комментарий HTML — текст между <!-- и -->. Браузер разбирает его как комментарий и не показывает как видимое содержимое страницы. Комментарии полезны для коротких напоминаний, меток разделов в исходнике или временного отключения куска разметки при тестировании.
Прямой ответ
Пишите комментарий так: <!-- ваша заметка здесь -->. Всё между открывающим <!-- и закрывающим --> остаётся в исходном файле, но не отображается как обычный текст, заголовок или абзац для посетителей. Откройте View Source или DevTools, если нужно убедиться, что комментарий ещё в файле.
Простой комментарий
html<!-- Эта заметка только для разработчиков -->
<p>Этот абзац виден на странице.</p>Читаем пример
- Первая строка — комментарий; посетители не видят это предложение на странице
- Абзац ниже — обычное видимое содержимое
- Обе строки остаются в HTML-файле при сохранении
Многострочные комментарии и временное скрытие
Комментарии могут занимать больше одной строки. Частый приём новичка — обернуть блок, который хотите временно отключить, вместо удаления. Позже можно убрать маркеры комментария и вернуть разметку. Держите временные блоки короткими, чтобы файл оставался читаемым.
Закомментировать блок
html<h1>Видимый заголовок</h1>
<!--
<p>Этот абзац скрыт во время теста.</p>
<p>И этот тоже.</p>
-->
<p>Этот абзац всё ещё показывается.</p>Комментарии — не безопасность
Любой может открыть View Source и прочитать ваши комментарии. Не кладите пароли, закрытые ключи или секретные API-токены в комментарии HTML. Комментарии — для заметок разработки, а не для скрытия чувствительных данных.
Попробуйте сами
- Откройте свой учебный HTML-файл
- Добавьте короткий комментарий над абзацем с пояснением назначения
- Оберните один абзац в многострочный комментарий, чтобы временно скрыть
- Сохраните и откройте страницу — видно только незакомментированное содержимое
- Через View Source (или редактор) убедитесь, что текст комментария ещё в файле
Частые ошибки
- Забыть закрывающий
-->, из‑за чего следующий контент исчезает или ломается - Класть пароли или секреты в комментарии
- Оставлять огромные закомментированные блоки надолго на продакшен-страницах
- Ожидать, что комментарии скроют содержимое от View Source (не скроют)
- Использовать комментарии вместо настоящих заголовков или абзацев для текста посетителя
Итог
- Комментарии HTML используют
<!--и--> - Текст комментария не показывается как видимое содержимое страницы
- Используйте комментарии для заметок, подсказок разделов или короткого временного скрытия
- Многострочные комментарии могут обернуть небольшой блок при тестировании
- Комментарии видны в исходнике — никогда не храните там секреты
- Для текста, который должны читать посетители, предпочитайте живую понятную разметку
🧠 Проверьте Свои Знания
Проверьте Свои Знания
Бросьте себе вызов с помощью этой интерактивной викторины и узнайте, насколько хорошо вы понимаете тему
📝 Инструкции
- Внимательно прочитайте каждый вопрос
- Выберите лучший ответ на каждый вопрос
- Вы можете пересдавать тест столько раз, сколько захотите
- Ваш прогресс будет показан вверху