Sidhuvud

Beskrivning

Sidhuvudet består i tur och ordning av en stödnavigation och därunder logotyp, webbplatsens namn, samt den primära navigationen. Den primära navigationen innehåller eventuella e-tjänster, sök och en utfällbar meny som även kan innehålla en klusternavigation om en sådan finns för den webbplats man är på. 

Specifikation och design

På dator placeras logotyp, webbplatsens namn och den primära navigation på en rad efter varandra. På mobil och stående tablet placeras den primära navigationen under logotyp och webbplatsens namn.

Sidhuvudets delar

Stödnavigationen består av ett antal länkar och knappar, till exempel Favoriter eller språklänkar. Bakgrunden är bakgrundsgrå. För dig som surfar med dator finns exempel högst upp ovanför den primära navigationen. För dig som surfar med mobil eller tablet finns exempel inne i den utfällbara menyn.

Varje länk eller knapp i stödmenyn är svart Open Sans 16px och har en svart ikon på vänster sida.

Logotypens höjd är 48px (32px på mobil).

Logotypen och webbplatsens namn ligger mot vit bakgrund.

En ljusgrå vertikal linje om 1px som är lika högt som logotypen skiljer logotypen från namnet. Linjen är placerad 48px från logotypen och namnet 20px från linjen. Namnet är centrerat i höjdled mot linjen.

Webbplatsens namn är skrivet i Stockholm Type Regular 20px svart (16px på mobil).

Den primära navigationen består av länkade knappar med olika bakgrundsfärg, en funktionsikon och vit text i Stockholm Type Regular 20px. Knapparna har bakgrundsfärg och funktionsikon enligt följande:

  • E-tjänster: lila med vitt kugghjulsfönster
  • Sök: svart med vitt förstoringsglas
  • Meny: blå med vit pil ner eller när menyn är utfälld ordet Stäng och ett kryss. 

Den utfällda menyn innehåller länkar till sidor på webbplatsen. Menyn fälls ut genom att klicka på knappen "Meny" i den primära navigationen.

Menyn har vit bakgrundsfärg. Det finns en grå linje överst, underst och mellan varje länk.

Länkarna delas upp i två kolumner på dator (ej på mobil). Den aktuella sidan är endast text, inte en länk.

Syftet med klusternavigationen är att visa andra relevanta webbplatser. Om det inte finns, visas inte klusternavigationen.

Klusternavigationen finns inne i den utfällbara menyn och består av en rubrik och ett antal länkar.

Klusternavigationens bakgrund är bakgrundsgrå. Rubriken är svart i Stockholm Type Bold 20px. Länkarna är svarta i Open Sans 16px.

Uppdaterad