Hopp til hovedinnhold

Layout

Her kan du lese mer om hvordan vi plasserer innhold når vi lager kommunikasjon. En konsistent layout gjør det lett å kjenne oss igjen.

# Konsept

Design- og layoutprinsippene vi elementer fra redaksjonelle utrykk. På samme måte som Human-Etisk Forbund, rommer en avis også de store temaene – dybde i artikler, kraftfulle meningene i ytringer, informative nyheter, men livsnære hendelser. Vi skal ikke se ut som et tidskrift, men være inspirert av det. Noen overordnede virkemidler vi benytter er: 


# Grid

Når vi refererer til "grid" mener vi et system for å organisere og plassere elementer på en side eller i et design. Det er som et usynlig rutenett som hjelper designere med å oppnå en balansert og strukturert layout.

I vårt design forholder vi oss til en enkel grid med 6 eller 8 kolonner og rader. Formatet har alltid en marg rundt kanten, og bilder og andre elementer plasseres innenfor denne margen for et konsistent uttrykk.

Oppbygging av grid til en instagram-post.
Eksempel på plassering av elementer i en 6x6 grid.
Eksempel på en 8x8 grid på en A3-plakat.
Eksempel på dimensjoner på marginer og mellomrom




# Plassering av bilder

Bruk griddet som veiledning for hvor et bilde skal plasseres på et format. Her er noen anbefalte størrelser på bilder.

Eksempelbilde som viser ulik plassering av bilder.
Anbefalt høyde på bilder i en 8x8 grid. Typisk for plakater i A-formater.
Eksempelbilde som viser ulik plassering av bilder.
Anbefalt bredde på bilder i en 6x6 grid. Typisk for en post på sosiale medier.




# Balanse i komposisjonen

Et prinsipp man kan tenke på er balansen mellom størrelse på tekst og bilde. Har du et stort bilde som dominerer flaten bør du velge en mindre fontstørrelse så ikke elementene slår hverandre i hjel. Hva krever budskapet ditt? Fokus på teksten eller bildet?

Eksempelbilde som viser ulike måter å vekte bilde og tekst i komposisjoner.




# Bruk av linjer

Inspirert av layout fra typisk magasin og avis benytter vi oss av skillelinjer som deler innhold vertikalt og horisontalt. Pass på å ikke overdrive bruken av linjer. De kan typisk brukes for å:

– Skille mellom type innhold

– Utheve et kort budskap

– Utheve en CTA (Call to action)

– Markere en byline

Eksempelbilde som viser hvordan vi bruker streker.
Eksempelbilde som viser hvordan vi bruker streker.
Eksempelbilde som viser hvordan vi bruker streker på nettsidene våre.
Eksempel fra human.no
Eksempelbilde som viser hvordan vi bruker streker i sosiale medier.
Eksempel på linjer som markerer en byline eller CTA-tekst.