JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 7569
  • Score
    100M100P100Q125085F
  • License EUPL-1.2

Page header component for the Municipality of Utrecht based on the NL Design System architecture

Package Exports

  • @utrecht/page-header-css
  • @utrecht/page-header-css/dist/index.css
  • @utrecht/page-header-css/dist/index.mjs

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@utrecht/page-header-css) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Page Header

De page header bevat vaak de volgende onderdelen:

  • Logo (met link naar de homepage)
  • Navigatie
  • Zoekveld
  • Kruimelpad-navigatie
  • Eventueel een melding met een waarschuwing, bijvoorbeeld over een actuele storing.
  • Cookie banner.

Het logo maakt duidelijk wie verantwoordelijk is voor de website en geeft daarmee belangrijke context voor de rest van de pagina.

HTML

Gebruik het HTML <header> element, zodat het automatisch een banner landmark krijgt.

Relevante WCAG eisen

  • WCAG eis 1.3.1: plaats de header in een banner landmark, door het <header> element te gebruiken
  • WCAG eis 1.3.2: plaats de header aan het begin van pagina, maar na de skip links. Zo is het gelijk duidelijk wie verantwoordelijk is voor de pagina die er op volgt.