Accordeon
UI-patroon: een lijst inklapbare secties waarvan een klik de inhoud openklapt. Toont veel informatie zonder het scherm te vullen, vooral gebruikt voor faq's, zijmenu's en instellingenpagina's.
Native HTML kent <details><summary> (een accordeon van de browser zelf, zonder JS). Eigen implementaties: React Bootstrap, Mantine Accordion, Radix UI Accordion (headless), shadcn/ui. Toegankelijkheid: ARIA aria-expanded en aria-controls. Over de UX wordt gediscussieerd: accordeons verlagen de informatiedichtheid maar verbeteren de focus — handig voor "scannen versus lezen". Klassieke valkuil: het animeren van de hoogte loopt in moderne browsers vast (height: auto is niet animeerbaar); gebruik interpolate-size: allow-keywords (CSS 2024) of @starting-style.