HTML Interview Questions

aria-live announces dynamic updates (like status messages) to screen readers without requiring user focus changes.

hidden removes content from visual and accessibility trees. aria-hidden hides from accessibility tree only, while visual rendering can remain.

Skipping levels (h1 to h4) or using headings for styling only. Headings should reflect logical content structure.

picture enables responsive images and format fallback by letting the browser choose the best source using media/type conditions.

It allows modern efficient formats first (WebP/AVIF), then falls back to JPEG/PNG for older browsers.

A canonical link (rel="canonical") indicates the preferred URL version for duplicate/similar content to consolidate ranking signals.

preload fetches critical assets early; preconnect establishes early network handshakes for third-party origins.

It prevents reverse tabnabbing and suppresses referrer leakage for external links opened in new tabs.

Without type, button defaults to submit in forms. Explicit type="button" avoids accidental form submissions.

It asks browser not to autofill, but often hurts UX. Prefer specific autocomplete tokens instead of blanket disabling.

Keep values simple, avoid storing sensitive data, and treat them as UI metadata rather than source of truth for business logic.

tabindex="0" inserts into natural tab order, -1 allows programmatic focus only. Positive values are generally discouraged.

Focus trapping keeps keyboard focus inside components like modals so users do not tab to background content.

Too many nav or main-like landmarks creates noisy navigation for screen-reader users. Keep landmarks meaningful and minimal.

Client-side improves UX and immediate feedback; server-side is mandatory for security and data integrity.