Big Cartel Accessibility Checklist 2026 | WCAG 2.1 AA & EAA Compliance

Open Customize Design > Colors and copy the accent color hex value into the WebAIM Contrast Checker (webaim.org/resources/contrastchecker). Test it against your main background color and against any secondary background. If either combination is below 4.5:1 for normal text or 3:1 for large text, darken or saturate the accent until it passes. Keep your brand color for hero imagery and product photos where decorative use does not need to meet contrast ratios; reserve a compliant variant for text and interactive elements.

Edit each product, scroll to the image upload area, and hover or click the photo to expose the Alt Text field. Write a short, specific description of what the image shows in roughly 8 to 16 words: a phrase like 'Hand-printed cotton tea towel with mustard yellow citrus pattern' is enough. For variant photos that show the same product in a different colour, lead the alt text with the differentiator: 'Same towel in deep blue.' Avoid starting with phrases like 'Image of' or 'Photo of' since assistive technology already announces it as an image.

On paid plans, open Customize Design > Custom Code and inject CSS that floats the placeholder above the input as a persistent label, or replace the placeholder with a real <label for="email"> via the theme HTML. On the free plan, where custom code is unavailable, choose a theme variant whose contact form already shows persistent labels (the Sandbox and Snowflake themes both do as of April 2026). Avoid relying on the placeholder for any field that handles a name, email address, or shipping detail.

On paid plans, paste the following into Customize Design > Custom Code (CSS): button:focus-visible, .btn:focus-visible, a.btn:focus-visible { outline: 3px solid #b14e74; outline-offset: 2px; } using your compliant accent color. Test by pressing Tab repeatedly from the top of any product page and confirming the ring appears around every interactive element. On the free plan, ask Big Cartel support which themes ship with a visible focus ring by default; the Birthday and Foundry themes have stronger focus styles than the older Anchor or Snow themes.

Big Cartel's hosted cart and checkout do not expose the error template directly, but two mitigations work. First, in the Cart Notes field on the Settings page, write a short note such as 'If a field turns red after Place Order, it usually means the country is unsupported or stock has changed. Email [email protected] and we will fix it.' Second, on product pages, add inline copy under the variant selector explaining which countries you ship to and any minimum-quantity rules so most buyers never reach the silent error state. File a feature request with Big Cartel support asking for text-based error messaging in the hosted cart.

Disable the scrolling announcement bar in Customize Design > Theme Settings and replace it with a static, full-width announcement using a single line of theme HTML. If you need to rotate multiple messages, switch them on a daily basis manually rather than via animation. On paid plans, you can also paste a short script that respects the prefers-reduced-motion media query so the animation only runs for visitors who have not asked their operating system to reduce motion.

Create a new Page in your Big Cartel admin titled 'Accessibility' and link to it from the footer of every page (Customize Design > Footer Links). State the WCAG version you are working toward (typically 2.1 AA), name the platform (Big Cartel), list the known limitations honestly (for example, the hosted cart and checkout are controlled by Big Cartel and may have separate behavior), and include an email address that is monitored at least once per business week. Update the page whenever you change theme or add a third-party widget.