HTML snippets

8 snippets

• HTML

  Lazy load images and iframes natively

  Defer off-screen images and embeds with loading="lazy", while keeping the main image eager to protect LCP.

• HTML

  Essential head tags for SEO and sharing

  The meta, canonical, Open Graph and icon tags every public page should have.

• HTML

  Accessible modal with the dialog element

  Use the native dialog element for a modal with built-in focus trapping, Escape to close and a backdrop.

• HTML

  Accordion with details and summary

  A keyboard-accessible FAQ accordion with no JavaScript, including an exclusive group using the name attribute.

• HTML

  Accessible data table markup

  Use caption, thead, th scope and a scroll wrapper so screen readers and small screens handle tables well.

• HTML

  Responsive images with srcset and the picture element

  Serve modern formats and the right image size per device, with explicit dimensions to prevent layout shift.

• HTML

  Accessible skip-to-content link

  Let keyboard users jump past repeated navigation straight to the main content.

• HTML

  Accessible form field with label, hint and error

  Associate labels, help text and validation errors with an input so screen readers announce them.