Grafisk Design Guideline
|
|
- Gustav Steffensen
- 8 år siden
- Visninger:
Transkript
1 Grafisk Design Guideline SKAT Portal <Accepteret af/den> <Accepteret af/den> Forfatter (Author): Kim Bille Version: Oprettet (Created): Seneste ændret (Last Modified): :33 Fil (file): \\Ncserver33\Consulting\Clients \SKAT\Fase 1\Slutdokumentation\Final\SKAT 1 PORT Grafisk Design Guideline v05.00.doc Tilgængelig på dansk: Ja Available in English: No
2 Dokument log (Document log) Opdateret (updated) Version Forfatter (Author) Ændringer (Changes) Michael Strand Andet udkast baseret på feedback fra workshop 3-1b Michael Strand Opdateret på workshop Michael Strand Opdateret med fremsendte sider der skal være indeholdt Michael Strand Opdateret jf. SKAT s kommentarer Leni Barfred Ændringer til Kap 1, 3. 4, 5, 6, Leni Barfred Tilføjet beskrivelse af det valgte design Leni Barfred Tilføjet fontstørrelser, pixels, farver etc fra PlusPeople Kim Bille Rettelser p.bg.a SKATs kommentarer Leni Barfred Ændringer pga. M6 kommentarer fra SKAT Leni Barfred Nyt design for noter og kampagnebokse Kim Bille Efter CSC Review Leni Barfred M.6.2 review kommentarer indarbejdet Kim Bille Indarbejdelse af forbladskommentarer Jesper Klitgaard Opdateret til version Jesper Klitgaard Opdateret på baggrund af kravmapning Jesper Klitgaard Opdateret til verison Kim Bille Sammenflettet version 1,8,1 og version Kim Bille Ændringer pga ÆØ018 og ÆØ022, PCbrugervenlighedstest og ifm Iteration Kim Bille Ændringer ifm ÆØ Michael Strand Indsat indeks efter aftale med Heidi Stocklund Jesper Klitgaard Rettelser efter GDG review v Jesper Klitgaard Rettelser efter GDG review v03.01 anden runde Jesper Klitgaard Rettelser efter GDG review v Jesper Klitgaard Rettelser efter GDG review v Kim Bille Opdateret til slutdokumentation Jonas Holgaard Levring Opdateret p.b.g.a. SKATs kommentarer Kim Bille Opdateret ifm. review runde 2 kommentarer Kim Bille Opdateret ifm. godkendelse Jesper Klitgaard Opdateret til endelig version. Dokument log for ÆØ-Portal006 Opdateret (updated) Version Forfatter (Author) Ændringer (Changes) Ændringer udført i forbindelse med ÆØ Portal006 har taget udgangspunkt i version 1.6 er nærværende dokument. Efter review processen med SKAT er ændringerne blevet flettet ind i version 2.2 og fået versionsnummer 2.3 (se her over) Kim Bille Ændringer pga. ÆØ-Portal006 (branched) Kim Bille Review af ÆØ-Portal Kim Bille Review 2 af ÆØ-Portal006 Version: Side: 2 af 176
3 Indholdsfortegnelse (Content) 1 Generelt om design Mission Designstrategi Fleksibelt design Variabel skærmstørrelse Variabel skriftstørrelse Udskifteligt design Målgruppe Anvendelse Design elementer Farvepalette Tabelfarver i portalområderne Portletoverskrift farver i portalområderne Typografi Fonte Farver på links Grafiske elementer Billeder Ikoner Pile Gennemgående elementer Log ind / Log ud Felt-hjælp Kalender Brug af alt- og title-tag Gif-filer tilknyttet portalen Navigationsprincipper Grundlæggende navigationsprincipper Topbaren Hjælpemenu Servicemenu Logobjælke Topmenu Venstremenu Venstremenu i vejledninger Justerbar venstremenu Anbefalede niveauer Navngivning af menupunkter Antal menupunkter Orientering i struktur Højrespalte Højrespalte for internet Højrespalte for intranet Søg Funktionsområde Relateret information Højrespalte for vejledninger Speciel brødkrumme Style for brødkrumme Til top Version: Side: 3 af 176
4 3.7.1 Style for Til top Fanebladsnavigation Åbning af sider i nyt vindue Brugervenlighedsprincipper Generelt om brugervenlighed Simpel søgning Overskueligt og forudsigeligt sidedesign Nedtonet og troværdigt design Dansk brugerdialog Generelt om tilgængelighed Synshæmmede Nedsat motorisk funktion Farveblinde Genvejstaster og funktionstaster Tabulator navigation Positionering af cursor Alternative tags Tilgængelige tabeller Sideopbygning Generelt om sideopbygning Generelle regler for brug af gitteret Størrelsesangivelser til gitteret Portlet dimensioner og skalerbarhed Portlet uden toolbar Portlet med toolbar Portlet toolbar Interaktion mellem forskellige portlets Én information skal kun indtastes én gang Data findes ud fra indtastet information Side-elementer Links Korrekte links Ukorrekte links Links eller knapper Informationsportlet Punktopstilling Style for punktopstilling Inputfelter Beslutningstræer Beslutningstræer - guide Beslutningstræer stifinder Grafiske billedillustrationer Kampagneportlet Knapper Style for knapper Placering af knapper Nyheder Nyheder i indholdsområdet Nyheder i højrespalten Paging (sideskift og nummerering) Paging indenfor portlets Style for paging Version: Side: 4 af 176
5 6.10 Radiobuttons og checkbokse Korrekt brug af radiobuttons Ukorrekt brug af radiobuttons Ledetekster Radiobuttons i stedet for dropdown Style for radiobuttons Tabeller Indholdstabeller Opsætningstabeller Lister Grupperet liste Indekseret liste Sorteret liste Style for lister Noter Style for noter Virksomhedsoplysninger Style for visning af virksomhedsoplysninger Rammer og linjer Fejlmeddelelser Valideringsfejl Forretningsfejl Systemfejl Dropdowns i 2 niveauer Datoformat Guides Procesguides Non-procesguides Browser og tegnsæt Browserunderstøttelse Tegnsæt Skabelon-sider Skabelon: Internetforside Skabelon: Intranetforside Skabelon: Underforside til portalområde Skabelon: Tema-side Skabelon: Indholdsside Skabelon: Forside til vejledning Skabelon: Underside til vejledning Skabelon: Tabel Skabelon: Beslutningstræ guide - vandret Skabelon: Beslutningstræ guide - lodret Skabelon: Beslutningstræ stifinder Skabelon: Pressemeddelelse Skabelon: Afgørelse Specifikke sider Søgeresultat Udvidet søgning Glemt brugernavn Min side Foretag personalisering Vælg arbejdsroller Version: Side: 5 af 176
6 9.6 Tilmelding til nyhedsmail Side med vist note A-Å oversigt Sitemap Udskriv Elev i SKAT Kontakt os Joboversigt Navngivning på portalen Navngivning af knapper Bilag: Guidelines for HTML, CSS og Javascript Om HTML Om CSS (Cascading Style Sheets) Om Javascript Bilag: CSS-reference til udvalgte elementer Indeks Version: Side: 6 af 176
7 1 Generelt om design Indeværende dokument er en Grafisk Design Guideline, som er tiltænkt website administratorer og andre leverandører af nye udvidelser til internet, intranet eller ekstranet hos SKAT SKAT har en lang tradition for at prioritere godt design. Det gode design bruges både som forretningsmæssigt værktøj og til at udtrykke værdier. SKATs webtilstedeværelse skal demonstrere den samme kvalitet og signalere de værdier, som er kendetegnende for det øvrige SKAT. Denne guide beskriver de forskellige elementer, layoutet og logikken bag designet og navigationen. Dermed sikres en konsekvent og positiv oplevelse - også selvom mange forskellige designere har været involveret. Det nye design, og især den stærkt forbedrede navigationsfunktionalitet, vil kunne skabe en stærkere appeal og et væsentligt forbedret image for SKAT, i og med kunderne lettere finder de relevante nye informationer og tilbud på og SKATs intranet og ekstranet. Dette stiller til gengæld krav til de ressourcer hos SKAT, som forestår vedligeholdelse og udbygning af sitet. 1.1 Mission Den overordnede målsætning for designet, er at skabe et univers, som er fleksibelt, og opfylder de kommunikationsmæssige krav brugerne og SKAT har til hjemmesiden her og nu samt i fremtiden. Design og teknik er indbyrdes afhængige, og et uhensigtsmæssigt design kan fordyre, eller ligefrem umuliggøre, den tekniske implementation. Websitet skal kunne modtage og effektivt behandle besøgende fra vidt forskellige målog interessegrupper, med vidt forskellige forudsætninger. Derfor vil det fremtidige website være smidigt i designet, således at alle tilgodeses, samtidig med at kommunikation og branding fastholdes og udvikles. Designprojektet skal primært sikre branding grafisk konsistens navigationsmæssig overskuelighed variationsmuligheder i layout håndtering af database publicering i skabelon-baseret layout at brugerne får hurtig og nem adgang til de korrekte informationer Udfordringer Fastholde designet uden at gøre sitet for ufleksibelt. Version: Side: 7 af 176
8 Skabelonbaseret layout uden at virke standardiseret og maskinelt Holde sitet enkelt Fastholde koncept/layout over tid Signalere troværdighed og seriøsitet med vores design. 1.2 Designstrategi Enkelhed Effektivt, funktionelt og let gennemskueligt. Dette er ikke det samme som et afpillet design, hvor alle ikke-funktionelle elementer er overflødige elementer. Designet skal befordre klar, hurtig og entydig kommunikation og information. Imødekommende Åbent, venligt og gennemsigtigt design, der håndterer alle brugeres niveau på en naturlig, fleksibel facon. Troværdigt Skat er en offentlig institution som ønsker at udstråle troværdighed til borgerne. Seriøst Mange andre offentlige institutioner, jurister og andre bruger SKATs hjemmeside til seriøse formål. Standarder og retningslinier Designet skal overholde WWW Consortiums standarder og offentlige retningslinier. 1.3 Fleksibelt design Designet er fleksibelt på forskellige måder. For det første er designet fleksibelt på den måde at designet kan fungere til forskellige skærmstørrelser, samt med forskellige skriftstørrelser. Derudover er designet fleksibelt i og med det let kan udskiftes, hvis SKAT får ny visuel identitet. Version: Side: 8 af 176
9 1.3.1 Variabel skærmstørrelse Designet er tilpasset 1024 * 768 pixels, men kan fungere på 800*600 uden større gener for brugeren. Der er ingen maksimum på skærmstørrelser, som understøttes. Dette betyder at designet også virker på 1280x1024. Der er 1 fastbredde element i venstre side og 1 fastbredde element i højre side. Herimellem ligger et element, som kan variere i bredden afhængigt af bredden på brugerens browservindue. Billeder, som anvendes på portalen, skal derfor også kunne fungere i det fleksible design. I praksis vil billederne blive dynamisk beskåret i bredden. Dvs. at fotografier og illustrationer, som skal bruges i øverste del af forside-skabelonerne enten 1) skal have hovedmotivet i venstre side eller 2) skal være af repetitiv/mønster karakter (som f.eks. frisen med mennesker) Variabel skriftstørrelse Designet kan vises uden problemer med forskellige skriftsstørrelser, således at det bliver mere tilgængeligt. Layoutet ødelægges ikke selvom brugeren vælger den størst mulige skriftsstørrelse. Der er ikke anvendt grafisk tekst, da denne ikke understøtter variabel skriftsstørrelse Udskifteligt design Hvis SKAT får ny visuel identitet, inden eller når portalen er gået i luften, kan designet uden større vanskeligheder udskiftes med et nyt grafisk koncept. Hele designet kan implementeres vis Cascading Style Sheets. Ingen design-elementer må derfor implementeres direkte i HTML-siderne på portalen. Alle sider skal benytte de fælles CSS-filer, som er udviklet til portalerne. Hvis SKAT ønsker et andet grafisk koncept er det blot et spørgsmål om at udskifte CSS-filerne og portalerne vil fremtræde i det nye grafiske koncept. 1.4 Målgruppe Guidelinen er udarbejdet til SKAT-medarbejdere eller leverandører, som skal udvikle nye sider til internet, intranet eller ekstranet hos SKAT. Dokumentet henvender sig til både interne udviklere som udvider og vedligeholder portalrammeværket og til eksterne udviklere som udvikler på baggrund af portalrammeværket. Det forudsættes, at læseren har kendskab til HTML. Version: Side: 9 af 176
10 1.5 Anvendelse Den grafiske design guideline indeholder en beskrivelse af det grafiske design for SKAT.dk, SKATs intranet og SKATs ekstranet. Guidelinen beskriver hvilke elementer, der kan anvendes ved opbygning af portalen, samt de overvejelser omkring brugervenlighed og tilgængelighed, der har ledt til, at designet for de enkelte elementer ser ud, som de gør. Der er beskrevet 2 slags elementer: 1. faste grafiske elementer, som udviklere og designere skal forholde sig til, men som ikke må ændres 2. sideelementer eller byggeklodser, som kan anvendes ved opbygning af nye sider Elementerne skal anvendes og se ud, som beskrevet, for at give brugerne en ensartet oplevelse på portalerne. Ensartethed og forudsigelighed er et vigtigt element i en god brugeroplevelse. Guidelinen anvendes som et opslagsværk. Men retningslinjerne som er angivet skal overholdes: Design elementer Navigationsprincipper Brugervenlighedsprincipper Sideopbygning Side-elementer Browser og tegnsæt Skabelon-sider Specifikke sider Bilag: Navngivning på portalen Indeholder beskrivelse af designets grundelementer såsom fonts, farver, størrelser, krav til logo, link farver osv. Beskriver navigationselementerne i designet herunder top-menu, venstremenu og højrespalte. Beskrivelse af de principper for brugervenlighed og tilgængelighed, der er lagt vægt på i designet. Layout for sideopbygningen beskrives med størrelsesangivelse på de forskellige sideelementer. De enkelte byggeklodser, som kan anvendes ved opbygning af nye sider beskrives. Oversigt over browsere, som designet understøtter. Skabelonerne som på nuværende tidspunkt er identificeret og designet. Skabelonerne skal anvendes, når der designes og udvikles nye sider til portalerne. Afsnittet viser eksempler på centrale specifikke sider, som kan anvendes som inspiration ved udvikling af nye sider. Beskriver de ord, der er valgt for centrale begreber i designet. Version: Side: 10 af 176
11 Bilag: Guidelines for HTML, CSS og Javascript. CSS-reference til udvalgte elementer Beskrivelse af, hvorledes HTML-siderne skal bygges op. Afsnittet indeholder en beskrivelse og eksempler på styling af de mest udbredte elementer. Version: Side: 11 af 176
12 2 Design elementer I de efterfølgende afsnit beskrives de enkelte grundelementer som indgår i designet såsom fonts og farver. 2.1 Farvepalette Farvepaletten fra SKATs designmanual skal benyttes for at sikre harmoni og ensartethed i kommunikationen. Designelement Farvenavn Hexadecimal Eksempel Min side Gul #FFC61E Hjælpe-funktionalitet Gul #FFC61E Om os Koksgrå #3F6075 Privat Lilla #72166B Erhverv Blå #005BBF Juridisk information Grøn # Processer Turkis #00A5D1 Bibliotek Lilla #72166B Enheder Pink #CC00A0 Netavisen Grøn # Værktøjer Lime #CEE007 Foreninger Turkis #00A5D1 Fejlmeddelelser Pink #CC00A0 Note-baggrund Lys gul #FFFAEB Portletramme Lys grå #CDD6E0 Hover top menu Gul #FFC61E Obligatorisk felt (Pink stjerne) Pink #CC00A0 Paging Aktiv pil Koksgrå #3F6075 Paging Inaktiv pil Mørke grå #A5B8C9 Version: Side: 12 af 176
13 2.1.1 Tabelfarver i portalområderne I hele dette afsnit henviser farveangivelserne til nedenstående tabel. Yderligere er det nyttigt at læse dette afsnit i sammenhæng med det specifikke afsnit om tabeller, afsnit Rækker i alle tabeller farves skiftevis i koksgrå-nedtone 1 og koksgrå-nedtone 2. I tabeller, hvor det er muligt at sortere på en række, har rækkeoverskrifterne farven koksgrå, mens farven i tabeller hvor der ikke kan sorteres er hvid. Når der klikkes på en række for at sortere, skifter farverne for den sorterede række til portalområdefarverne. Således er rækkeoverskrifterne nu den ikke tonede portalområdefarve, og rækkerne skifter mellem de to nedtonede portalområdefarver. Farve Valgt sortering Standard Blå #005BBF #3F Nedtonet 1 #CCE0ED #EAEFF2 - Nedtonet 2 #EFF5FF #FFFFFF Grøn # #3F Nedtonet 1 #CEE6E3 #EAEFF2 - Nedtonet 2 #F2FAF9 #FFFFFF Lilla #72166B #3F Nedtonet 1 #EADCE9 #EAEFF2 - Nedtonet 2 #F8F5F8 #FFFFFF Turkis #00A5D1 #3F Nedtonet 1 #EAEFF2 #EAEFF2 - Nedtonet 2 #EFF9FF #FFFFFF Gul #FFC61E #3F Nedtonet 1 #FBF8DB #EAEFF2 - Nedtonet 2 #FDFBEB #FFFFFF Pink #CC00A0 #3F Nedtonet 1 #F4D6ED #EAEFF2 - Nedtonet 2 #FCF2FA #FFFFFF Lime #CEE007 #3F Nedtonet 1 #F4F8C5 #EAEFF2 - Nedtonet 2 #F9FBE2 #FFFFFF Version: Side: 13 af 176
14 Koksgrå #3F6075 #3F Nedtonet 1 #CCD4D9 #EAEFF2 - Nedtonet 2 #EAEFF2 #FFFFFF Portletoverskrift farver i portalområderne Følgende tabel angiver farverne for portlet overskrifter afhængigt af det portalområde portletten er placeret i. For hvert portalområde er forgrunds- og baggrundsfarverne for H1, H2, H3 og H4 angivet. Hver farve er angivet med sin hexadecimal værdi og selve farven. Portalområde H1 (Forgrund Baggrund) H2, H3 og H4 (Forgrund Baggrund) Privat #00000 #FFFFF #00000 #72166B Erhverv #00000 #FFFFF #00000 #005BBF Juridisk information #00000 #FFFFF #00000 # Om os #00000 #FFFFF #00000 #3F6075 Processer #00000 #FFFFF #00000 #00A5D1 Bibliotek #00000 #FFFFF #00000 #72166B Enheder #00000 #FFFFF #00000 #CC00A0 Netavisen #00000 #FFFFF #00000 # Værktøjer #00000 #FFFFF #00000 #CEE007 Foreninger #00000 #FFFFF #00000 #00A5D1 Version: Side: 14 af 176
15 Min side #00000 #FFFFF #00000 #3F Typografi Fonte Tekstelement Hex Farve Størrelse Stil Andet Brødtekst # Sort 11 regular Skydning 14 pixels Nedtonet tekst #7C98AE Grå Samme som den tekst, der står når teksten ikke er nedtonet Portlet brødtekst # Sort 11 regular Skydning 14 pixels Hjælpetekst # Sort 11 regular Skydning 14 px Bundtekst # Sort 11 regular Skydning 14 px Verdana skal anvendes overalt. Skriftsnittet er tegnet til skærmbrug og fremtræder meget læsbart på skærmen. Alternativ font, hvis brugerens browser ikke understøtter Verdana, er Arial. Nedenstående tabel viser farve, størrelse, stil og skydning for generelle tekstelementer på portalen. Tekstelementer som er specielle for de enkelte side-elementer på portalen såsom Forrige, Næste, til top, knap-tekster etc. er beskrevet under afsnit 6 Sideelementer. Hjælpe- /servicemenu # Sort 11 regular Skydning 14 px Overskrifter i brødtekst # Sort 11 fed Skydning 14 px Overskrifter i portlet # Sort 13 fed Skydning 18 px Overskrifter i indholdsom åde H1 # Sort 13 fed Skydning 18 px Version: Side: 15 af 176
16 Introduktion til siden # Sort 11 Regular Skydning 18 px Kanttekst # Sort 11*0,9 fed Skydning 14 px X til afkrydsning # Sort 11 fed NY! i vejledninger #f9eaad Portalområde forgrund/gul 11 fed Skydning 19 px baggrund Venstremenu # regular Skydning 19 px H1 # Sort 18 bold Skydning 18 (mellem overskrift og brødtekst) H2 # Sort 16 bold Skydning 18 (mellem overskrift og brødtekst) H3 # Sort 14 bold Skydning 18 (mellem overskrift og brødtekst) H4 # Sort 12 bold Skydning 18 (mellem overskrift og brødtekst) H5 # Sort 12 bold, italic Skydning 18 (mellem overskrift og brødtekst) H6 # Sort 11 bold Skydning 18 (mellem overskrift og brødtekst) Version: Side: 16 af 176
17 2.2.2 Farver på links Nedenstående tabel beskriver linksfarverne, som skal anvendes på portalens sider. Link placering Ikke besøgte Besøgte Hover Topmenu Forgrund: #ffffff (hvid) Aktivt topmenupunkt har gif i portalområdets farve som understregning Forgrund: #ffc61e (gul) Brødtekst Forgrund: # (sort) understreget Forgrund: #9e5f0e (brun) understreget Forgrund: #3f6075 (grå) Baggrund: #ccd6e0 (lysegrå) Venstremenu # (sort) # (sort) # (sort) Understreget Aktuelt punkt i venstremenu Portalområdets farve Portalområdets farve Portalområdets farve Juridisk vejledning (Venstremenu) # (grøn) understreget # (grøn) understreget # (sort) understreget Juridisk vejledning (Tekst) #9E5F0E (brun) understreget #9E5F0E (brun) understreget Forgrund: #3F6075 (grå) Baggrund : #CCD6E0 (lysgrå) Understreget Portlets/lister # (sort) Understreget Forgrund: #9e5f0e (brun) understreget Forgrund: #3f6075 (grå) Baggrund: #ccd6e0 (lysegrå) Funktionsområde Forgrund: #3E6074 (mørkegrå) Forgrund: #3E6074 (mørkegrå) Forgrund: #3E6074 (mørkegrå) Version: Side: 17 af 176
18 Udvidet søgning, Forgrund: Forgrund: Forgrund: Hele personalefortegnelsen #3E6074 (mørkegrå) #3E6074 (mørkegrå) #3E6074 (mørkegrå) til top, til sitemap, #3E6074 #3E6074 #3E6074 alfabetisk oversigt (mørkegrå) (mørkegrå) (mørkegrå) Min side Forgrund: Forgrund: Forgrund: #3F6075 #3F6075 #3F Grafiske elementer Billeder Billeder skal kunne fungere ved høje såvel som lave opløsninger. Dvs. de skal kunne skaleres. Nedenstående tabel viser størrelser for de forskellige billed-elementer, som skal anvendes på portalen. Gif og Jpeg er de formater det anbefales der anvendes. Yderligere understøttes det at anvende SVG-billedefiler, dog anbefales det at ikke at anvende dette format, da ikke alle browsere har indbygget understøttelse for SVG. Andre formater må ikke anvendes. Placering Type Størrelse Internet, forside jpg 830*66 px Forside til portalområde jpg 658x149 px Kampagneboks jpg eller gif 58x130 px Ikoner Størrelsen på ikoner er: Jpg/gif 15x15 pixels Der må kun anvendes farven #3E6074 (mørkegrå) til ikoner. Eneste undtagelse herfra er spørgsmål-tegnet til yderligere felt info. Følgende tabel indeholder de ikoner, der må anvendes: Ikon Anvendelse Spørgsmåltegn til yderligere felt info Version: Side: 18 af 176
19 Kalender-ikon til datofelter Hjælp til siden Større skrift Tilknyt note Åben pdf Udskriv siden Tilføj til nyhedsmail Tilføj til Mit arkiv Linket åbner i nyt vindue FAQ (Anvendes kun på hjælpesider) E-learning (Anvendes kun på hjælpesider) Login Logud Pile Pilene som fremtræder i paging-elementer og til top er gif filer med en størrelse på 5x7 pixels. Fig. 1: til top, Næste, Forrige pile Pilene, som anvendes til at vise, hvorvidt der er yderligere punkter under et menupunkt i venstremenuen, samt anvendes foran links i portlets, er gif filer med en størrelse på 3x5 pixels. Fig. 2: Markering i venstremenu af underpunkter Fig. 3: Markering i venstremenu af åbnet underpunkt Pile er indfarvet i portalområdets farve. Version: Side: 19 af 176
20 2.4 Gennemgående elementer Log ind / Log ud I topmenuen findes ikon for log ind henholdsvis log ud. Min side er nedtonet med en grå tekst, hvis brugeren ikke er logget ind. Den nedtonede tekst suppleres med en title attribut, der adviserer (via tale, hvis brugeren har en skærmlæser) at linket er ikke aktivt og kræver indlogning. Desuden er hængelåsen lukket. Fig. 4: Log ind Når brugeren er logget ind, er hængelåsen åben, og der står i stedet Log ud. Eksemplet nedenfor viser at brugeren er på Min side, hvorfor Min side menupunktet er markeret gult. Fig. 5: Log ud Felt-hjælp Felthjælp er indikeret med et spørgsmålstegn. Spørgsmålstegnet er en gif. Når brugeren klikker på spørgsmålstegnet kommer der en hjælpeboks: Version: Side: 20 af 176
21 Fig. 6: Hjælpeboks Følgende retningslinjer gælder for felthjælp og for placering af spørgsmålstegns ikonet. For tekstbokse, tekstområder, drop-downbokse, listebokse og trækontroller placeres ikonet umiddelbart efter feltet. o For elementer der strækker sig over flere linjer placeres ikonet på øverste linje. (Det drejer sig f.eks. om tekstområder, listebokse og trækontroller) For radiobuttons og checkbokse placeres ikonet umiddelbart efter ledeteksten. Har flere felter en samlet ledetekst/overskrift, kan ikonet placeres umiddelbart efter på samme linje Knytter felthjælpen sig til hele portletten, placeres felthjælpsikonet i øverste højre hjørne af portletten Kalender Til højre for alle datoer, hvor brugeren har mulighed for at indtaste en dato, skal der være en stiliseret kalender, som vist her: Fig. 7: Eksempel på brug af kalender-ikon Når brugeren klikker på kalenderen vises en datovælger. I datovælgeren er dagsdato markeret. Der er mulighed for at bevæge sig en måned frem og tilbage ved klik på pilene i toppen og bevæge sig frem og tilbage i år ved klik på pilene i bunden. En dato vælges til feltet ved at klikke på datoen i datovælgeren eller at tabbe sig frem til den rigtige dato, og klikke på Enter. Datovælgerne har altid nedenstående udseende. Fig. 8: Datovælgeren Version: Side: 21 af 176
22 Style for datovælger Farve på titellinjen Farve på tekst og pile i titellinjen Ramme om valgte dato (dagsdato ved første visning) SKAT-blå. Hvid SKAT-gul Brug af alt- og title-tag Al grafik skal ledsages af beskrivelse i alt-taggen. Alt-taggen (som rent kode-mæssigt er en attribut) bruges til at angive en alternativ tekstuel beskrivelse af et stykke grafik. Denne beskrivelse bliver brugt i tilfælde hvor det ikke er muligt at vise grafik. For eksempel vil en skærmlæser oplæse teksten fra alt-taggen. Udover alt-taggen kan title-taggen bruges til at give en tekstuel beskrivelse af et område. Title-taggens tekst vises når musemarkøren holdes over, som vist i figuren nedenfor. Teksten vil se forskellig ud fra browser til browser, da browserens standard visning af title-tags anvendes. Fig. 9: Eksempel på visning af title-tag fra Internet Explorer. Nogle browsere vil vise alt-taggen på steder, hvor title-taggen ikke er defineret. Generelt anvendes alt-taggen på grafiske elementer og title-taggen på non-grafiske elementer. For nogle elementer vil det være muligt at angive begge, men dette bør undgås for ikke at få skærmlæsere til at stamme. 2.5 Gif-filer tilknyttet portalen Nedenstående tabel viser de generelle gif-filer, som skal anvendes på portalen. Anvendelse Spørgsmålstegn til yderligere felt info Kalender-ikon til datofelter Maximer portlet Rediger portlet Hjælp til portlet Minimer portlet Navn images/icon_info.gif images/icon_calendar.gif images/btn_windowbox_expand_[portalområde].gif images/btn_windowbox_edit_[portalområde].gif images/btn_windowbox_help_[portalområde].gif images/btn_windowbox_minimize_[portalområde].gif Version: Side: 22 af 176
23 Højrepil i Næste Venstrepil i Forrige Fejl-pil (gul pil som peger på fejlbehæftet felt) Hjælp til siden Større skrift Tilknyt note Åben PDF Udskriv siden Tilføj til nyhedsmail Tilføj til personligt arkiv images/btn_next_[portalområde].gif images/btn_prev_[portalområde].gif images/icon_error_arrow.gif.gif images/icon_pagetools_help.gif images/icon_pagetools_font_change.gif images/icon_pagetools_make_note.gif images/icon_pagetools_pdf.gif images/icon_pagetools_print.gif images/icon_pagetools_subscribe.gif images/icon_pagetools_my_achive.gif Version: Side: 23 af 176
24 3 Navigationsprincipper 3.1 Grundlæggende navigationsprincipper Navigationen i portalen foregår primært i topbaren og i venstremenuen. I højrespalten er der navigation til relateret information. Indholdsområdet kan ligeledes indeholde portlets, som via links leder brugeren til andre sider i portalen (lokal navigation). Fig. 10: Grundskabelon for portaldesignet Alle skabeloner til portalen er bygget over ovenstående skabelon, for at skabe genkendelige sider for brugeren. Brugeren vil således altid kunne stole på, at uanset om han kommer ind på et område udviklet af den ene eller anden del af SKATs organisation, så vil navigationen altid være at finde de samme steder. Version: Side: 24 af 176
25 Udover at give adgang til indhold via portalstrukturen i top- og venstremenu, er det muligt at anvende portlets på selve indholdsområdet til lokal navigation via en listeportlet, tabel-portlet eller links. 3.2 Topbaren Topbaren på både SKAT.dk og intranettet består af 3 elementer: 1. Hjælpe- og servicemenu, som findes i 1. linie 2. Logo bjælke er det gule område med logo 3. Topmenu er det grå område, hvor portalens områder ses Fig. 11: Opbygning af topbaren Hjælpemenu Hjælpemenuen anvendes til at give adgang til vigtige elementer af sitet, som ikke naturligt er en del af indholdshierakiet. Der er tale om elementer, som kan hjælpe brugeren med at anvende sitet. Menuen implementeres som standard hyperlinks i fed tekst placeret horisontalt adskilt af. er lavet som gif-fil uden tilhørende alt-tag Hjælpemenu - internet Fig. 12: Hjælpemenu - internet Hjælpemenuen indeholder følgende elementer: Forside SKAT.dk Går til portalens forside Tilgængelighed Åbner side hvor det beskrives, hvad der findes af funktionalitet på sitet for at gøre det tilgængeligt. På siden kan der ligeledes henvises til hvor der kan downloades gratis skærmlæsere mm. Tilgængelighed skal ligge først af hensyn til skærmlæsere. Version: Side: 25 af 176
26 Sitemap Åbner portalens sitemap, hvor det fremgår hvor brugeren står. Hjælp til SKAT.dk Indholdsområde med sider, som forklarer hvorledes portalen anvendes. På SKAT.dk forklares f.eks. funktionalitet såsom Tilknyt note, Opret konto mm. Kontakt os Adgang til mailformularen Hjælpemenu - intranet Fig. 13: Hjælpemenu - intranet Hjælpemenuen indeholder følgende elementer: Forside - Intranet Går til portalens forside Sitemap Åbner portalens sitemap, hvor det fremgår hvor brugeren kom fra. Hjælp til intranet Indholdsområde med sider, som forklarer hvorledes portalen anvendes Servicemenu Servicemenuen anvendes til at give adgang til vigtige serviceelementer på sitet, som ikke naturligt er en del af indholdshierakiet. Servicemenuen implementeres som hjælpemenuen som standard hyperlinks i fed tekst placeret horisontalt adskilt af Servicemenu internet Nedenfor ses servicemenuen for internettet. Fig. 14: Servicemenu internet Nyhedsmail Oprettelse eller vedligeholdelse af abonnementsfunktionalitet. Version: Side: 26 af 176
27 Links Indholdsside med links til eksterne danske og internationale sites. Translated information Indholdsområde, hvor indhold med andet end dansk sprog findes. Der er ikke tale om en sprogversionering af sitet Servicemenu intranet Nedenfor ses servicemenuen for intranettet. Fig. 15: Servicemenu - intranet Links Indholdsside med links til eksterne danske og internationale sites. Ekstranet Åbner ekstranettet i selvstændigt vindue. SKAT.dk Åbner den offentlige hjemmeside i selvstændigt vindue Logobjælke Under hjælpe- og servicemenuen findes logo-bjælken, som tydeligt viser brugeren, hvor han befinder sig. Logobjælken har SKATs karakteristiske gule farve. Logobjælken indeholder SKATs logo højrestillet. Brugeren kan klikke på logoet for at komme til forsiden af portalen. Fig. 16: Logobjælke - internet På intranettet vises desuden navnet på portalen i venstre side af logobjælken. Fig. 17: Logobjæke - intranet Ved klik på logobjælken sendes brugeren til forsiden af skat.dk hhv. forsiden af intranettet. Version: Side: 27 af 176
28 Logo SKATs logo skal altid fremstå så klart som muligt uden at blive forstyrret af andre visuelle elementer. SKATs logo består af tre elementer: kronen, den gule cirkel og navnetræk. Der er defineret en respektafstand omkring logoet. Respektafstanden er overholdt i portaldesignet, og skal overholdes, hvis logoet ønskes anvendt andre steder på portalerne. Der skal altid være mindst 1 x?s? om hele logoet, som vist på eksemplerne nedenfor. Fig. 18: SKAT logo De præcise regler for brug af logo findes i sektion Mærker og navnetræk i Designmanual for Skatteministeriet, Landsskatteretten og SKAT Topmenu Top-menuen giver adgang til 1. niveau i portalstrukturen samt til Log ind/log ud og Min side. Min side er nedtonet i topmenuen, indtil brugeren har logget ind på SKAT.dk. På intranettet er Min side altid aktiv. Hvis brugeren er logget ind på SKAT.dk, står der i menuen Log ud i stedet for Log ind. Hver indgang på niveau 1 af portalstrukturen får egen farvekode. Farvekodningen slår igennem på flere design-elementer i de forskellige side-skabeloner, som gennemgås senere i denne guideline. Topmenuen skal altid være tilgængelig, så brugeren har let adgang til hele portalen, og så brugeren får tillid til portalen, idet navigationen er konsekvent og forventelig. 1. niveau i portalstrukturen kaldes også segmenter. For alle segmenter gælder det at de har en unik forside og at denne forside vises når der klikkes på segments titel i topmenuen. Ligeledes er forsiden for et segment tilgængelig fra venstremenuen. Titlen Version: Side: 28 af 176
29 på denne forside er Forside - <segmenttitel>, hvor <segmenttitel> erstattes af titlen på segmentet Aktuelt menupunkt Farvekodning anvendes i topmenuen til markering af det aktuelle område i form af en understregning af portalområdets titel (eksempelvis den blå bar under Erhverv). Markeringen er med til at hjælpe brugeren til at huske, hvor han er. Markeringen suppleres med et title-tag der adviserer (via tale, hvis en skærmlæser er installeret) om markeringens hensigt. Fig. 19: Indikering af aktuelt menupunkt i topmenuen, her Erhverv Mouseover i topmenu Mouseover og tastaturfokus på punkterne i topmenuen indikeres ved at farve teksten gul, som det fremgår af figuren nedenfor. Fig. 20: Mouseover i topmenuen, her vist på Erhverv Internet topmenu Topmenuen indeholder følgende punkter på internettet: Fig. 21: Topmenu - internet Intranet topmenu Topmenuen indeholder følgende punkter på intranettet: Fig. 22: Topmenu - intranet Version: Side: 29 af 176
30 3.3 Venstremenu Navigation i underområder af et portalområde understøttes af venstremenuen. Der er selvstændig venstremenu for hvert af portalområderne i topmenuen (niveau 1). Fig. 23: Eksempel på venstremenu Venstremenuen indeholder adgang til niveau 2 og derunder i portalstrukturen. I toppen af venstremenuen vises navnet på portalområdet i dettes farve, hvor navnet er klikbart. De enkelte menupunkter er holdt i sort. Det aktive menupunkt er markeret i portalområdets farve. Venstremenuen folder 1 menupunkt ud ad gangen. Hvis brugeren klikker på et menupunkt i træstrukturen, åbnes menupunkterne under dette punkt op, samtidigt med at punkterne under det menupunkt, som før var åbent lukkes. Der anvendes en venstre-pil, hvis der er underpunkter til menupunktet. Hvis der ingen underpunkter er, anvendes en 2x2 pixels firkant som bullit. Pilene og bullits er i portalområdets farve. Der vises en nedadgående pil, hvis et menupunkt er åbnet, som vist i figuren for menupunktet TastSelv. Version: Side: 30 af 176
31 3.3.1 Venstremenu i vejledninger I vejledninger indeholder venstremenuen en indholdsfortegnelse til vejledningen i stedet for portalnavigationen. Der navigeres således internt i vejledningen via venstremenuen. Da de enkelte punkter i indholdsfortegnelsen kan være meget lange, er venstremenuens bredde dynamisk. I toppen af indholds-fortegnelsen vises vejledningens navn. For at gøre menuen tilgængelig for alle gives der herefter mulighed for at vælge menuens bredde ved et enkelt klik på Smal Mellem Bred linksene. Version: Side: 31 af 176
32 Fig. 24: Eksempel på venstremenu for vejledninger Fig. 25: Eksempel på fold ud/ind af venstremenu Desuden indsættes et link med togglefunktion der muliggør at man kan vise eller skjule menuen. De enkelte punkter i indholdsfortegnelsen er farvet i portalområdets farve og understreget. Afsnit i vejledningen som indeholder ny information er markeret i indholdsfortegnelsen med teksten NY! foran teksten. Teksten i selve afsnittet er omkranset med samme markering: NY! her i mellem står den nye tekst NY!. For brugere med browsere som tillader drag-funktionalitet, kan brugeren trække i kanten af menuen for at gøre den større eller mindre. Menuen åbner i standardbredden for venstremenuen. Standardbredden muliggør både browsing i indholdsfortegnelsen og læsning af indholdet i indholdsområdet. Når brugeren har scrollet sig frem til indhold, kan han justere bredden for at få mere plads til at læse indholdet i vejledningen. Når brugeren skal findes et specielt kapitel i vejledningen, er en bred indholdsfortegnelse af foretrække. Da brugeren ikke kan se hele titlen på punkterne i indholdsfortegnelsen, med mindre de har valgt en meget bred menu, er der mouse-over på menupunkterne. Den fulde titel ligger således i title-attributten. Vejledninger åbner i et nyt browservindue, så brugeren ikke mister sin placering i portalstrukturen ved at venstremenuen erstattes af vejledningens indholdsfortegnelse. Brugeren vil altid kunne lukke vejledningen og være tilbage til det sted i strukturen, hvor han klikkede på vejledningen. Version: Side: 32 af 176
33 Venstremenuen indeholder 3 elementer Titlen på vejledningen Links til at skifte størrelsen på venstremenuen Indholdsfortegnelsen Justerbar venstremenu Såfremt der er flere menupunkter der er for lange til standard menu layout, er det muligt at benytte den justerbare venstremenu, som er tilfældet i afsnit Dette er eksempelvis tilfældet ved administrations portalen, hvor der er flere menuelementer der er for lange til at indpasse sig under en normal menustruktur Anbefalede niveauer De første 5 niveauer er rykket ind i forhold til hinanden, dvs. underpunkter er rykket ind i forhold til det menupunkt, de hører under. Portalen understøtter brug af så mange niveauer, som portaladministratoren for et område ønsker, da der kan forekomme meget dybe portalområder. Fra niveau 5 og ned vil niveauer dog vises venstrestillet. Dvs. underpunkter vises venstrestillet med det menupunkt de hører under, som illustreret nedenfor. Menupunkt 2.1 Menupunkt Menupunkt Det frarådes kraftigt at anvende en portalstruktur, som giver en venstremenu dybere end 5 niveauer. Dette giver i realiteten mulighed for en portalstruktur med 6 niveauer, idet niveau 1 ligger i top-menuen Navngivning af menupunkter I navngivningen af menupunkter i venstremenuen bør der anvendes sigende titler, så brugeren får en klar idé om, hvad han kommer til ved at vælge menupunktet. Dette gælder også for navngivning af menupunkter i beslutningstræer og guides. Titler bør ikke være længere end 25 karakterer. Portalen foretager ombrydning af menupunkter, hvis de ikke kan være i venstremenuen i bredden. I indholdsfortegnelser til vejledninger foretages der ingen ombrydning af punkterne. Der vises den del af titlen, som kan være indenfor den bredde, som brugeren har valgt. Version: Side: 33 af 176
34 3.3.5 Antal menupunkter Det er ikke muligt at anbefale et maksimalt antal menupunkter til venstremenuen. Det optimale antal afhænger af indholdet, der ønskes tilgang til i venstremenuen. Det bør dog tilstræbes, at venstremenuen ikke overskrider 1 browserside (i en opløsning på 1024*768), for at sikre at brugeren ikke overser væsentlig information ved at den er skjult udenfor siden, da det er et kendt problem, at de færreste brugere scroller til side 2 af en side. Der kan forekomme tilfælde, hvor højden på venstremenuen er længere end højden på sideindholdet. Her vil længden af venstremenuen bestemme længden for siden. Der vil ikke forekomme scroll på venstremenuen. Dvs. at bundlinien for siden bliver flyttet i forhold til venstremenuens længde. 3.4 Orientering i struktur Ved gennemgående at anvende topmenu, venstremenu og brødkrumme som navigationselementer er portalstrukturen gjort meget tydelig og let tilgængelig for brugeren. Brugeren kan til hver en tid orientere sig i forhold til, hvor i strukturen han befinder sig på en af følgende måder: Det aktuelle menupunkt i topmenuen er markeret Det aktuelle menupunkt i venstremenuen er markeret Der er brødkrumme i toppen af indholdsområdet, som viser indholdets placering i portalstrukturen Brugeren kan klikke på Sitemap i hjælpemenuen. Når Sitemap åbnes vil det være markeret hvilket område på portalen, brugeren befinder sig på Logobjælke på alle portalsider hjælper brugeren til at huske, hvilket site han er på Hjælpefunktioner er gjort tilgængelige i hjælpemenu/servicemenu på alle sider 3.5 Højrespalte Højrespalten findes på alle portalsider og består som hovedregel af følgende elementer: Søgeportlet (fast element) Funktionsområde (fast element) Relateret information (valgfrit element) I nogle specielle tilfælde hvor der er bruge for ekstra meget plads til indhold, kan en designer vælge at fravælge en eller begge af de faste elementer i højrespalten og Version: Side: 34 af 176
35 benytte den ekstra plads til indhold. Det findes to layouts i portal rammeværket der under støtte dette, en med fast og en med fleksibel venstremen (se Developer Guide afsnit 4.6 og Appendiks C). Da der er lagt væsentlig funktionalitet i højrespalten bør den så vidt muligt holdes fri for reklame-agtige portlets, for at undgå at brugeren mentalt blokerer for indholdet. Brugere har en klar tendens til at overse indhold som minder om reklame. Følgende elementer opfatter brugere som reklame, og de må derfor ikke anvendes i højrespalten: Elementer som bevæger sig Billedelementer Højrespalte for internet Fig. 26: Højrespalte - internet Højrespalte for intranet Intranettets højrespalte indeholder desuden portlet til Find kollega. Derudover har den samme elementer som højrespalten til internettet. Version: Side: 35 af 176
36 Fig. 27: Højrespalte intranet Søge-portlet findes øverst i højrespalten. Søgeportletten har samme grafiske udtryk uafhængigt af, hvor på portalen den findes. Funktionsområdet har ligeledes samme grafiske udtryk overalt på portalen. I funktionsområdet er Udskriv side og Hjælp til siden lagt hhv. øverst og næstøverst, for at brugeren nemmere skal kunne få øje på muligheden for udskrivning og hjælp. Udskriv side, Hjælp til siden og Større skrift skal findes på alle sider. Hvorvidt de øvrige funktioner skal være til stede afhænger af den skabelon, som siden bygger på. Illustrationen ovenfor viser bruttolisten af funktionaliteter i funktionsområdet. På intranettet kommer Find kollega-portletten efter funktionsområdet. Find kollegaportletten er som alle øvrige portlets indfarvet i portalområdets farve. Efter funktionsområdet kommer information som relaterer sig til indholdet i indholdsområdet. Relateret information samles i en til flere portlets afhængig af om der er tale om Aktuelt, Genveje eller anden information, som i tilfældet ovenfor. Version: Side: 36 af 176
37 3.5.3 Søg Søgeportletten kan af portaladministratoren konfigureres til at søge på: det aktuelle portalområde det aktuelle dokument (i forbindelse med vejledninger) hele portalen alle kilder Søg skal stilles til rådighed på alle portalsider. Der kan dog fraviges fra dette princip såfremt søgeportletten er til mere forvirring end gavn for brugeren Funktionsområde Funktionsområdet findes på alle portalsider, hvor der som minimum altid vil være Hjælpe til siden, Udskriv side og Større skrift. Nedenstående viser den komplette liste over funktioner, som er tilgængelige i højrespaltens funktionsområde: Udskriv side Åbner dialogside for printervenlig version af siden. Kun indholdsdelen af en side udskrives. Venstremenu, topmenu og højrespalte udskrives ikke. Hjælp til siden Adgang til hjælp for siden. Hjælpen åbnes i en pop-up, så brugeren kan se siden, han har spørgsmål til samtidigt med hjælpen til denne. Hjælpe-funktionen vises kun i højrespalten, hvis der findes hjælpetekst til indholdssiden. Abonnér Giver brugeren mulighed for at abonnere på det aktuelle indhold. Abonner vises kun i højrespalten, hvis der er tale om en ren indholdsside. Der kan ikke abonneres på en forside, formular eller tabel. Vis som PDF Anvendes f.eks. på vejledningssider, hvor der findes PDF udgave af indholdet. Aktivér note Gør det muligt at knytte en personlig note til det aktuelle indhold. Tilknyt note kan kun være aktiv på sider, hvor der er indhold med indhold fra DAP, som er unikt identificeret. Tilføj til Mit arkiv Giver brugeren mulighed for at gemme et link eller en søgning til dennes personlige arkiv. Større skrift Tilgængelighedsfunktion som kan anvendes til at få indholdet vist med større skrift. Funktionen er en nem adgang til browserens Version: Side: 37 af 176
38 standardfunktionalitet til ændring af skriftstørrelse, da de færreste brugere kender til denne Relateret information Højrespalten anvendes til at linke til information, som relaterer sig til indholdet på siden. Der kan også vises små smagsprøver til relateret information, f.eks. en portlet med en titel og et udsnit af et stykke indhold Højrespalte for vejledninger Højrespalte for vejledninger er bygget op som vist nedenfor. Højrespalten er nærmere beskrevet under skabelonen for vejledninger i afsnit 8.6. Version: Side: 38 af 176
39 Fig. 28: Højrespalte - vejledninger 3.6 I toppen af indholdsområdet vises en brødkrumme. Brødkrummen viser indholdets placering i portalstrukturen i modsætning til brugerens vej til indholdet. Brødkrummen fortæller således brugeren: Her er du Hvis en bruger er kommet til en indholdsside, som ligger i niveau 3 i venstremenuen, vil der være 3 trin i brødkrummen, uafhængigt af om brugeren er kommet til siden via søgning eller via navigation i venstremenuen. Brødkrummerne er klikbare, så en bruger kan komme et skridt eller flere tilbage i portalstrukturen. Brødkrumme findes på alle portalsider, som kan fremfindes via top-menu eller venstremenu. Fig. 29: Eksempel på brødkrumme for portalområdet Erhverv Hvis indholdet i brødkrummen overstiger bredden i toppen af indholdsområdet, ombrydes teksten, så brødkrummen fylder mere end 1 linie Speciel brødkrumme Brødkrummen anvendes i vejlednings-skabelonen til at vise, hvor i vejledningen brugeren står. Dvs. den fulde sti til vejledningen vises ikke. Nedenstående eksempel viser en brødkrumme til ligningsvejledningen, som fylder mere end 1 linie. Fig. 30: Eksempel på brødkrumme fra ligningsvejledningen Portalsider, som ikke ligger i portalstrukturen, såsom Log ind, Sitemap etc., har ingen brødkrumme. Version: Side: 39 af 176
40 Fig. 31: Eksempel på portalside uden brødkrumme Style for brødkrumme Font: Verdana, regular, 10 px, hex: # 3f6075 Baggrund: hex:# ced8e2 3.7 Til top I nederste højre hjørne af indholdsområdet kan der anvendes et til top link, som brugeren kan benytte til at komme til toppen af den aktuelle side. Dette link vil forekomme på alle sider. Pilen efter teksten har SKAT blå farve. Fig. 32: Eksempel på til top element Style for Til top Font: som brødtekst link Pil: gif i SKAT blå farve 3.8 Fanebladsnavigation På siden for sitemap er der anvendt fanebladsnavigation i venstremenuen, da siderne ikke ligger i strukturen. Ingen sider, som findes i portalstrukturen, må anvende denne form for navigation i området for venstremenuen. Det grafiske udtryk følger principperne for farvepaletter for det gældende portalområde. Se i øvrigt den portal specifikke side for sitemap i afsnit 9.9 Version: Side: 40 af 176
41 3.9 Åbning af sider i nyt vindue Som udgangspunkt åbnes der i portalen, så brugeren oplever en lineær proces. Det betyder, det ikke vil være tilladt at åbne op i nyt vindue. En lineær proces sikrer brugeren et støjfrit handlingsforløb, og brugeren kan lettere bevare overblikket på, hvor de befinder sig på portalen. Beslutningen beror på der er interne brugere og eksterne brugere. Undtagelser for ikke at åbne i portalen er følgende. o Vejledninger o Hjælp til siden o Eksterne link o E-learning o Og systemer der ikke er integreret på portalen endnu. Disse anses for at være områder, hvor brugeren vil have behov for krydsreference, hvor brugeren anvender et nyt åbent vindue som en støtte til det område de sidder og arbejder/læser om. Er et vindue åbnet udenfor portalen gælder, at man ikke åbner endnu et nyt vindue i dette. Undtagelse er eksterne links. Version: Side: 41 af 176
42 4 Brugervenlighedsprincipper De følgende afsnit omhandler, hvilke overvejelser der ligger bag designet i forhold til brugervenlighed og tilgængelighed. Brugervenlighed defineres som: Nemt at lære: Hvor let er det for brugere at udføre en opgave første gang de stifter bekendtskab med et design. Effektivt: Hvor hurtigt kan brugere som kender designet udføre en opgave. Genkendeligt: Hvor hurtigt kan en bruger genlære brugen af designet, efter ikke at have anvendt det i en periode. Undgår brugerfejl: Hvor mange fejl begår brugere, hvor alvorlige er de, og hvor nemt kan en bruger komme videre efter en fejl. Tilfredshed: Hvor behageligt er det at anvende designet. Tilgængelighed derimod drejer sig om at gøre et site tilgængeligt for brugere, som enten ikke kan se, høre, bevæge sig, er ordblinde eller ikke kan bruge tastatur og mus. Dvs. at gøre sitet tilgængeligt for brugere med funktionsnedsættelse. 4.1 Generelt om brugervenlighed Brugeres problemer med at anvende en portal kan deles op i forskellige kategorier. Statistisk set står informationsarkitekturen og indholdet for størstedelen af brugeres problemer med at anvende et site. Derudover har brugere problemer med: 1. Søgning 2. Side design 3. Fancy grafisk design I designet er der derfor lagt vægt på: simpel søgning overskueligt og forudsigeligt sidedesign nedtonet og troværdigt design seriøsitet Informationsarkitektur og indhold kan portaldesignet ikke kontrollere. Det er op til de enkelte indholdsleverandører at gøre portalerne brugervenlige på disse områder. Det er en forudsætning at indholdsleverandører følger anvisninger i denne guide for at sikre brugervenligheden og tilgængeligheden. Herunder specielt de grundlæggende designprincipper i dette afsnit. Version: Side: 42 af 176
e-tinglysningsprojektet
E-BUSINESS SOLUTIONS FROM CSC e-tinglysningsprojektet Løsningsspecifikation: Design Guide Dokumentoplysninger Titel: Projekt: e-tl Løsningsspecifikation, Design Guide e-tl (Elektronisk Tinglysning) Placering:
Læs mereActiveBuilder Brugermanual
ActiveBuilder Brugermanual Forfatter: TalkActive I/S Dato: Juni 2004 Version: R. 1.01 Sprog: Dansk Copyright 2004 - Talk Active - all rights reserved. Indhold: 1. INDLEDNING...2 2. QUICK-START...3 3. OPBYGNINGEN
Læs mereSelv om websites er yderst forskellige i deres fremtræden, så kan de stort set alle sammen passes ind i den skabelon som er illustreret herunder:
Design en praktisk guide. Et design udtrykker dit websites grafiske udseende, lige fra hvilke skrifttyper der anvendes op til hvor navigationen er placeret og hvilke interaktive elementer der skal benyttes.
Læs mereMANUAL. Siteloom CMS
MANUAL Siteloom CMS www.hjerteforeningen.dk/cms Brugernavn: Password: 3. september, 2012 BASIS FUNKTIONER 1. Kalender... 4 1.a. Opret... 5 1.b. Rediger eller slet... 8 2. Sider... 10 2.a Opret side...
Læs merefå en ny og bedre hjemmeside på få minutter Quick guide Del denne quick guide med alle som har glæde af en ny og bedre hjemmeside
få en ny og bedre hjemmeside på få minutter Quick guide Del denne quick guide med alle som har glæde af en ny og bedre hjemmeside 1 Alle har ret og råd til en professionel hjemmeside på få minutter GoMinisite
Læs mereRedaktørvejledning for www.bredstrup-pjedsted.dk Skriv en artikel
Arbejdsgang - Skriv artiklens tekst - Gør billeder klar - Log-in på hjemmesiden - Opret ny artikel - Vælg kategori - Skriv overskrift - Indsæt tekst - Tilføj billeder - Gennemgå artiklens indstillinger
Læs mereRelease notes Januar 2014
Release notes Januar 2014 Det er vigtigt, I sletter midlertidige filer i jeres browser efter et nyt release af borger.dk, for at browseren ikke stadig anvender ældre komponenter herfra. For OPIS redaktører
Læs mereActive Builder - Brugermanual
Active Builder - Brugermanual Version: Release 2.0 Sprog: Dansk Copyright 2014 - Talk Active ApS INDHOLDSFORTEGNELSE INDHOLDSFORTEGNELSE... 2 1. HURTIGT OVERBLIK... 4 1.1 Vælg URL:... 4 1.2 Vælg en skabelon:...
Læs mereManual til Dynamicweb Februar 2010
Manual til Dynamicweb Februar 2010 Login... 2 Skabeloner og formater... 3 Filarkivet... 4 Lav en PDF... 5 Opret en ny side... 7 Navngiv siden... 9 Aktiver siden... 9 Sorter sider... 9 Flyt siden... 11
Læs mereMANUAL - Joomla! Version 1
MANUAL - Joomla! Version 1 Indhold Retningslinjer for hjemmesiden... 2 Log ind... 2 Ret i en artikel, der allerede er oprettet... 3 Opret ny artikel... 6 a) Skriv direkte i tekstfelt... 7 b) Indsæt tekst
Læs mereVejledning til opbygning af hjemmesider
Side 1 af 9 Vejledning til opbygning af hjemmesider Hvis du er inde på din klubs hjemmeside, fx på forsiden, kan du nu gå i gang med at redigere. For at få redigeringsværktøjet frem, skal du klikke på
Læs mereDesignmanual for websider
Designmanual for websider 31. marts 2009 Version 1.1. Denne manual beskriver de gældende retningslinjer for Aalborg Universitets websider. Det vil sige websider der benytter aau.dk i domænenavnet er omfattet
Læs mereMANUAL - Joomla! Version 1
MANUAL - Joomla! Version 1 Indhold Retningslinjer for hjemmesiden... 3 Log ind... 3 Ret i en artikel, der allerede er oprettet... 4 Opret ny artikel... 8 a) Skriv direkte i tekstfelt... 9 b) Indsæt tekst
Læs mereMANUAL. Siteloom CMS
MANUAL Siteloom CMS www.hjerteforeningen.dk/cms Brugernavn: Password: 3. oktober, 2013 BASIS FUNKTIONER 1. Kalender... 4 1.a. Opret... 5 1.b. Rediger eller slet... 9 2. Sider...12 2.a. Opret side...13
Læs mereDesignmanual BUTLER FM
Designmanual BUTLER FM 2015 Grontmij A/S, Facilities Management Forfatter: Rikke Carlsen, RIC Indhold Grid... 3 Afstande... 5 Fonte og typografier... 6 Farver... 7 Tabeller... 8 Andre elementer... 10 Ikoner...
Læs mereMANUAL. Siteloom CMS
MANUAL Siteloom CMS www.hjerteforeningen.dk/cms Brugernavn: Password: 13. marts, 2014 BASIS FUNKTIONER 1. Kalender... 4 1.a. Opret... 5 1.b. Rediger eller slet... 9 2. Sider...12 2.a. Opret side...13 2.b.
Læs mereGenerel information. Brugere. Hjemmesidens lay-out. HIF Hjemmeside How to do
Generel information Dette dokument er en brugsanvisning for hjemmesidens back-end brugere, med information om hvordan man logger ind og hvordan man arbejder med hjemmesiden/hjemmesidens funktioner samt
Læs mereOK Fonden. Umbraco CMS Quickguide
OK Fonden Umbraco CMS Quickguide 1 Indhold 1 Indhold... 2 2 Indledning... 3 2.1 Kompatible browsere... 3 2.2 Log ind i Umbraco... 3 2.3 Naviger i administrationsområdet... 4 2.4 Brug af træ menu... 5 3
Læs mereSådan bruger du Schultz lovportaler
Sådan bruger du Schultz lovportaler Indhold 1 OM SCHULTZ LOVPORTALER... 2 2 KOM GODT I GANG... 3 2.1 LOGIN OG NYHEDSABONNEMENT... 3 2.2 FIND RUNDT I PORTALERNE... 5 3 SØGNINGER... 7 3.1 SØGEFELTET... 8
Læs merevorbasse.dk Redaktørmanual Kentaur
Redaktørmanual Kentaur Indholdsfortegnelse Kapitel 1 - TYPO3 Brugerfladen 3 Log ind 3 Backend 4 Frontend 5 Hvor skal jeg klikke? 5 Gem, gem og vis, gem og luk 6 Kapitel 2 - Sider & menuer 7 Sammenhæng
Læs mereDrejebog til tractorpulling.dk
Drejebog til tractorpulling.dk Generelt På hjemmesiden benyttes følgende som standard: - Skrifttype: Verdana - Skriftstørrelse: 12px / 9pt. 4. oktober 2011 Moskjær Marketing Falkevej 4 DK-6920 Videbæk
Læs mereBrugermanual. - For intern entreprenør
Brugermanual - For intern entreprenør Version 1.0 2014 Brugermanual - For Intern Entreprenør Velkommen som bruger på Smartbyg.com. Denne manual vil tage dig igennem de funktioner der er tilgængelig for
Læs mereDu kan hente siden ved at trykke på det lille hus i øverste venstre hjørne af skærmen og derefter finde frem til siden via forsiden.
Hvordan redigerer du en eksisterende side? Hent siden, mens du er logget på. Du kan hente siden ved at trykke på det lille hus i øverste venstre hjørne af skærmen og derefter finde frem til siden via forsiden.
Læs mereSådan redigerer du en hjemmeside i Umbraco
Brugermanual til din boligafdelings hjemmeside Sådan redigerer du en hjemmeside i Umbraco Indhold Introduktion... 2 Log på Umbraco og redigér din hjemmeside... 3 Opret ny side... 7 Gem side uden at udgive/publicere
Læs mereMiniguide for redaktører. Miniguide for redaktører. Leveret af DFF-EDB.dk
Miniguide for redaktører Miniguide for redaktører Leveret af DFF-EDB.dk 1 INDHOLD Hjemmesider i Umbraco... 2 1. Kom i gang med Umbraco... 2 1.1 Login... 2 1.2. Når du arbejder på siden, inden den er udgivet...
Læs mereIndholdsfortegnelse. Designmanual Borsen.dk 1. Farver 01. Fonte 02. Ikoner og knapper 03. Menuen 04. Bannere 05. Generelle mål 06. Grafikelementer 07
Indholdsfortegnelse Designmanual Borsen.dk 1 Introduktion..................................................... 02 Farver 01 Fonte 02 Ikoner og knapper 03 Menuen 04 Bannere 05 Generelle mål 06 Grafikelementer
Læs mereGuide til Umbraco CMS
web Guide til Umbraco CMS Indhold Indledning 3 Kompatible browsere 3 Log ind i Umbraco 4 Content-delen 5 Indholdstræet 5 Tilføjelse af en side/sektion 7 Sortering af indhold 12 Galleri 14 Mediebibliotek
Læs mereMini brugermanual CMD 5.1
Mini brugermanual CMD 5.1 Kom i gang For at tilgå CMD skal du åbne en web browser og indtaste URL en på dit CMD website i adressefeltet, hvorefter dialogboksen til log in vises. 1. Indtast dit brugernavn
Læs mereBrugervejledning til FOKUSpartnere
Indholdsfortegnelse LOGIN 3 GENERELT 3 BRUGERVEJLEDNING 4 VIRKSOMHEDSPROFIL 4 1) Virksomhedsnavn 6 2) Beskrivelse af virksomheden 6 3) Generel information 6 4) Yderligere information 6 5) Kontaktpersoner
Læs mereQuick guide Dynamicweb 9. Kom godt i gang med brugen af redigeringsværktøjet bag vores hjemmesideløsning CMS-systemet Dynamicweb
Quick guide Dynamicweb 9 Kom godt i gang med brugen af redigeringsværktøjet bag vores hjemmesideløsning CMS-systemet Dynamicweb Indholdsfortegnelse Sådan logger du på... 3 Opbygning... 4 Beskrivelse af
Læs mereKom godt i gang. Sitecore Foundry maj Version 1.1
Sitecore Foundry 4 Kom godt i gang 26. maj 2014 - Version 1.1 Pentia A/S Store Kongensgade 66, Baghuset 1264 København K Telefon: 7023 3330 E-mail: info@foreningssite.dk Indholdsfortegnelse Indledning...
Læs mereLav din egen forside i webtrees
Lav din egen forside i webtrees Du behøver ikke at kunne kode eller gøre noget advanceret for at designe din helt egen forside i webtrees. Alt du skal gøre er bare at gøre brug af den indbygget editor.
Læs mereVejledning til vedligehold af
Vejledning til vedligehold af www.ajsport.dk Udarbejdet af Helle M. Klausen Indhold Sådan logger du på... 2 Sådan logger du af... 2 Hvad er ikke tilladt under vedligehold af www.ajsport.dk?... 2 Kan www.ajsport.dk
Læs mereBrugervejledning til Design Manager Version 1.02
Brugervejledning til Design Manager Version 1.02 Indholdsfortegnelse 1. Introduktion... 3 1.1 Det kan du med HostedShop Design Manager... 3 1.2 Feature list... 3 2. Design... 4 3. Filer og CSS... 4 3.1
Læs mereMANUAL TIL FS PÅ NETTET
MANUAL TIL FS PÅ NETTET Sådan opretter du nyheder og artikler (side 4) Sådan laver du links (side 14) Om tjek ind/ud og publicer (side 20) Sådan uploader du billeder og dokumenter (side 25) Sådan redigerer
Læs mereIndhold. Grafisk workflow 3 Procesbeskrivelse 4 Inspiration 5 Skitser 6 Flowchart 7 Typografi og farver 8 Skelet 9 Storyboard 12 Html, css og seo 16
GRAFISK WORKFLOW Indhold Grafisk workflow Procesbeskrivelse Inspiration 5 Skitser 6 Flowchart Typografi og farver 8 Skelet 9 Storyboard 2 Html, css og seo 6 Grafisk workflow Opgaven At skabe et nyt og
Læs mereIndhold. 1. Adgang og afslutning
1 Indhold 1. Adgang og afslutning 2. Menupunkter 3. Tekst 4. Billeder 5. Video 6. Lyd 7. Bannere 8. Bokse 9. Dokumenter 10. Links 11. Iframe 12. Markedspladsen 13. Nyheder 14. Job 15. Kalender 16. Selvbetjeningsbjælken
Læs mereHjemmesidens layout. Sitecore Foundry maj Version 1.2
Sitecore Foundry 3.0 Hjemmesidens layout 31. maj 2012 - Version 1.2 Pentia A/S Store Kongensgade 66, Baghuset 1264 København K Telefon: 7023 3330 E-mail: info@foreningssite.dk Indholdsfortegnelse Indledning...
Læs mereSådan indlægges nyheder på DSqF s hjemmeside trin for trin
Sådan indlægges nyheder på DSqF s hjemmeside trin for trin Systemkrav For at kunne bruge Composite kræves: Windows 95 eller nyere (bemærk - kun Windows kan bruges) Browseren Internet Explorer 6.0 eller
Læs mereDenne rapport har til formål at redegøre for tilblivelsen af hjemmesiden beliggende på domænet, http://www.technofil.dk. Der refereres fra nu af blot
Denne rapport har til formål at redegøre for tilblivelsen af hjemmesiden beliggende på domænet, http://www.technofil.dk. Der refereres fra nu af blot til hjemmesiden. Mine indledende tanker bag hjemmesiden
Læs mereVejledning. Indhold. Side 1
Indhold HTML-faneblade... 2 Sådan tilføjer du et HTML-faneblad til din Facebook side.... 3 Sådan redigerer du et HTML-faneblad på din Facebook side.... 5 Sådan deler du fanebladet... 10 Side 1 HTML-faneblade
Læs mereBRUGER KURSUS RAMBØLL HJEMMESIDE
Til Forsyningsvirksomheder i Danmark Dokumenttype Brugervejledning Rambøll Hjemmeside Full Responsive Dato Oktober 2017 BRUGER KURSUS RAMBØLL HJEMMESIDE BRUGER KURSUS RAMBØLL HJEMMESIDE Revision 01 Dato
Læs mereIndholdsfortegnelse Opret engelsk version af hjemmesiden... 2
Indholdsfortegnelse Opret engelsk version af hjemmesiden... 2 Indledning:... 2 Metode 1 en samling af sider, med kun en engelsk version:... 3 Metode 2 Eksisterende sider med både en dansk og en engelsk
Læs mereGrafisk design. Ide. Designprocess. Målgruppe
Ide Designprocess I denne opgave har jeg udviklet et website for et feriehus. Kunden ønsker et site, som både fungere privat, men også som offentlig hjemmeside. Hele site skal være på dansk, tysk og engelsk.
Læs mereVEJLEDNING Udfyldelse af spørgeskemaet
VEJLEDNING Udfyldelse af spørgeskemaet Indholdsfortegnelse Introduktion... 3 Tekniske krav... 3 Adgang og forbindelse... 4 Navigation i spørgeskemaet... 7 Spørgeskemaets afsnit... 7 Navigationslinjen...
Læs mereManual til Wordpress. 1. Log ind på din Wordpress-side. Indhold:
Manual til Wordpress Sådan opdaterer du din hjemmeside i Wordpress: Dette er en manual til de mest grundlæggende ting, så du selv kan redigere indholdet eller tilføje nyt på din hjemmeside. Guiden er skrevet
Læs mereElevvejledning til SkoleKomNet - Min egen hjemmeside
Indledning...1 Sådan får du adgang...2 Dit KlasseWeb skrivebord Overblik...2 Dit arbejdsområde...3 Din hjemmeside på nettet...3 Sådan laver du en hjemmeside i 4 trin...3 Trin 1 Dit personlige billede på
Læs mereTastemanual til Webbyggeren
Tastemanual til Webbyggeren Denne tastemanual er opbygget således, at eleverne skal lave deres hjemmeside i en allerede konstrueret hjemmesideskabelon, som de kan arbejde videre i, lægge tekst ind i, ændre
Læs mereMini-guide for opdatering af hjemmesiden for. SOIF www.soif.dk
Mini-guide for opdatering af hjemmesiden for SOIF www.soif.dk Senest opdateret: 03-07-2009 Indholdsfortegnelse 2 Indholdsfortegnelse 2 Lidt generelt om KlubCMS 3 Brugere/Brugergrupper 3 Sideopbygning:
Læs mereManual til hjemmeside i Typo3
Manual til hjemmeside i Typo3 Gode tips og genvejstaster Ét linieskift Ctrl + A Ctrl + C Ctrl + X Ctrl + V shift + enter (tasten du normalt bruger til linieskift) Markér alt Kopier Klip Sæt ind Oprettelse
Læs mereHer er et udkast til hvad der skal laves funktionsbeskrivelse
Her er et udkast til hvad der skal laves funktionsbeskrivelse Generelt til www.clipping.dk Markeret RØD er INTERN KOMMENTAR de er med i stedet for at slette dem Følgende sider/menuer/punkter, skal der
Læs mereIndre Missions. Vejledning til TYPO3
Indre Missions Vejledning til TYPO3 Manual til Typo3 på IM's server 1. Udgave, januar 2010 Daniel Damm, IT afdelingen, Indre Missions Hus Indholdsfortegnelse Indledning...5 Præsentation af begrebet CMS...6
Læs mereRedaktørmanual TYPO3. LinkFactory TYPO3 MANUAL
LinkFactory TYPO3 MANUAL Kapitel 1 - TYPO3 CMS - Opbygning... 3 Log ind... 3 Backend... 4 Frontend... 5 Hvor skal jeg klikke?... 5 Gem, gem og vis, gem og luk... 6 Kapitel 2 - Håndtering af sider & menuer...
Læs mere1. SCREENING OG BAGGRUND
1. SCREENING OG BAGGRUND BL Danmarks Almene Boliger har på forvaltningskonferencen d. 22. august 2012 lanceret konkurrencen Bedst til bolig på nettet. Bedst til bolig på nettet baserer sig på samme overordnede
Læs mereVejledning i redigering af apotekets hjemmeside
i redigering af apotekets hjemmeside It-afdelingen Januar 2007 INDHOLDSFORTEGNELSE FEJL! BOGMÆRKE ER IKKE DEFINERET. 1 INTRODUKTION 3 2 ADMINISTRATION 4 3 OPBYGNING 4 SIDER 5 FIL ARKIV 6 ARTIKLER 7 ØVRIGE
Læs mereSIGIL Sådan opretter du en e- bog Step by Step
SIGIL Sådan opretter du en e- bog Step by Step Af Gitte Winter Graugaard Nov. 2013, Sigil version 0.7.2 1 Her følger en intro skridt for skridt til at oprette en e- bog i SIGIL og publicere den på SAXO
Læs mereRedaktørmanual TYPO3
Redaktørmanual TYPO3 Version: 1.1 Tilpasset TYPO3: 4.2 Sidst opdateret: 15/10-2008 Copyright: IdeFA Gruppen Indholdsfortegnelse 1. Forord... 2 1.1. Quick info... 2 1.2 Om TYPO3 CMS... 2 2. TYPO3 CMS Opbygning...
Læs mereLyngby Svømmeklub Hjemmeside Guide. Indholdsfortegnelse
Indholdsfortegnelse Indledning... 2 Hjemmeside struktur... 3 Rettigheder... 4 Opret Nyhed... 6 Opret Kalender Event... 7 Opret Arrangement... 9 Fast side... 10 Forside... 11 Tekst... 11 Billeder... 11
Læs mereHjemmeside manual. Indholdsfortegnelse. Noter: - 1 -
Hjemmeside manual Indholdsfortegnelse Login... - 2 - Login på din hjemmeside og generel support info... - 2 - Kontrolpanel... - 3 - Opdatering af profil oplysninger... - 3 - Menu... - 4 - Menupunkter...
Læs mereHerning Centerby Guide til Umbraco
Herning Centerby Guide til Umbraco marts 2016 I GANG MED UMBRACO 4 LOGIN 4 LÆR UMBRACO AT KENDE 5 SÅDAN REDIGERER DU SIDER 6 VÆRKTØJSLINJEN 6 RET I TEKSTEN 7 RET ELLER INDSÆT LINK I TEKSTEN 8 RET ELLER
Læs mereGRAFISK DESIGN SVENDEPRØVE Dorte Damsgaard Larsen
GRAFISK DESIGN SVENDEPRØVE Dorte Damsgaard Larsen OPGAVE Designforslag til hjemmeside til motorcykelklubben Mc Chaufførerne GRAFISK DESIGN / Dorte Damsgaard Larsen 1/15 DESIGNPROCES Indledende møde med
Læs mereGUIDE TIL OPRETTELSE AF SIDER OG INDHOLD I UMBRACO ONLINE BETJENING
GUIDE TIL OPRETTELSE AF SIDER OG INDHOLD I UMBRACO ONLINE BETJENING DANSKE BEDEMÆND august 2014 v1.4 1 P a g e INDHOLDSFORTEGNELSE Adgang... 3 Overordnet om Umbraco... 4 Højreklik muligheder i oversigten...
Læs mereVejledning til brug af PwC-Portalen Indhold
Vejledning til brug af PwC-Portalen Denne vejledning gennemgår de enkelte funktioner i PwC-Portalen og forklarer hvordan de bruges. Du finder også information om, hvordan du kan få yderligere hjælp, hvis
Læs mereSådan redigerer du en hjemmeside front-end
Brugermanual til din boligafdelings hjemmeside Sådan redigerer du en hjemmeside front-end Indhold Introduktion... 2 Log på hjemmesiden og redigér front-end... 3 Rediger en side... 7 Opret ny side... 10
Læs mereEazyProject lokalestyring
EazyProject lokalestyring Brugermanual Version 1.1 Side 1 af 26 Indholdsfortegnelse 1. Introduktion til EazyProject... 3 1.1 Om... 3 1.2 Support... 3 1.3 Daglig brug af EazyProject... 3 1.3.1 Print af
Læs mereBrugerguide til FlexCMS
Brugerguide til FlexCMS Kom i gang med at bruge din hjemmeside 1 VELKOMMEN TIL FLEXCMS... 3 1. LOGIN... 5 2. HJEMMESIDENS TERMINOLOGI... 6 3. LAYOUT... 7 4. OPRET OG TILPAS FORSIDEN... 8 4.1 OPRETTE SIDEEGENSKABER...
Læs mereMunkekærskolen Tjørnholmvej 10 2680 Solrød Strand www.munkekaerskolen.dk eller www.munkekaer.dk E-mail: munkekaerskolen@solrod.dk Tlf.
Munkekærskolen Tjørnholmvej 10 2680 Solrød Strand www.munkekaerskolen.dk eller www.munkekaer.dk E-mail: munkekaerskolen@solrod.dk Tlf. 5618 2600 Forældreintra 1 September 2007 Vejledning for forældre ForældreIntra
Læs mereAnklagemyndighedens Vidensbase
Anklagemyndighedens Vidensbase Indhold 1 OM DENNE VEJLEDNING... 2 2 LOGIN... 3 3 SØGNINGER... 5 3.1 SØG EFTER DOKUMENTER... 5 3.2 NAVIGÉR DIG FREM... 7 3.3 KOMBINÉR SØGNING OG NAVIGATION... 7 3.4 VISNING
Læs mereBrugervejledning. Miljøministeriet M65. Opdateret den 27. oktober 2011
Brugervejledning Miljøministeriet M65 Opdateret den 27. oktober 2011 Indholdsfortegnelse Introduktion... 3 Opret et nyt dokument... 3 Før du starter... 4 Om at arbejde med typografier:... 5 Menu: M65 -
Læs mereVejledning til AdPoint
Vejledning til AdPoint Login på adressen http://manager.alignint.dk/cpdev/dev.jsp og følgende login billede kommer frem: Log på med dit kundenr., brugernavn og adgangskode og følgende billede kommer frem:
Læs mereBrugermanual til munkebjergbykirke.dk
Brugermanual til munkebjergbykirke.dk Indhold Log ind... 2 Introduktion til redigeringssystemet... 3 Tilføj - tilføje nye artikler og emner... 4 Tilføj artikler... 5 Kalenderfunktionen... 7 Tilføj galleri...
Læs mereSMVdanmark online løsning: Guide til oprettelse af oprindelsescertifikater
SMVdanmark online løsning: Guide til oprettelse af oprindelsescertifikater Dette dokument er en introduktion til SMVdanmarks online løsning til oprettelse og bestilling af oprindelsescertifikater. Dokumentet
Læs mereBRUGERVEJLEDNING. Diabetesforeningens lokale hjemmesider
BRUGERVEJLEDNING Diabetesforeningens lokale hjemmesider Om Diabetesforeningens lokale hjemmesider Alle Diabetesforeningens lokalforeninger, børnefamilie- og ungergrupper har en officiel hjemmeside. Det
Læs mere3 OPRETTELSE AF SIDER
3 OPRETTELSE AF SIDER En af VuptiWebs styrker er muligheden for at oprette forskellige sidetyper og - ikke mindst - sider, som automatisk henter data fra vores administrationsprogram (DOFPro). I første
Læs mereHardeknud gruppe. Brugermanual. Tilegnet redaktører af gruppeweb hjemmeside
Hardeknud gruppe Brugermanual Tilegnet redaktører af gruppeweb hjemmeside Indhold Indledning... 4 Om denne brugermanual... 4 Formålet med Gruppeweb... 4 Hjemmesidens opbygning... 4 Redaktører... 5 Log
Læs mereJEG GIVER SELLS.DK NYT LIV MED ET MODERNE RE-DESIGN.
JEG GIVER SELLS.DK NYT LIV MED ET MODERNE RE-DESIGN. Grafisk design Grafisk design Opgaven Jeg har fået til opgave at re-designe Sells.dk. Sitet skal benytte elementer fra en kampagne, der tidligere er
Læs mereLOGON Billede: Ved logon, er det vigtigt at der er vinget af i feltet Default miljø og rolle.
ASPECT4 Client En af de største og mest markante ændringer i den nye klient ASPECT4 version 3 er en kraftigt forbedret grafisk klient med en helt nydesignet arbejdsplads mod ASPECT4 funktionerne. LOGON
Læs mereIsenTekst Indhold til Internettet. Manual til Wordpress.
Manual til Wordpress Sådan opdaterer du din hjemmeside i Wordpress. Dette er en manual til de mest grundlæggende ting, så du selv kan redigere indholdet eller tilføje nyt på din hjemmeside. Guiden er skrevet
Læs mereGå ind på forsiden til hjemmesiden. Skriv typo3 i adresselinjen og tryk på retur.
Adgang til Back-end Gå ind på forsiden til hjemmesiden. Skriv typo3 i adresselinjen og tryk på retur. typo3 Skriv herefter brugernavn og adgangskode i de respektive felter og klik på Login Den følgende
Læs mereQuick Guide Ditmer edagsorden Oktober 2013
Quick Guide Ditmer edagsorden Oktober 2013 Quick Guide Indhold For dig der skal i gang med at bruge ditmer edagsorden på ipad eller web 1. Sådan får du adgang til ditmer edagsorden... 2 2. Find udvalg
Læs mereGENEREL FUNKTIONALITET I KMD OPUS ROLLEBASERET INDGANG
GENEREL FUNKTIONALITET I KMD OPUS ROLLEBASERET INDGANG Arbejdsgang Beskrivelse Handling Overblik over opgaver Du får nu vist Forsiden. Hver fane har en farve, som er unik for den specifikke rolle, og dermed
Læs mereGalleri modul. Side 1 af 18
Galleri modul Side 1 af 18 Indholdsfortegnelse Indholdsfortegnelse... 2 Installation... 3 Oprette menupunkt... 5 Kategoriseret menupunkt (Avanceret)... 6 Opsætning... 9 Generel opsætning... 10 Opsætning
Læs mereIntroduktion. Sådan finder du dokumenterne. Opslag ved hjælp af menustrukturen. Opslag ved hjælp af personlige bogmærker.
Version 5 Introduktion Sådan finder du dokumenterne Opslag ved hjælp af menustrukturen Klik dig frem i menuerne med musen eller brug tabulatortasten. Klik dig frem via menuerne i dokumentvinduet: Klik
Læs mereI gang med Adobe Muse CC
I gang med MUSE Muse er et program fra Adobe til fremstilling af websites, for de som ikke ønsker at arbejde med koder. De fremstillede websites baserer sig naturligvis på HTML, CSS, Javascript mm., du
Læs mere[ Brevkasse (FAQ) ] Hvad kan modulet? detaljevisning i kapitlet Grundlæggende redigering, før du begynder at oprette
[ Brevkasse / FAQ ] 1 [ Brevkasse (FAQ) ] Brevkasse er et funktionsmodul til oprettelse, styring og præsentation af en brevkasse/faq (Frequently Asked Questions) på dit website. NB: Det er meget væsentligt,
Læs mere8.0 Distriktshjemmesider
8.0 Distriktshjemmesider Indhold Login... 2 Forside... 3 Distriktsside opbygning...4 Rediger på en side... 5 Upload filer til mediebibliotek... 8 Kontroller links på filer... 12 Indsæt billeder... 13 Slet
Læs mereSådan opdaterer og vedligeholder du din hjemmeside i Wordpress.
Wordpress manual Sådan opdaterer og vedligeholder du din hjemmeside i Wordpress. Dette er en manual til de mest grundlæggende ting og funktioner i Wordpress, så du selv kan redigere indholdet eller tilføje
Læs mereSolrød Kommune Guide til Umbraco
Solrød Kommune Guide til Umbraco februar 2015 I GANG MED UMBRACO 4 LOGIN 4 LÆR UMBRACO AT KENDE 5 SÅDAN REDIGERER DU SIDER 6 VÆRKTØJSLINJEN 6 RET I TEKSTEN 7 RET ELLER INDSÆT LINK I TEKSTEN 8 RET ELLER
Læs mereHjemmesiden er opdelt i et sidehoved, en sidefod og mellem disse 3 kolonner: venstre, midterste og højre. Højre kolonne vises dog kun på forsiden.
Hjemmesiden er opdelt i et sidehoved, en sidefod og mellem disse 3 kolonner: venstre, midterste og højre. Højre kolonne vises dog kun på forsiden. VENSTRE kolonne indeholder flere elementer (se illustration
Læs mere1 // Grafisk design. Hjemmesiden før. Kunde. Produkt. Opgave. Målgruppe. Bogforlaget Frydenlund A/S. www.his2rie.dk
Kunde Bogforlaget Frydenlund A/S Produkt www.his2rie.dk Opgave Hjemmesiden før Redesign af hjemmesiden www.his2rie.dk, som ejes af forlaget. Min opgave lød på, at udforme et nyt design til hjemmesiden,
Læs mereIntroduktion til billeddatabasen
Introduktion til billeddatabasen Colourbox.dk Colourbox.dk er den billeddatabase som Odense Kommune har købt licens til. Det er vigtigt at bemærke, at der ikke er ubegrænset download af billeder. I materialet
Læs mereDDElibra H Å N D B O G
H Å N D B O G Axiell Danmark A/S 2016-10-12 Version 9.11.60 GUI Copyright 2016 2 1 Indholdsfortegnelse 1 Indholdsfortegnelse... 2 2 Introduktion... 3 3 Søgning i dokumentationen... 3 4 Åbning af ""...
Læs mereViKoSys. Virksomheds Kontakt System
ViKoSys Virksomheds Kontakt System 1 Hvad er det? Virksomheds Kontakt System er udviklet som et hjælpeværkstøj til iværksættere og andre virksomheder som gerne vil have et værktøj hvor de kan finde og
Læs mereVelkommen til OnReg Agent.
Velkommen til OnReg Agent. 2 OnReg Agent Velkommen til Onreg Agent Du er blevet tildelt brugernavn og kodeord til OnReg Agent. Denne guide beskriver hvordan du benytter systemet. Hvis arrangøren tillader
Læs mereBrug af Brobygning.NET for ungdomsuddannelser
Brug af Brobygning.NET for ungdomsuddannelser Indhold Indledning... 2 Kom godt i gang... 3 Holdlisten... 6 Skriv i kontaktbogen... 9 Udskriv fra holdlisten... 10 Tilmeldingslisten... 10 Opret fravær på
Læs mereOpstart. I gang med Dreamweaver. Læs mere om...
Generelle bemærkninger Programmet Dreamweaver har været på markedet i nogle år efterhånden. Den seneste version hedder Dreamweaver CS6, og programmet er på engelsk. Dreamweaver er en såkaldt grafisk editor,
Læs mereManual til administration af online booking
2016 Manual til administration af online booking ShopBook Online Med forklaring og eksempler på hvordan man konfigurerer og overvåger online booking. www.obels.dk 1 Introduktion... 4 1.1 Formål... 4 1.2
Læs mereIndholdsfortegnelse. Indholdsfortegnelse.. side 2. Adgang til webgraf 3. Opslag adresse... 4. Styring af layout.. 5. Zoom funktioner..
Indholdsfortegnelse Indholdsfortegnelse.. side 2 Adgang til webgraf 3 Opslag adresse... 4 Styring af layout.. 5 Zoom funktioner.. 6 Panorere på skærmen. 7 Information om grafikken.... 8-10 Print et udsnit.....
Læs mereDESIGNGUIDE WEBSITE DESKTOP OG MOBIL 2016
DESIGNGUIDE WEBSITE DESKTOP OG MOBIL 06 FARVER HOVEDFARVER SEKUNDÆRE FARVER Primary blue Secondary blue Primary teal Primary orange 80% 60% 40% 0% 80% 60% 40% 0% 80% 60% 40% 0% 80% 60% 40% 0% Hex: ##033f65
Læs mere