1 / 35

I dag handler det om :

I dag handler det om :. Websidene som skal leveres Hva jeg legger vekt på Organisering av web-sider Andre nyttige tips for web-sidene. Delprøven. Husk i øvingstimene en uke fra nå: individuell prøve. Møt opp i øvingstimene. Tre ulike medier:. Skriftlig rapport Webside

tocho
Download Presentation

I dag handler det om :

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. I dag handler det om : • Websidene som skal leveres • Hva jeg legger vekt på • Organisering av web-sider • Andre nyttige tips for web-sidene

  2. Delprøven • Husk i øvingstimene en uke fra nå: individuell prøve. Møt opp i øvingstimene.

  3. Tre ulike medier: • Skriftlig rapport • Webside • Muntlig presentasjon

  4. Hvordan er web-format forskjellig fra papirformat? • Ulik fasong • Web-sider er bredere enn de er lange • Papirsider er lengre enn de er brede • Papir kan skrives ut med høy-oppløsnings-teknologi - skjermen har lavere oppløsning • I skrevet tekst er det ikke nødvendig med egen støtte for navigasjon • Side følger side • Forsiden med identifikasjon er alltid lett tilgjengelig • mens hver web-side selv må sørge for identifikasjons- og navigasjonshjelp( ulike linker, overskrifter, logo osv)

  5. Skjerm og web-side • Aspect ratio vanligvis 4/3 • Display-størrelse er vanligvis 800 pixler i bredden og 600 pixler i høyden • Nettleserens border med titler og navigasjon tar plass – • Så selve web-siden disponerer ikke mer enn 760/420 pixler, for de fleste lesere

  6. Spesielle virkemidler for web-formatet • Animasjon • Forandring i bildet, blinking • Lyder, musikk osv. • Videoklipp • Muligheter for interaktivitet

  7. Identifikasjon og brukervennlighet • Enhver web-side må ha en identitet, uttrykt ved et navn • Det må alltid være mulig for bruker/leser å finne ut hvem sin web-side hun er på • Og /eller hva siden heter • Hvor hun er innenfor nettsiden • Hva som er tilgjengelig fra denne siden • Hvor hun kan gå for å komme videre • Hvordan hun skal finne det hun eventuelt ser etter

  8. Krav til navn på siden • Tydelig navn (Et firma vil vanligvis plassere logoen sin svært synlig) • Bruk en kombinasjon av plassering, størrelse, fonter og farger for å vise hva siden heter • Navnet på siden må være dekkende og korrekt • Hvor brukeren er, kan markeres i en oversikt ved at • Navnet er opplyst eller blinker • Ved en peker • Ved å forandre tekstfarge eller farge på knappen i forhold til omkringliggende knapper • Ved å gi de andre knappene farge

  9. Eksempel • Sports • Business • Entertainment • Politics

  10. Bruk også ”brødsmuler” eller ”cascading titles” • Forteller hvordan du kom dit du er • ABC-Mobile Corp.Home>Products>Sports Cars>ABC Super Coupe>Specifications • Kan stå øverst på siden, og hvert av leddene kan være klikkbare

  11. Ulike navigasjonsmuligheter • Vise menyen hele tiden,slik at bruker kan klikke seg dit hun vil • Ha en knapp for ”tilbake til menyen” eller ”tilbake til hovedsiden” • Bruke knapper med ”previous” og ”next” (spesielt hvis sidene bør leses i sekvens) • Bruke linker til andre deler av siden eller til andre sider • Opprette en søkefunksjon • Scrolling kan brukes, men bare i spesielle tilfeller. Blir ofte ikke lest.

  12. Internett-brukeren har det travelt • Forskjell på de som surfer og de som leter etter noe spesielt • Griper det første – ikke nødvendigvis det beste • Tenker ikke etter hvordan siden fungerer- de gjetter seg fram • Venter ofte ikke på nedlasting av bilder • Orker ofte ikke å gå inn i scrolling • Vil gjerne at en web-side skal se ut ”som vanlig”, med logoen øverst til venstre, f. eks. • Setter pris på at noe kan gjenkjennes

  13. Litt annerledes enn slik vi tenker oss

  14. Folk leser ikke web-sider - • De skanner dem • De bruker tidligere erfaringer til å forstå en side så raskt som mulig • De vil klikke på noe • ”Dont make me think”

  15. Tekst på en web-side • Det er mindre behagelig å lese en web-side enn en papirside • Må være mindre tekst enn på papir! • ”Get rid of half of the words on each page, then get rid of half of what´s left”

  16. Leselighet • Svart tekst på hvit bakgrunn er enklest å lese • Beste linjelengde er 10 til 12 ord pr. linje • Skill overskrifter og tekst tydelig • Bare to fonter og to størrelser på en og samme side • Forsiktig med ”store bokstaver”. De er tungt leselige • Linjemellomrom som avsnittsskille (NB! Gjelder ikke hvis man designer sider som også skal passe for synshemmede) • Fakta som skal sammenlignes, bør stå under hverandre for best effekt

  17. Farger • Farger bør ha en funksjon • Blir det for mange farger, forsvinner muligheten for signalfunksjon • Animasjoner og blinking er ofte irriterende

  18. En farge kan uttrykkes i HSL-systemet • Hue (farge) • Saturation (metning) • Luminance (lysstyrke) • Hver av komponentene uttrykkes ved et tall fra 0 til 255

  19. Fargenyanse • Hue: Farge/:nyanse .Fra 0 - 255 : • rødt • orange • gult • grønt • blågrønt • blått • fiolett

  20. Saturation: metning • Avhenger av mengden grått • Metning fra 0-255 :først grå, og så en grået versjon av nyansen fram til ”ren”, mettet farge • Samme tall for metning i ulike nyanser gir avstemthet i fargeuttrykket

  21. Luminance: lysstyrke • Har å gjøre med mengden svart/hvitt • Luminance fra 0-255: først svart, så en mørk farge, og gradvis lysere farge inntil hvitt • Variasjoner i lysstyrke gir tydeligere kontraster enn variasjoner i metning eller nyanse

  22. Fargehjulet • består av hovedfargene (nyansene ) i spekteret, men organisert i en sirkel: • rødt møtes med fiolett • Farger rett overfor hverandre i fargehjulet bør ikke ha felles grenser • Farger med jevn avstand i fargehjulet virker avbalansert

  23. Rammer/frames . Ofte tre faste: • En for navnet • En for menyen • En for innholdet • Fordeler: • Menyen er alltid tilgjengelig for bruker • Menyvalgene står alltid på samme plass • Tittelen er alltid der, man vet hvor man er • Rammen endrer seg ikke eller blaffer opp hver gang man skal ha ny

  24. Men • De er vanskelige for synshemmede • De er vanskelige å hente inn med f. eks. telefonmodem • De gjør nettlesernes oppgave vanskeligere

  25. Menyer • Kan gå horisontalt eller vertikalt • Kan plasseres hvor som helst, men bør være samme sted på alle sidene på et web-sted • Fanekort(tabs) er et alternativ • Menysystemet bør være identisk fra side til side på hele nettstedet –den bør derfor ikke ta opp for stor plass • Vær nøye med navnene på menyvalgene • Hva er best : • Jobber • Muligheter for engasjement • Jobb-O-Rama

  26. Fanekort – men for mange nivåer?

  27. Tagline • En kort frase som karakteriserer hele siden – • Spesielt bra i markedsføring • ”The single best source for facts on the net” • ”The online music network” • ”Books you thought you´ll never find” • ”Paradishus- din vei til paradis”

  28. ”Brukervennlighet”. Brukeren må aldri være i tvil om Hvor en knapp fører Hvorfor knappen har det navnet Om den er klikkbar eller ikke Hvor man skal begynne Hva som er viktigst på en side ”Don t make me think”

  29. Dette bør være på alle hjemmesider: • Side-identitet (navn) Står gjerne høyt oppe • Seksjoner og underseksjoner som kan nåes (står også høyt oppe) • En måte å søke på • Best om brukerne kan bruke alle slags ord her – ikke velge mellom ulike nøkkelord

  30. Å definere brukere • Hvem er brukerne? • Hvorfor er de på denne siden? • Hvordan kom de dit? • Alder? Kjønn? Økonomi? • Har de vært på denne siden før? • Hva slags skjermoppløsning har de? • Hvilke programmer har de? • Ofte også : hvilken web-leser brukes?

  31. Hva er viktig på web-siden?(vi ser nå bort fra innhold) • God identifikasjon.Hva slags side?Hvem sin? • Oversiktlighet • Tydelig merking (overskrifter, menyer) • Enkel navigasjon (Meny,”forrige”,”neste”) • God intern linking • Brukervennlighet • Behagelig layout, avbalanserte sider,fornuftig fargebruk • Dekkende navn på kapitler/linker • Lettleste tekster

More Related