HTML Tutorial 0/139 lessons ~6 min read Lesson 40

    HTML vs. XHTML

    html vs. xhtml html5 text/html won the open web; xhtml remains a legacy and specialized-format html vs xhtml —

    Course progress0%
    Focus
    18 guided sections
    Practice signal
    Examples included
    Career prep
    Interview Q&A included

    Introduction

    HTML vs XHTML — XHTML applied XML rules (lowercase, quoted attributes, closed empty elements, well-formedness) with HTML vocabulary; served as application/xhtml+xml it parsed strictly. Today's production web is HTML5 text/html. Google, Shopify, and BBC ship HTML5; XHTML survives in EPUB, SVG inline, and legacy enterprise CMS exports staff still migrate.

    Business problem

    Legacy XHTML templates with self-closing script tags, xmlns attributes, and application/xhtml+xml MIME break in modern pipelines — React hydration mismatches, XML parsers fail on HTML5 void elements. Teams waste sprints on XML compatibility nobody needs.

    • Tooling: Build tools output HTML5; XHTML rules cause false positive lint failures.
    • Performance: XML parser stricter — error pages instead of recovery — user-facing blank document.
    • SEO: Wrong MIME type — browser may not render — zero indexable content.

    Why this feature exists

    XHTML bridged HTML and XML tooling — single XML pipeline for content management, RSS, and print in early 2000s. HTML5 ended the dual-document road; XML syntax optional in XHTML5 serialisation rarely used on open web.

    • HTML5: One living standard — text/html dominant.
    • XHTML 1.0: Transitional vs Strict — historical migration paths.
    • Today: SVG/MathML foreign content in HTML — no full XHTML document needed.

    Browser internals

    MIME type decides parser: text/html → HTML parser (error tolerant). application/xhtml+xml → XML parser (fatal on well-formedness error). Same markup string different outcomes — vs both OK in HTML; XML requires rules consistency.

    • Void elements: HTML5 allows
      ; XML needs
      convention.
    • script/style: CDATA wrappers in XHTML — HTML comments hide script in HTML4 legacy.
    • Namespaces: xmlns on html root in XHTML — html xmlns in HTML5 optional legacy.
    text
    text/html: <p><img src=x alt=y> → parses, renders
    application/xhtml+xml: unclosed tag → fatal XML parse error → blank page
    HTML5: optional /> on void elements — compatibility

    Rendering workflow

    XML mode disabled incremental HTML parsing features historically — waiting for full document. Modern web rarely serves xhtml+xml — no practical perf difference today because nobody uses XML mode for main documents.

    • SSR mismatch: React expects HTML5 — XHTML serialization extra slashes confuse diff.
    • InnerHTML: XML serialization different — copy/paste between modes breaks.
    • EPUB: Still XHTML content documents — separate workflow from web HTML5.

    Feature deep dive

    Staff guidance 2025: Author HTML5 text/html. Lowercase tags, quoted attributes — good habits from XHTML retained. Don't serve application/xhtml+xml for web apps. Migrate xmlns and XML prologs out of templates. Use HTML validator not XML validator for web pages.

    • Self-closing: valid HTML5 but trailing slash optional — pick one style guide rule.
    • Boolean attributes: disabled vs disabled="disabled" — both HTML5 valid.
    • SVG inline: XML syntax inside HTML document — foreign content rules apply.
    html
    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>HTML5 — not XHTML MIME</title>
    </head>
    <body>
    <img src="/logo.svg" alt="Company logo" width="120" height="40">
    <br>
    <p>HTML5 syntax; served as text/html.</p>
    </body>
    </html>

    Accessibility analysis

    Accessibility unaffected by HTML vs XHTML choice when DOM identical — both produce same accessibility tree if parsed successfully. XML fatal error — no DOM — total accessibility failure. lang and xmlns:lang historically confused — use html lang in HTML5.

    • EPUB a11y: XHTML content still needs WCAG — separate from web MIME debate.
    • Assistive tech: Consumes DOM post-parse — parser mode invisible if render succeeds.
    • Validation: XHTML strictness didn't guarantee accessibility — semantics still required.

    SEO impact

    Google expects text/html for typical crawl. application/xhtml+xml pages rare — Search Console may show parse errors if XML invalid. HTML5 semantic elements preferred over div class soup from XHTML transitional era.

    • Legacy URLs: .xhtml extensions — redirect to HTML5 or serve text/html same content.
    • Sitemap: HTML pages not XHTML namespace requirements.
    • AMP: HTML subset — not XHTML — historical comparison only.

    Security considerations

    XML external entity (XXE) risks in XML pipelines — not browser HTML parser. XHTML served as XML could theoretically interact with XML tooling vulnerabilities — rare on modern browsers. HTML5 parser handles malicious markup with defined recovery — different threat model.

    • Server transform: XSLT HTML output — ensure no XXE in server XML parser config.
    • CSP: Same regardless HTML vs XHTML MIME.
    • Sanitize: Libraries target HTML5 — XHTML XML input path may differ.

    Performance impact

    No production perf benefit to XHTML on web — abandoned path. Migration to HTML5 reduces template complexity and validator noise — engineer time savings only measurable gain.

    • Parser: HTML5 streaming parse enables incremental render — XML historically full-doc.
    • Bytes: xmlns and XML prolog add overhead — remove in migration.
    • Build: Dual validators XML+HTML — CI time saved after HTML5-only.

    Real production example

    BBC migrated legacy XHTML templates to HTML5 over multi-year program — removed xmlns, fixed self-closing conventions, confirmed text/html headers. Shopify themes HTML5 Liquid output exclusively.

    • EPUB team: Separate XHTML pipeline — don't conflate with web shop theme.
    • Google: Internal tools HTML5 — public docs HTML5.
    • Migration script: Remove XML declaration, xmlns, close void elements optionally normalize.
    html
    <!-- Before (XHTML habits) -->
    <!-- <html xmlns="http://www.w3.org/1999/xhtml"> -->
    <!-- After (HTML5) -->
    <!DOCTYPE html>
    <html lang="en">

    Enterprise usage

    Enterprise CMS migrations document HTML5 as target serialization; XML export for print/EPUB forked from canonical content model — not served to browsers. html-validate replaces xmllint for web QA gates.

    • Style guide: "We author HTML5" — XHTML appendix marked historical.
    • Training: Devs joining find old XHTML wiki — archive with redirect.
    • Vendor RFP: Require HTML5 text/html deliverables explicitly.

    Common production failures

    CMS accidentally set Content-Type application/xhtml+xml on marketing site — one unclosed div in author content white-screened page in Firefox XML mode; HTML parser would have recovered.

    • React hydration: SSR XHTML-style /> mismatch — console warnings, rare DOM diff bugs.
    • SEO: XML parse error page — temporary deindex until MIME fixed.
    • Email: XHTML email clients different rules — team confused web and email guides.

    Architecture review questions

    • Is content served as text/html not application/xhtml+xml?
    • Are legacy xmlns and XML prologs removed from web templates?
    • Does validation use HTML5 rules not XML well-formedness for web?
    • Are self-closing conventions consistent with HTML5 style guide?
    • Is EPUB/print XHTML pipeline separated from web HTML5 pipeline?
    • Do SSR frameworks output HTML5-compatible markup for hydration?

    Hands-on project

    Migrate a legacy XHTML page to HTML5 — fix MIME header, remove xmlns, validate with html-validate, confirm identical visual render and axe pass.

    • Deliverable: Before/after diff + validator output clean.
    • Verify: Browser receives text/html Content-Type.
    • Stretch: Document team migration checklist for 100 legacy pages.

    Interview questions

    Key differences between HTML5 text/html and XHTML application/xhtml+xml parsing?(Advanced)

    HTML5 parser error-tolerant — repairs mis-nesting, continues on errors. XML parser fatal on well-formedness violation — no render. Void element syntax, CDATA in script, xmlns declarations differ. DOM may match if markup well-formed but failure modes completely different. Web uses text/html exclusively in practice.

    Follow-up: Is <br/> required in HTML5?

    When would you still encounter XHTML in frontend engineering?(Advanced)

    EPUB 3 content documents, some SVG/XML tooling, legacy enterprise CMS exports, email XHTML subset clients, archival content migration projects. Not for new public web apps. Airbnb/Shopify web — HTML5 only. Interview candidate should know migration not greenfield XHTML.

    Follow-up: SVG inline XML syntax in HTML?

    Migration strategy from XHTML templates to HTML5 at scale?(Advanced)

    Automated codemod: remove XML prolog/xmlns, normalize void tags, switch validator to html-validate, enforce text/html Content-Type at CDN, fix SSR framework output, regression test visual and DOM snapshots. Phased rollout per template type. Archive XHTML guide to prevent reintroduction. BBC-style multi-quarter program for large sites.

    Follow-up: Hydration mismatches from trailing slashes?

    Try it yourself

    Edit the HTML, CSS, or JS panels — the preview updates as you type.

    Try it yourself

    Preview

    Summary

    HTML5 text/html won the open web; XHTML remains a legacy and specialized-format concern. Staff engineers at Google and BBC standardize on HTML5 parsing and validation — knowing XHTML history explains old templates, not new architecture choices.

    Ready to mark this lesson complete?Track your journey across the entire course.