Validation and Performance

Audit markup, loading priority, resource hints, and browser behavior before shipping.

更新于 2026年8月13日适用于 HTML Living Standard and modern browsers

Valid markup removes ambiguity, while careful resource loading helps useful content appear quickly. Performance starts with the document, not with a final optimization pass.

Load resources intentionally

index.html

01<link rel="preconnect" href="https://fonts.example.com" crossorigin />
02<link rel="preload" href="/fonts/interface.woff2" as="font" type="font/woff2" crossorigin />
03<script type="module" src="/app.js"></script>

Preconnect only to important origins. Preload only a resource needed immediately; unnecessary preloads compete with critical content. Modules are deferred automatically.

Audit the document

Run an HTML validator and fix structural errors.
Check one clear page title, description, language, and main heading.
Confirm images reserve space and below-fold media loads lazily.
Test keyboard order, visible focus, labels, landmarks, zoom, and screen-reader names.
Inspect network waterfalls, console errors, redirects, and missing resources.
Test slow connections and a real mobile device.

hero.html

01<img src="hero.webp" alt="Course editor showing an HTML lesson" width="1280" height="720" fetchpriority="high" />

Keep this

Ship a valid document, load only what the first view needs, measure on realistic devices, and treat accessibility failures as production defects.