# Header Displays the City’s logo at the top of every page, and optionally a navigation menu. Includes the name of the application if it is not the general website. ## Guidelines - The Header must be used on all websites and applications for the City of Amsterdam. - It includes the logo of the City or the organization, the site title (except for the general website), and a menu with links to commonly used pages. - The Header is important because it conveys our corporate identity and is the first thing people see. Using it consistently helps users recognize and trust the website. - The Header is the same on every page of the application, although full-screen pages may hide it, e.g. a video or a map. - The inline menu can contain a maximum of 5 items. The last two will often be ‘Search’ and ‘Menu’. - The 'Menu' button opens a collapsible menu, which has room for more links. - On narrow windows, links can move from the inline menu to the collapsible one. - Labels should be short to help the inline menu fit on a single line whenever possible. - An icon can be added to the end of a link to make its destination easier to guess. - For websites with a brand name that feature the standard Amsterdam logo, only the emblem is shown on narrow screens. ## References - A Header is a [landmark](https://www.w3.org/TR/wai-aria-practices-1.1/#aria_landmark_roles) and can be used to group navigation elements. - [WCAG 3.2.3](https://wcag.com/designers/3-2-3-consistent-navigation/) Consistent Navigation: Navigation menus that appear on multiple pages are consistent.