Website Testing Checklist.

Click every item in the top navigation bar and confirm the URL and page heading match the expected destination. Include any dropdown sub-items.

The nav link corresponding to the current page should carry its active/selected visual style. Check at least 3 different pages.

At 375px viewport width, confirm the hamburger icon is visible, tapping it reveals all nav items, and tapping a link both navigates and closes the menu.

On pages with breadcrumbs, confirm each ancestor segment links to the correct parent URL. The last segment (current page) should not be a link.

Crawl all internal hrefs on the page and assert every request returns a 2xx or 3xx status code. Include footer and sidebar links.

Any anchor pointing to a different origin should have target='_blank' and the rel attribute should include both 'noopener' and 'noreferrer' to prevent tab-napping.

Tab to the very first focusable element on the page. A 'Skip to main content' link should appear and, when activated, move focus to the main landmark.

Fill all required fields with valid data, submit, and assert the success state (confirmation message, redirect, or new page). Verify the submitted data actually persists or triggers the expected downstream action.

Leave all required fields blank and submit. Each required field should display a visible error message adjacent to it, not only a generic banner. The form should not submit.

Test: 'plainaddress', 'missing@domain', 'valid@sub.domain.com', 'user+tag@example.org'. The first two should fail; the last two should pass. Confirm error messages are specific ('Enter a valid email address').

Enter '<script>alert(1)</script>' into text fields and submit. The string should be escaped and displayed as literal text, not executed. Check both success and error states.

Submit a form, then immediately click submit again (or hit Enter twice rapidly). Confirm the server-side action fires only once. The submit button should be disabled after the first click.

Trigger browser autofill on a multi-field form (name, email, address) and verify all fields populate, field-level validation does not fire prematurely, and submission succeeds.

Inspect the DOM for each input/select/textarea: it must be linked to a <label via 'for'/'id' pairing, or carry aria-label / aria-labelledby. Placeholder text alone does not count as a label.

Paste 10,000 characters into each text field. The UI should either enforce maxlength (field stops accepting input) or the server rejects with a user-friendly error — not a 500 or silent data corruption.

Set viewport to 375×812 (iPhone SE / most narrow baseline). No element should overflow causing horizontal scroll. Text should not overflow its container. Tap targets should be at least 44×44px.

Resize from 767px to 769px. Multi-column grids should shift to the expected column count. Nav, hero, and card layouts should reflow without overlapping elements or invisible text.

Check hero images, card thumbnails, and inline images at 375px, 768px, and 1440px. Images should not exceed their container width or distort (check aspect-ratio CSS).

On a 375px viewport, inspect the computed bounding box of buttons and links. Each should be at least 44×44px to avoid mis-taps. Pay special attention to icon-only buttons.

In browser settings, increase font size to 200%. Text should reflow rather than overflow fixed containers. No text should become invisible or overlap interactive controls.

Run the full happy-path: load, navigate, fill a form, submit. Assert no console errors related to your own JS (third-party noise is acceptable).

Same happy-path as Chrome. Firefox renders fonts, flexbox gaps, and CSS grid gutters slightly differently — pay attention to spacing and typography.

Safari/WebKit has distinct handling of date inputs, CSS :focus-visible, and input type='file'. Test these specifically if the site uses them.

Disable JS in browser settings and load the page. Navigation links, body text, and images should render. If the site is fully client-rendered, a meaningful fallback or 'requires JavaScript' notice should appear.

Run axe-core in your Cypress/Playwright suite on each unique page template. Critical violations (e.g. missing alt text, invalid ARIA roles) must be zero before release.

Tab through the entire page without touching the mouse. Every button, link, input, and modal must receive visible focus and be activatable with Enter/Space. No focus traps outside of open modals.

Use Lighthouse or the axe browser extension to check contrast on body text, placeholder text, and disabled states. Pay particular attention to light-grey text on white backgrounds.

Inspect every <img> tag. Content images must have alt text that describes the content or function. Purely decorative images must carry alt='' so screen readers skip them.

Tab through all interactive elements and verify a visible focus ring or equivalent. Custom focus styles are fine; invisible focus is not. Test in Chrome and Firefox as they render default outlines differently.

Use the axe extension or browser DevTools to inspect heading structure. Skipping from h2 to h4, or having two h1 elements on one page, disrupts screen reader navigation.

Run Lighthouse with a 4G throttled profile. LCP > 4s is a red flag. Typical culprits: unoptimised hero images, render-blocking CSS, or a slow API call blocking the critical path.

Load the page and scroll without interacting. Elements should not jump as fonts load, images without explicit dimensions render, or ads inject. Run Lighthouse or use the CLS overlay in Chrome DevTools.

Open the Network tab and filter by Img. No image should be served as a large uncompressed JPEG or PNG where a WebP/AVIF equivalent exists. All <img> tags should carry explicit width and height to prevent CLS.

Inspect the page source and Lighthouse 'Eliminate render-blocking resources' audit. Third-party scripts (analytics, chat widgets) should load with defer or async.

Load each page and check document.title in the console. Titles should be unique across pages, descriptive, and under 60 characters to avoid truncation in SERPs.

Check <meta name='description'> on each page. Missing or duplicate descriptions result in Google generating its own, often less accurate, snippet.

Check <link rel='canonical'>. It should point to the https, non-www (or www, whichever is preferred) version of the current URL. Verify it's not self-referential with the wrong protocol.

Validate via the Meta Sharing Debugger or by reading the <head>. og:image should be at least 1200×630px. og:title and og:description may differ from the <title> and meta description.

Fetch /robots.txt and check that production pages are not accidentally disallowed. A common mistake after a site migration is deploying the staging robots.txt (Disallow: /) to production.

Visit /this-page-does-not-exist-xyz. The server should return HTTP 404 (not 200 with a soft 404 body). The page should offer links back to the homepage and main sections.

If you can trigger a server error in a test environment, verify the response is a human-friendly error page. Stack traces, SQL errors, and framework error dumps must never appear in production.

Use Cypress cy.intercept() or Playwright page.route() to return a 500 for a key API call. The page should display an error state or fallback content — not a blank div or a JavaScript exception in the console.

Log in, expire the session (clear the cookie), then navigate to a protected route. Expect a redirect to /login?returnTo=<original-path> — not a generic login page that drops the user's intended destination.

Use the Google Tag Manager preview pane or browser Network tab (filter by 'collect' or your analytics endpoint). Each navigation should fire exactly one pageview with the current URL — not the previous page's URL or undefined.

Click the main call-to-action on each key page and verify the analytics event in the Network tab or Tag Manager debug view. Check event name, category, and any custom dimensions (e.g. button_text, page_section).

Inspect analytics network requests during form interactions. Email addresses, phone numbers, and full names should not appear in event payloads, URL parameters, or custom dimensions.