Building a browser‑only website launch checklist with accessible HTML and localStorage

Description and use

A single‑page launch checklist that runs entirely in the browser, uses native controls, accessibility features, and localStorage to persist state without a backend.

Problem

Website launch checklists are usually PDFs or documents, which become problematic when multiple people need to work through one, the tab closes, or the checklist needs to be reused without sending data to another service.

Outcome

The checklist runs entirely in the browser, preserves state across reloads, supports printing, and requires no server or analytics, making it suitable for personal or small‑team use.

Workflow

• Create a single HTML file with native checkbox inputs wrapped in labels for accessibility.
• Add a native <progress> element to display completion percentage.
• Use JavaScript to update the progress value and accessible label on each checkbox change.
• Store checked checkbox IDs in localStorage under a unique key.
• On page load, read localStorage and restore checked states.
• Provide a reset button that clears only the checklist’s storage key.
• Add a print stylesheet to format the checklist for printing and a print button that calls window.print().

Evidence

Website launch checklists are usually PDFs or documents. That is fine until several people need to work through one, the tab closes, or the checklist needs to be reused without sending data to another service.

Source

I built a small open‑source version that runs entirely in the browser: https://bryceelliot.github.io/website-launch-checklist/

Source

The JavaScript updates both the numeric value and an accessible label. A screen‑reader user gets the same progress information as a sighted user.

Source

Checked item IDs are saved to localStorage in the visitor’s browser.

Source

The reset control clears only this checklist’s storage key and returns focus to the first item. It does not erase unrelated browser storage.

Source