How would you build a resilient HTML page with no JS?
Building Resilient HTML Without JavaScript
A resilient HTML page should remain usable and accessible even if JavaScript is disabled or fails to load. This ensures that users on low-resource devices, strict networks, or with assistive technologies can still access the core functionality.
- 1
Structure with semantic HTML: Use proper elements (
<header>,<main>,<form>,<button>,<a>) so content makes sense without scripts. - 2
Use native form behavior: Forms should submit and validate at least on the server side, without relying solely on JavaScript.
- 3
Provide navigation with links: Ensure
<a>elements handle navigation instead of relying only on client-side routing. - 4
Ensure accessibility: Use ARIA roles and attributes only when necessary, and let HTML defaults provide meaning.
- 5
Style with CSS only: Avoid depending on JS for layout, show/hide, or basic interactivity that CSS can handle.
In short: By focusing on semantic HTML, server-side validation, and CSS for presentation, you can create a web page that functions fully without JavaScript, while still being enhanced if JavaScript is available.
Scenario Questions
0-2 years experience
- 1Imagine you need to create a simple contact form that must work even if the user's browser has JavaScript disabled. How would you structure the HTML to handle validation and error messages?
- 2You have an image carousel that currently relies on JavaScript. How would you redesign it so the page still displays useful content when JS is unavailable?
- 3What HTML element would you use to provide alternative content for users with JS disabled, and how does it work?
2-5 years experience
- 1We have a navigation menu that uses CSS hover for dropdowns, but in some older browsers the hover doesn't trigger. How would you debug and make the menu resilient without adding JavaScript?
- 2A page uses <noscript> to show a warning, yet users still report broken layouts when JS fails to load. What could be causing this and how would you fix it?
- 3Our server renders a page that expects a client‑side script to populate a table via AJAX. Without JS, the table is empty. How would you redesign the page to still deliver data?
5-8 years experience
- 1Design a marketing site that must remain fully functional without JavaScript while still offering rich interactions like tabs and accordions. What patterns would you choose, and what trade‑offs do they introduce?
- 2Explain how you would implement SEO‑friendly URLs and analytics tracking on a page that cannot rely on client‑side scripts.
- 3When scaling to thousands of pages, how would you ensure that all fallback content stays in sync with the primary content, and what tooling would you use?
8+ years experience
- 1Your company is moving a large SPA to a server‑rendered architecture with a no‑JS fallback for critical pages. Outline the architectural changes, team responsibilities, and rollout plan to maintain resilience.
- 2What governance processes and linting or CI checks would you put in place to enforce that new pages include appropriate no‑JS fallbacks across multiple product teams?
- 3Discuss the long‑term cost‑benefit analysis of building a core UI library that only uses HTML/CSS versus one that depends on JavaScript, considering performance, accessibility, and developer velocity.
Follow-up Questions
- What would you do if a CSS‑only dropdown still fails in a specific browser?
- How do you ensure form validation works without JavaScript?
- Can you describe how you’d test the page’s resilience in a CI pipeline?