Skrifttyper

[helemork]

Nåværende løsning

Vi har allerede noen utvalgte skrifttyper. Det vi ikke har er hvordan fonter skal se ut i forskjellige scenarier. Det har derfor blitt løst forskjellig både innad i og mellom applikasjoner og sider. Disse er ikke i samsvar med retningslinjer, universell utforming eller oss selv. I mange tilfeller også motstridende med vår egen profi og seg selv. Dette er et punkt som trenger en grundig gjennomgang.

Er det en spesiell grunn du vet om til at ting er sånn som de er, og er denne fremdeles relevant?

• Mange ting er løst når det har vært behov for noe.
• Mye er basert på synsing, personlige meninger og hva som passer der og da uten å se på det helhetlige bildet.
• Mye av dette er fordi nåværende profil ikke har noen retningslinjer eller mangelfulle retningslinjer for disse tingene
• Det er også mye som går igjen med litt vri, og det har blitt gjort forsøk på å få ting mer helhetlig, men noe henger igjen fra gammelt av
• Applikasjonene har blitt laget basert på forskjellige utgangspunkt uten å se på progil, og det er benyttet templates fra mange kilder og overtatt gammel kode som hadde med seg en del fra før.

Noen eksempler på løsningene vi har i dag

Artsdatabanken.no overskrifter

Forsiden, stor størrelse:

Der ikke annet er nevnt:

• color: #323232;
• font-family: "Roboto Condensed";
• font-weight: 700; eller ingen satt
• text-align: center;
• line-height: 1em;

Showtekst i hvit:

• ikke i hierarkiet
• color: #FFFFFF;
• text-shadow: 2px 2px 22px #000000, 2px 2px 34px #000000;
• font-size: 48px;
• font-weight: 300;
• line-height: 1.4;

Panel Heading

• ikke i hierarkiet
• font-size: 19px;
• text-transform: uppercase;

Paragraf

• color: #4C4A48;
• font-family: Roboto,"Helvetica Neue",Helvetica,Arial,sans-serif;
• font-size: 15px;
• line-height: 1.42857143;
• font-weight: ingen satt.

Artsdatabanken.no overskrifter som også er lenker

Tile Title (lenke-objektene) Hovedtittel

• ikke i hierarkiet
• font-size: 28px;
• text-decoration: underline;

Lenkerl HOVER, inkl tile title og artikkel

• underlined
• rgb(222, 135, 24)

Nyhetsartikler Lenketekst/overskrift

• line-height: 1.1em;
• font-size: 20px;
• color: rgb(76, 74, 72);

Artsdatabanken.no Lenker i tekst eller uten at de er overskrifter

Flere Nyheter-Lenke

• Ikke markert som lenke, men nøstet inni en lenke.
• color: #337bde; ( color: rgb(51, 123, 222);)
• font-size: 20px;
• line-height: 25.7167px;
• text-decoration: underline;

Flere Nyheter-Lenke:hover

• color: #DE8718; ( rgb(222, 135, 24);)
• line-height: 22px;

Footer lenker i liste

• HAR INGEN HOVER-effekter utover cursor
• color: white;
• font-size: 15px;
• line-height: 21.4333px;
• text-decoration: underline;

Topp Meny -> Utbroder senere

Side-Menyer -> Utbroder senere

Artikkelsidene

h1, h2, h3

• color: #777368;

h1

• color: rgb(119, 115, 104);
• font-size: 40px;
• line-height: 60px;

timestamp

• color: rgb(76, 74, 72);
• font-size: 12.5px;
• line-height: 17.85px;

h3 (hopper over h2)

• font-size: 21px;

Paragraf som før

Vanlige Lenker

• color: #337bde;
• font-size: 15px;
• line-height: 1.42857143;

• text-decoration: underline;

  Vanlige Lenker Hover

• color: #1b57a9;

NiN-kart:

• følger hierarki og egen bestemt fargemal, men har en del snedige unntak.

Artsobs:

• Følger annen fragemal
• Fargene bytter fra underside til underside,
• boldness ikke fast

Ting å ta hensyn til for ny løsning

Stiltyper å ta stilling til

• Farge
• Tykkelse
• Understreking
• Font
• Store eller små bokstaver
• Størrelse
• Utseende på bulletpoints

Scenarier (legg til fler...)

• Hovedoverskrift
• Undernivåer (h1->h6)
• Bullet-liste
• Andre lister
• Navigeringsmenyer
• Navigeringslister
• Lenker i alle sine tilstander
• Knapper
• Vanlig tekst
• Ingress-tekster +++

Kilder, Bakgrunnstoff og anbefalt lesing

• Her ønsker vi å samle relevant fagstoff for akkurat denne tingen, lenker er topp
• Skriv gjerne en info til det du refererer til og hva det omhandler
• Finnes det lovverk som påvirker temaet?
• Finnes det punkter i Universal Utforming som påvirker temaet?
• Finnes det Generelle retningslinjer (f.eks fra ISO) som sier noe om hvordan dette bør løses?
• Finnes det vanlige best practice andre steder som er relevante?'

Målgruppe

• Har denne spesifikke tingen en konkret målgruppe som skiller seg fra siden forøvrig?
• For eksempel om noe skal rettes mot barn, lærere, allmennheten eller fagpersoner bør håndteres forskjellig. I noen tilfeller er det relevant å ha egne versjoner av ting for utvalgte grupper.

Forslag til løsninger

• Har du noen forslag til løsninger, kom med dem her.
• Det er veldig fint om det henger med en begrunnelse
• Også topp om det lenkes/refereres til noe i kilde-avsnittet som grunnlag for det man foreslår.