Oppsett/malverk for egne nettsteder

Beskrivelse av tilgjengelige oppsett/maltyper for tiltak ved UiO som skal ha eget nettsted.

Noen tiltak p? UiO, som forskningssentre, infrastrukturer og publikumstjenester, kan f? tilbud om eget nettsted utenom UiOs faste malverk og struktur. Her beskriver vi malene som er tilgjengelige for denne typen nettsted.

For detaljert informasjon om vilk?r for ? f? opprettet eget nettsted og betingelsene for ? kunne ta i bruk de ulike maltypene beskrevet her, se retningslinjer for eget nettsted ved UiO

Nettstedsmal med UiO-design ("kontekstmal")

Tiltak som f?r godkjent s?knad om eget nettsted og der UiO er eneste deltaker, skal bruke nettstedmal med UiO-design (tidligere kalt "kontekstmal").

Plassering av navn

P? eget nettsted med UiO-design vises navn p? tiltaket oppe til venstre p? siden, med UiOs navnetrekk plassert i venstre hj?rne. Dersom tiltaket ligger under et fakultet, vises fakultetsnavnet over navn p? tiltaket. 

Skjermdump av forsiden til CELL med logo, enhet og navn markert i farger
Skjermdump fra nettstedet til CELL, plassert under Det juridiske fakultet. Utsnittet viser plassering av UiOs navnetrekk (gr?nt), navn p? fakultet (bl?tt) og navn p? selve tiltaket (oransje).

Toppnavigasjon

Tiltaket f?r egen toppnavigasjon, og f?lger dermed ikke enheten de (eventuelt) tilh?rer. 

Skjermdump av toppmenyen for NSSF
Skjermdump av toppmenyen til CELL. Menypunktene er andre enn p? nettsiden til Det juridiske fakultet og er tilpasset CELLs virksomhet og m?lgrupper. 

Menypunktene i navigasjonen settes opp i tr?d med gjeldende IA, eventuelt i samr?d med sentral nettredakt?r dersom det ikke foreligger IA-mal for den aktuelle typen tiltak. 

Footer

I footer er navn p? tiltaket og UiOs logo plassert under hverandre p? venstre side. 

Skjermdump av footer fra eget nettsted med UiO-design
Skjermdump av footer p? nettstedet til CELL som viser plassering av navn p? tiltak (bl?tt) og UiOs logo (gult).

Grafisk utforming

Nettstedmal med UiO-design f?lger UiOs designmanual for nettsider

Det er mulig ? skape egenart gjennom bilder og grafiske elementer. UiO har en rikholdig fargepalett, som gir mange muligheter for ? utvikle et eget og gjenkjennelig uttrykk. Dette kan for eksempel hentes ut i toppbildet p? forsiden, i bilder til arrangementer og artikler.

For et eksempel p? nettsted i UiO-design som har utviklet egne grafiske elementer, se CREATE - Senter for forskning p? likhet i utdanning.

Eksempler

Eksempler p? egne nettsteder som er satt opp med mal i UiO-design:

Nettstedsmal uten UiO-preg ("fargemal")

Tiltak som f?r godkjent s?knad om eget nettsted og som er likeverdige Å·ÖÞ±­ÔÚÏßÂòÇò_Å·ÖÞ±­Í¶×¢ÍøÕ¾ÍƼö@ mellom UiO og annen institusjon, f?r tilbud om en spesiall?sning med minimalt UiO-preg kalt "fargemal"

Plassering av navn/logo

Fargemalen har ikke UiO-logo ?verst i venstre hj?rne. Tiltaket kan her velge mellom ? ha sin egen logo eller navn p? tiltaket skrevet ut i tekst.

Skjermdump av forsiden til nettsted for Prima
Skjermdump fra forsiden til SFF-et Prima, med senterets logo plassert ?verst til venstre.
Skjermdump fra demo-side med klikkbart navn i topp
Skjermdump fra forsiden til EU-prosjektet Nutriome, med senterets navn i tekst plassert ?verst til venstre.

Se ogs? r?d for utforming av logo til fargemal.

Toppnavigasjon

Nettsiden f?r egen toppnavigasjon. Hvilke menypunkter som settes opp avgj?res av gjeldende IA for den typen av tiltak det er snakk om og eventuelle individuelle tilpasninger. 

Skjermdump av toppmenyen til prima.uio.no
Skjermdump av toppmenyen til SFF-et Prima (gr?nn fargemal)

Footer

I footer vises navn p? senteret og UiOs logo nederst.

Skjermdump av footeren til nettstedet for Prima med navn og UiOs logo markert
Skjermdump fra footeren til PRIMA: Navn p? senter ?verst og UiO-logo nederst.

Grafisk utforming

Fargemalen kommer med et ferdig design, men det er mulig ? velge mellom tre ulike fargeprofiler: bl?, brun og gr?nn. 

Hver profil inkluderer tre nyanser av den aktuelle fargen, som hentes ut i toppmeny, som radfarger, i infobokser/bannere og arrangement uten bilde. 

Det er mulig ? utvikle egne grafiske elementer som hentes ut som bilder eller bilderammer p? nettstedet. Vi anbefaler da at fargene i de grafiske elementene harmonerer: Se r?d for utforming av grafiske elementer til fargemal.

Eksempler

Her er lenker til noen UiO-nettsteder som er satt opp i fargemal:

Nettsted med eget design

Tiltak som f?r godkjent s?knad om eget nettsted og som er likeverdige Å·ÖÞ±­ÔÚÏßÂòÇò_Å·ÖÞ±­Í¶×¢ÍøÕ¾ÍƼö@ mellom UiO og annen institusjon, kan ogs? s?ke om ? f? utviklet et helt unikt, skreddersydd design. Dette inneb?rer et betalt utviklingsprosjekt med IT-avdelingen. Kostnader for et slikt prosjekt starter p? kr 100.000 og m? dekkes av kunden. I tillegg kommer drift og supportavtale p? kr 34.900 per ?r (2023-pris). 

Nettstedmaler og tilpassing av egne visuelle elementer 

? utvikle egne visuelle elementer til bruk i kommunikasjon er en fin m?te ? skape identitet og s?rpreg p?. Tiltak med UiO som eneste avsender gj?r dette innenfor rammene av UiOs designmanual. Tiltak med eksterne Å·ÖÞ±­ÔÚÏßÂòÇò_Å·ÖÞ±­Í¶×¢ÍøÕ¾ÍƼö@spartnere st?r friere i valg av farger og fonter etc, og kan lage egen logo. 

Her er noen tips for ? tilpasse visuelle elementer til nettstedmalene p? best mulig m?te.

For alle som skal lage visuelle elementer til bruk p? nettsted

  • Vi anbefaler ? utvikle et lite sett med gjenkjennbare elementer som kan hentes ut i ulike formater. 
  • Pass p? at byr?et lager elementer tilpasset de bildeformatene som er i bruk p? nett. Dette gjelder b?de hovedbilde for nettstedet, elementer til bannere, arrangement, artikkelsider etc.

Se oversikt over anbefalte bildest?rrelser (gjelder begge maltyper)

For de som skal bruke fargemal

  • Pass p? at de visuelle elementene som skal brukes p? nett er godt tilpasset fargene i fargeprofilen dere har valgt (bl?/brun/gr?nn). Du finner fargekoder i skissene vi har lenket til over.
  • For tiltak som skal utvikle egen logo:
    • Logoen b?r ha rektangul?rt format for ? fungere optimalt p? nett.
    • Maksh?yde for logofeltet p? nettsiden er 60 px. 
    • Logoen b?r inkludere et element/ikon som kan hentes ut i kvadratisk format for favikon p? nett/logo i sosiale medier.
    • Logoen b?r ikke v?re for detaljert, s?rlig med tanke p? visning p? liten skjerm.
    • Logofiler til nettsidene leveres i .svg-format.