HTML XHTML
Ранее SSE учил открывать EventSource и получать односторонний текстовый поток с сервера — живые обновления, не история синтаксиса. Этот урок оставляет стримы и закрывает опциональный исторический трек XHTML: HTML под правилами XML. Практика — что было строже, что изменил HTML5, какие привычки помогают — без XML-схем.
Зачем XHTML в курсе HTML
Новички видят «XHTML Strict» и думают, что надо переписать каждую страницу. Нет — HTML5 mainstream-цель. Старая строгость объясняет lowercase, кавычки и
. После server push здесь разделение — правила и история разметки, не realtime API.
Прямой ответ
1) XHTML = HTML как XML. 2) Классические привычки: lowercase, кавычки, явные пустые элементы. 3) Современное: HTML5 с <!DOCTYPE html>. 4) Аккуратная разметка всё ещё важна. 5) Новые проекты: паттерны HTML5. 6) Переводите старые советы XHTML в практику HTML5.
📊 HTML5 vs classic XHTML habits
| Topic | HTML5 (this course) | XHTML-style strictness |
|---|---|---|
| Doctype | <!DOCTYPE html> | Older XHTML DOCTYPE lines |
| Empty elements | <br> / <img> fine | Often <br /> / <img … /> |
| Attribute quotes | Strongly recommended | Required in XHTML |
| Element case | Lowercase by convention | Lowercase required in XHTML |
| Error recovery | Forgiving HTML parsers | XML rules were stricter |
| This course depth | Required (daily practice) | History + habits to recognize |
| Not this lesson | Full CSS layout course | XML schemas / MIME product design |
Крошечный контраст пустого тега
Тот же смысл, два стиля. Браузеры принимают оба в типичном HTML5; слэш — признак материалов эпохи XHTML.
<!-- HTML5-friendly empty tags -->
<p>Line one<br>Line two</p>
<img src="photo.jpg" alt="Demo photo">
<!-- XHTML-looking empty-element form -->
<p>Line one<br />Line two</p>
<img src="photo.jpg" alt="Demo photo" />
Читаем контраст
- br и br / — перенос строки в повседневном HTML5
- / был синтаксисом пустого элемента в XHTML-письме
- Кавычки у src/alt — хорошая привычка HTML5 и обязательны в XHTML
- Lowercase подходит обоим
- Не SSE — нет EventSource
- Не меняйте MIME из‑за одного br /
- Держите интро маленьким
Крошечная корректная мини-страница
Короткий документ с привычками обеих эпох: doctype, charset, кавычки, закрытые элементы. Оставайтесь на doctype HTML5.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Well-formed mini page</title>
</head>
<body>
<h1>Clean markup still helps</h1>
<p>Quoted attributes and closed tags keep the tree clear.</p>
<img src="photo.jpg" alt="A demo photo">
</body>
</html>
Читаем мини-страницу
- <!DOCTYPE html> отмечает HTML5
- lang, charset и кавычки — устойчивые привычки
- Закрывайте не-void элементы
- alt — доступность
- Не связано с SSE
- Маппите привычки старых туториалов; HTML5 для нового
- Дальше часто CSS
Выбор HTML5, привычек XHTML или старых туториалов
- Новая страница курса: HTML5 + чистые привычки
- Книга XHTML Strict 2005: переведите правила; оставьте HTML5
- Видите br /: стиль эпохи XHTML
- Живой server push: был SSE
- Off-thread compute: были Workers
- XML-схемы / application/xhtml+xml: за пределами intro
Практика — сравните, оставьте HTML5, разделите эпохи
- Прочитайте контраст пустого тега.
- Просмотрите таблицу привычек.
- Подтвердите doctype HTML5.
- Предложение: SSE стримит события; XHTML — история разметки.
- Предложение: новые проекты новичков нацелены на HTML5.
- Опционально: почистите сниппет кавычками.
- Заметка: закрывает очередь HTML rewrite.
Лёгкие ошибки
- Слепо форсировать полный XHTML MIME/XML
- Считать снисходительность HTML5 лицензией на плохую разметку
- Смешивать эпохи без style guide
- Путать с SSE
- Верить, что каждый сайт должен быть XHTML Strict
- Копировать старый XHTML doctype в новый проект
- Думать, что кавычки «только для XHTML»
Итог
- XHTML был HTML под более строгими XML-подобными правилами
- HTML5 с <!DOCTYPE html> — современный default
- Lowercase, кавычки и ясные теги всё ещё помогают
- Переводите старые туториалы XHTML
- SSE был live push; этот урок — история разметки
- Очередь HTML rewrite заканчивается здесь — дальше часто CSS
🧠 Проверьте Свои Знания
Проверьте Свои Знания
Бросьте себе вызов с помощью этой интерактивной викторины и узнайте, насколько хорошо вы понимаете тему
📝 Инструкции
- Внимательно прочитайте каждый вопрос
- Выберите лучший ответ на каждый вопрос
- Вы можете пересдавать тест столько раз, сколько захотите
- Ваш прогресс будет показан вверху