Hero

Bliv klogere på brugen af Hero-elementet, og læs om anbefalingerne til best practice.

Formål

Heroen er designet til at blive placeret øverst på enten forside eller sektionsside, og har den funktion at den er med til at hjælpe brugeren med at afkode indholdet på siden.

Det er muligt både at bruge elementet med og uden tekstboks. Ved brugen af tekstboks, kan du med kort og præcis kommunikation lede brugeren ind på undersider, der kan være vigtige at henvise til. 

Sådan gør du

  1. Hero-elementet kan kun placeres på en forside eller en sektionsside. Du indsætter det ved at vælge paragrafelementet 'Hero' blandt de andre paragrafelementer.
  2. Vælg layout: Vælg "Almindelig teaservisning" 
  3. Vælg udseende: Vælg om heroens tekstboks skal være mørk eller lys, så den passer til det samlede visuelle udtryk på siden. 
  4. Vælg billede: Se vejledende størrelser i hjælpeteksten i din back end.
  5. Beskær dit billede, så det passer bedst til de forskellige skærmstørrelser (desktop / tablet / mobil). 
  6. Metadata til billedet er en slags intern note, du kan bruge til at søge efter i medieoversigten. Besøgende på sitet vil ikke kunne se dette. 
  7. Når du udfylder felterne til tekstboksen, skal du bestemme dig for Emne, som er det lille ord øverst i boksen. Du skal udfylde titelfelt og titel til mobil, hvis du vil have indflydelse på orddelingen.

Tips og best Practice

Vis alle

Alternativ tekst på billeder

I langt de fleste tilfælde skal du ikke give dit billede et kort beskrivelse i feltet 'Alternativ tekst', da størstedelen af de billeder, som bliver brugt, er stemnings- og pyntebilleder. I de enkelte tilfælde hvor en beskrivelse er nødvendig til at blive brugt af skærmlæser, skal du skrive denne under 'Alternativ tekst'. 

Kommunikationen i tekstboksen

Heroelementets tekstboks er ment som en kommunikation til brugeren, hvor der enten kan linkes til underside med en kort teasertekst og en linkknap eller bruges som en velkomst til brugeren, hvor der bliver kommunikeret, hvad hjemmesiden indeholder.  

Brødteksten i WYSIWYG-feltet, bør være så kort som muligt, så du både sikrer al teksten kan være i boksen, og så du bevarer den længere kommunikation på den underside, der linkes til. 

En sigende linktekst

Ved linktekster skal du være opmærksom på at skrive en tekst, der er tilgængelig og giver mening for brugeren. Skriv for eksempel aldrig 'Klik her', men hellere 'Læs om de nye kolonihaver', så du specificerer hvad der linkes til. 

Brug så vidt muligt en kort linktekst i tekstboksens link-knap. Lange linktekster fungerer særlig dårligt på mobilvisningen. Korte tekster på knapper er ligeledes best practice. 

Eksempel