Front-End-Checklist

Use when reviewing image assets, markup, and CDN or build transforms related to Manage inline SVG size and complexity. Check encoded size, rendered size, loading strategy, and above-the-fold impact together.

Use when reviewing templates, rendered HTML, or shared components related to Add Subresource Integrity to external scripts. Validate the final browser-facing markup, not just the source framework abstraction.

Use when reviewing card grid layouts with misaligned content areas, or any nested grid where child items need to align with sibling cards' corresponding sections without JavaScript intervention.

Use when reviewing stylesheets, component styles, and responsive behavior related to Lint CSS and SCSS files. Check the rendered layout across breakpoints and interaction states before proposing a fix.

Use when auditing metadata, crawlability, structured data, or indexability related to Add structured data markup. Verify the rendered HTML and HTTP response rather than relying only on source files.

Use when reviewing server-side rendering setup, Next.js App Router pages, or Node.js HTTP handlers to verify that HTML is streamed incrementally rather than buffered until completion.

Use when applies primarily when creating new content pages. Low priority for existing indexed pages where redirect risk outweighs gain. Use when building a slug naming convention.

Use when reviewing error handling middleware, API route handlers, or server responses for security-sensitive information disclosure.

Use when reviewing image assets, markup, and CDN or build transforms related to Use srcset for responsive images. Check encoded size, rendered size, loading strategy, and above-the-fold impact together.

Use when reviewing image assets, markup, and CDN or build transforms related to Use image sprites where appropriate. Check encoded size, rendered size, loading strategy, and above-the-fold impact together.

Use when optimising multi-page navigation performance, reducing INP on page transitions, or implementing progressive enhancement for fast page loads.

Use when reviewing stylesheets, component styles, and responsive behavior related to Keep CSS specificity low and flat. Check the rendered layout across breakpoints and interaction states before proposing a fix.

Use when applies to any site with user-generated slugs, CMS-generated URLs, or content in non-English languages. Use when auditing URLs for crawl errors or canonicalization issues.

Use when auditing slow page loads, heavy assets, or rendering delays related to Provide source maps for production debugging. Verify the actual bottleneck in DevTools, Lighthouse, or field data before recommending changes.

Use when applies to business websites, personal brand sites, and publisher sites. Use when setting up Organization schema or auditing E-E-A-T signals for sites in competitive or YMYL categories.

Use when applies to blog posts, product pages, and any content page with editable URL slugs. Use when building a URL strategy for a new site or auditing existing URLs for keyword inclusion.

Use when reviewing rendered HTML, interactive components, or design-system patterns related to Include a skip navigation link. Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output where relevant.

Use when reviewing rendered HTML, interactive components, or design-system patterns related to Implement 'Skip to Content' links. Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output where relevant.

Use when auditing metadata, crawlability, structured data, or indexability related to Create and submit an XML sitemap. Verify the rendered HTML and HTTP response rather than relying only on source files.

Use when applies to any site with a manually or programmatically generated XML sitemap. Use when debugging sitemap submission errors in Google Search Console.

Use when applies to sites that have recently migrated from HTTP to HTTPS, changed domain name, or have www/non-www redirect configurations. Use when sitemap submission reports low coverage.

Use when applies to content sites, e-commerce stores, and any site where timely indexing of new pages matters. Use when investigating why new pages take a long time to appear in search results.

Use when applies to any site with a dynamically generated or manually maintained XML sitemap. Use when investigating crawl errors or after a site migration that removed pages.

Use when applies to blog posts, news articles, tutorials, and other long-form content. Less relevant for product pages, service pages, or home pages. Use when optimizing content distribution.

Use when reviewing authenticated user flows or long forms. Check both client and server behavior: warning timing, dialog accessibility, autosave frequency, timeout extension, and post-login state restoration.