Webdagene2007 Christian Johansen Webutvikling

806 views
745 views

Published on

Webdagene2007 netlife usability netlife ixd UI webutvikling christianjohansen brukervennlig brukervennlighet

Published in: Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
806
On SlideShare
0
From Embeds
0
Number of Embeds
29
Actions
Shares
0
Downloads
13
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Webdagene2007 Christian Johansen Webutvikling

  1. 1. Webdagene 2007 Webutvikling Effektiv, lønnsom og tilgjengelig webutvikling Christian Johansen
  2. 2. Hvorfor bry seg om utvikling? Nå flere brukere Effektiviser prosjekter Effektiviser prosjektdeltakere Unngå teknisk søkemotoroptimalisering Unngå nettleserlås Imøtekom fremtidige lover
  3. 3. Problem: for liten tekst
  4. 4. Problem: for liten tekst
  5. 5. Problem: For liten tekst
  6. 6. Tekststørrelse intet problem
  7. 7. Problem: Liten avkrysningsboks
  8. 8. Stort klikkbart område
  9. 9. Bruk logisk strukturert data
  10. 10. og maskiner forstår innholdet
  11. 11. Tilgjengelighet Nå ut til flere brukere Lovforslag foreligger
  12. 12. Ferdig søkemotoroptimalisert Ranger høyt med riktig implementasjon Unngå dyr teknisk optimalisering i etterkant
  13. 13. Unngå nettleserlås
  14. 14. Hva er grensesnittsutvikling? Implementering av skjermbilder HTML/XHTML CSS Javascript Flash AJAX, DHTML (ikke egne teknologier) Kunnskap om W3C-standarder
  15. 15. Hva er HTML? Strukturert tekst IKKE et design-verktøy W3C-standard
  16. 16. Hva er XHTML? HTML reformulert som XML W3Cs arvtaker for HTML
  17. 17. Hva er CSS? Designverktøy kontroller nettsidenes utseende W3C-standard
  18. 18. HTML-eksempel
  19. 19. HTML har ikke et utseende
  20. 20. Samme dokument, annen CSS
  21. 21. Samme dokument, annen CSS
  22. 22. HTML eller XHTML? Ingen store praktiske forskjeller Bruk semantisk HTML/XHTML
  23. 23. Hva er semantisk HTML? Et begrep/en praksis, ikke en standard Elementer brukes for å beskrive hva innhold er, ikke hvordan det ser ut Eksempler: <ul>, <ol> og <dl> for lister <h1>, <h2> <h6> for overskrifter <abbr> for forkortelser <blockquote> for lengre sitater Og flere
  24. 24. Nytteverdi #1 Ekstrahering av data Semantic Extractor
  25. 25. Nytteverdi #2 Ekstrahering av data Semantic Extractor
  26. 26. Nytteverdi #3 - Mikroformater
  27. 27. Nytteverdi #3 - Mikroformater
  28. 28. Hva er WCAG? WAI W3Cs tilgjengelighetsgruppe WCAG retningslinjer for tilgjengelighet
  29. 29. Hvem gjør grensesnittsutvikling? Webdesignere Interaksjonsdesignere Grafiske designere Webutviklere Utviklere/systemutviklere Kreative utviklere Hvem gjør hva?
  30. 30. Forventninger vs kompetanse Kilde: Eirik Hafver Rønjum, http://www.hafver-ronjum.no/eirik/html.aspx Illustrasjon: Roger Guttormsen, .IXD Svar fra 109 kommunikatører, 130 utviklere og 48 designere
  31. 31. Forventninger vs kompetanse Kilde: Eirik Hafver Rønjum, http://www.hafver-ronjum.no/eirik/html.aspx Illustrasjon: Roger Guttormsen, .IXD Svar fra 109 kommunikatører, 130 utviklere og 48 designere
  32. 32. Forventninger vs kompetanse Kilde: Eirik Hafver Rønjum, http://www.hafver-ronjum.no/eirik/html.aspx Illustrasjon: Roger Guttormsen, .IXD Svar fra 109 kommunikatører, 130 utviklere og 48 designere
  33. 33. Dedikerte grensesnittsutviklere Grensesnittet får en klart definert rolle Designere og (backend)utviklere kan konsentrere seg om sitt Teknisk søkemotoroptimalisering blir innebygget
  34. 34. Sentralisert design
  35. 35. er raskt å skinne om
  36. 36. og raskt å endre struktur på
  37. 37. Prototype som arbeidsverktøy
  38. 38. Prototype som arbeidsverktøy
  39. 39. Tydelige roller og oppgaver Alle vet hva de skal gjøre Alle vet hva de jobber ut ifra Alle vet hva de skal levere
  40. 40. Jeg vil ha: Design som Photoshop-filer Wireframe som PDF, Visio, Powerpoint osv Andre funksjonelle beskrivelser
  41. 41. Jeg leverer Klikkbar prototype Semantiske HTML-maler CSS Bilder og grafikkelementer Eventuell Javascript Annet(?)
  42. 42. Stå på krava Ikke avleggs å kreve gode løsninger Ikke la backenden styre prosjektet Ha krav til kvalitet!
  43. 43. Bry deg om utvikling Få flere brukere (tilgjengelighet) Ranger bedre i søkemotorene Effektiviser prosjekter Bruk riktig håndtverkere Krev godt håndtverk
  44. 44. Takk for meg Christian Johansen Grensesnittsutvikler .IXD christian@ixd.no - Mob. 934 17 480 www.ixd.no - www.kuttisme.no www.cjohansen.no Lær mer på Dataforeningens kurs: Webteknologi for ikke-teknologer 11. oktober

×