Responsive and Accessibility Review

Breakpoint checks

Visual edits should be reviewed on the breakpoints that matter for the site. Header navigation, product grids, checkout flows, account pages, modals, and sticky controls are especially sensitive. Use the responsive workflow before publishing CSS to production.

Accessibility checks

Review contrast, focus states, keyboard reachability, tap targets, text wrapping, reduced-motion behavior, and semantic impact. The accessibility tutorial shows how to pair checks with a CSS approval path.

Approval notes

Every meaningful visual change should include what changed, where it applies, what was tested, and how to roll back. For broad visual work, combine this doc with Theme Assistant basics and the responsive checks tutorial.

Owner and cadence

• Primary owner: designer or developer, with site-owner approval for production visual impact.
• Review cadence: before publishing, after theme updates, and after cache or WooCommerce template changes.
• Escalate when visual work affects revenue-critical pages, accessibility, mobile navigation, or theme behavior outside the intended scope.

Production checklist

• Check header, footer, product grids, checkout, account pages, modals, sticky controls, tap targets, focus states, and text wrapping.
• Test with keyboard navigation, reduced motion, mobile width, desktop width, and any site-specific breakpoints.
• Capture the affected URL, target selector, intended visual outcome, reviewer, and rollback note for every meaningful visual change.
• Review mobile, desktop, keyboard focus, reduced motion, contrast, checkout, cart, account, and navigation behavior before publishing.

Acceptance checks

• No important content overlaps, disappears, becomes unreadable, or traps keyboard focus.
• The approval note names the breakpoints and accessibility checks that passed.
• The proposed CSS or presentation output can be traced to a specific page, component, and design goal.
• The reviewer can reject, revise, or roll back the change without guessing which selectors were affected.

Common mistakes

• Publishing broad CSS from a single preview without checking logged-out, mobile, checkout, account, and cache states.
• Using external design references as production assets instead of review context.

Related operations

• Run the accessibility tutorial.
• Run the responsive checks tutorial.
• Use Responsive and Accessibility Review before visual publishing.
• Use Client Presentation Workflow when an agency needs client approval.
• Use Publishing and Rollback for Theme Changes before approving production CSS.
• Use Multi-Page Consistency Checker before broad component updates.
• Use Design Tokens and Style System before token-level changes.