2 ms·
- div soup: e.g. https://design-system.service.gov.uk/components/cookie-banner/ https://design-system.service.gov.uk/components/cookie-banne... The code nests 7
by Eduard 5y ago
- div soup: e.g. https://design-system.service.gov.uk/components/cookie-banner/ https://design-system.service.gov.uk/components/cookie-banne... The code nests 7 levels deep (including the wrapping form element). Turn on DevTools and pull elements out of their containers and delete the now empty containers. You will see it effectively doesn't affect layout both in Desktop and small screen. And with the wrapping class `.govuk-cookie-banner` it's introduced anyways that everything inside it is part of the cookie banner component. No need for `.govuk-cookie-banner__heading`, just match `.govuk-cookie-banner h1`
- More than one skip link: If there are several often-used targets within a page, e.g. main content, search input, language select, etc. See the skip links on https://developer.mozilla.org/en-US/docs/Learn https://developer.mozilla.org/en-US/docs/Learn for an example.
- https://a11y-101.com/development/skip-link
- https://www.w3.org/WAI/WCAG22/Understanding/bypass-blocks