Accessibility

reeeecipe aims to meet WCAG 2.2 at level AA. Here is what has been done, what still falls short, and how to report a problem.

What is in place

• Every page starts with a skip link that jumps to the main content.
• Pages use header, navigation, main and footer landmarks, and each one has a single main heading.
• Every page declares its language. Recipe text only exists in English, so on the Spanish and Dutch pages it is marked as English for screen readers.
• Keyboard focus shows a thick outline in both themes.
• The main buttons and controls are at least 44 pixels tall.
• Light and dark themes follow your system setting, and you can switch between them yourself.
• Scroll-in animations are switched off when your system asks for reduced motion.
• The recipe search has a visible label and announces how many dishes match.

Known problems

• Recipe names, ingredients and steps come from DummyJSON in English only, even on the Spanish and Dutch pages.
• The search announces the number of matches after every key you type, which can get noisy with a screen reader.
• On large screens the photo sheet on the home page has a fixed height, so if you enlarge only the text, a button may be cut off.
• The site has not had a formal audit, and there are no automated accessibility tests yet.

Report a problem

If something gets in your way, Open an issue on GitHub. Mention the page, what you were trying to do, and the browser or assistive technology you use.