Webbplats och digitala tjänster

Navigation

Huvudnavigering samt prioriterade funktioner så som Välj region, Sök, Logga in m.m. ligger i sajthuvudet och den sekundära navigeringen i form av t.ex. Om oss, Kontakt, Aktuellt m.m. ligger längst ner på sidan i sajtfoten. I all navigering använder vi de röda färgerna för klickbara objekt - detta framför allt för att särskilja navigation från webbplatsens övriga interaktiva objekt (länkar, formulär m.m.).

Dator

Toppnavigation

Toppnavigeringen är placerat direkt under sajthuvudet. Mörkröd text på vit bakgrund. Alla menyelement måste få plats på samma rad i datorvyn. Tänk på hur långa menyrubrikerna blir, dvs antalet tecken, samt hur de blir på andra språk. Font: Inter-UI, normal, 400, 22 px. 
Menyn är vänsterställd. Avstånd mellan rubriker: 30 px.

Toppnavigation dator

Funktionsmeny

Funktionsmenyn innehåller globala funktioner så som Sök, Logga in etc. Funktionsmenyn kan fälla ut paneler med ytterligare funktionalitet, tex Lyssna, Sök eller leda till en ny sida som Logga in eller Hitta vård. Globala funktioner visas med ikon och text. Menyn är högerställd och nya funktioner fylls på åt vänster.

Funktionsmeny

Megameny

Megamenyn visar upp länkar till underliggande sidor (endast en nivå ner i strukturen) för en snabb överblick samt enkel navigering. Röd text på rosa bakgrund. 
Megamenyn har en yta till höger där man kan visa upp en puff. Syftet är att kunna lyfta sådan man vet är ofta efterfrågat eller länka till information man vill sätta fokus på just nu

Megameny dator

Sajtfotsmeny

Länkarna i sajtfoten används som en sekundär navigering för generella ingångar som inte platsar i toppnavigationen eller funktionsmenyn. Exempel på sidor är kontakt, om oss eller andra länkar som kan vara av intresse under hela besöket. Sajtfotsmenyn finns tillgänglig på alla sidor.

Sidfotsmeny dator 1177.se

Brödsmula

Brödsmulan visar sidan man befinner sig på och var den hierarkiskt bor i strukturen, även om sidan inte visas i lokalnavigeringen.

Brödsmula dator 1177.se

Lokalnavigering

Lokalnavigation är en komponent som visar artiklar som finns inom samma ämnesområde. Länkarna som listas leder alltid till artiklar. Komponenten kan innehålla en undernivå, men inte fler än två nivåer.

Lokalnavigering dator 1177.se

På sidan-navigeringen listar länkar till olika kapitel i artikeln som användaren befinner sig i. På sidan-navigeringen har blå färgskala för att skilja den från lokalnavigeringen. På sidan-navigeringen är sticky och följer med även i långa artiklar.

På sidan-navigering dator 1177.se

Mobil

Huvudmeny

Navigeringen ligger i en hamburgermeny som fälls ut. Hamburgerikonen byts då till ett kryss/stängmarkering. Toppnavigationen listas med vit text på röd bakgrund. Undersidor fälls ut och visas inverterat med röd text på vit bakgrund. Snabblänkar till utvalda sidor placeras under den röda huvudnavigeringen och visas på ljusrosa bakgrund.

Huvudmeny mobil 1177.se
Mobilnavigering hopfälld
Huvudmeny mobil utfälld 1177.se
Mobilnavigering utfälld

Funktionsmeny

Funktionsmenyn i mobil ligger under sajthuvudet. Röd text och ikoner på ljusröd/rosa bakgrund. Funktionsmenyn rymmer tre globala funktioner. Finns fler så placeras de i en egen sektion i huvudmenyn, nedanför sektionsstartsidornas rubriker.

Funktionsmeny mobil

Sajtfotsmeny

Sajtfotsnavigeringen i mobil fungerar och ser ut på samma sätt som huvudnavigeringen.

Sidfotsmeny mobil 1177.se

Tablet

Tablets använder mobilnavigeringen för både huvudmeny, funktionsmeny och sajtfotsmeny. Se beskrivning för mobil.

Tablet sidhuvud och sidfot
Till toppen av sidan