Een website die werkt (Hogeschool Gent)

2,547 views

Published on

Basisprincipes voor een goed werkende website.

Published in: Business
1 Comment
7 Likes
Statistics
Notes
  • Interessante presentatie. Goed uitgelegd en gedocumenteerd met plaatjes.

    Leo Verkoelen (http://www.unitedstarters.com
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total views
2,547
On SlideShare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
63
Comments
1
Likes
7
Embeds 0
No embeds

No notes for slide

Een website die werkt (Hogeschool Gent)

  1. 1. EEN WEBSITE DIE WERKT
  2. 2. Hallo, ik ben Bram
  3. 3. Projecten voor onder andere: R
  4. 4. Informatie-architect
  5. 5. Prototype
  6. 6. Je vindt mij online op:‣ twitter.com/bram_‣ last.fm/user/bram_
  7. 7. EEN WEBSITE DIE WERKT6 mei 2011 – 2de jaar marketing, Hogeschool Gent
  8. 8. slideshare.net/bram_
  9. 9. EEN WEBSITEIs dat wel nodig?
  10. 10. absoluut.
  11. 11. Particulieren in België in 2010‣ 78% heeft thuis internettoegang (EU: 69%)‣ 75% surft minstens één keer in de week‣ 49% shopte in 2010 online (EU: 56%) Cijfers: Eurostat
  12. 12. Heb je een eigen website nodig?
  13. 13. niet per sé.
  14. 14. Internet aanwezigheid‣ Eigen website‣ Google Maps‣ Sociale netwerken‣ ...
  15. 15. Is een eigen website aangeraden?
  16. 16. Ja, als je meer controle wil over wat er overjouw zaak te vinden is op internet.
  17. 17. En als je je wil onderscheiden vanconcurrenten.
  18. 18. EEN WEBSITE DIE WERKTWat wil dat eigenlijk zeggen?
  19. 19. Wat is dat, een website die werkt?
  20. 20. Een website die werkt‣ Veel bezoekers?
  21. 21. Een website die werkt‣ Veel bezoekers?‣ Op nummer 1 in Google?
  22. 22. Een website die werkt‣ Veel bezoekers?‣ Op nummer 1 in Google?‣ Mooi ontwerp?
  23. 23. Een website die werkt‣ Veel bezoekers?‣ Op nummer 1 in Google?‣ Mooi ontwerp?
  24. 24. Een website die werkt‣ Converteert optimaal‣ Scoort hoog in zoekrobots bij de juiste doelgroep (SEO)‣ Positieve ROI
  25. 25. 8 basisprincipes
  26. 26. 8consistentie inhoudtypografie toegankelijkheidportability technologiesnelheid interactie
  27. 27. 1. Consistentie
  28. 28. Verwachtingen‣ Logo ‣ Navigatie‣ Taalselectie ‣ Broodkruimel‣ Home-knop ‣ Zoekveld
  29. 29. Logo‣ Links boven‣ Link naar homepage‣ Optioneel met tagline
  30. 30. Logo
  31. 31. Taalselectie‣ Rechts boven‣ ISO (NL - FR - EN)‣ Toon alle opties, ook de actieve taal‣ Geen vlagjes!
  32. 32. taalselectie
  33. 33. Home-knop‣ Eerste knop in hoofdnavigatie‣ Altijd ‘home’
  34. 34. home-knop
  35. 35. Navigatie‣ Hoofdnavigatie horizontaal bovenaan‣ Subnavigatie links‣ Vermijden: onderaan of rechts
  36. 36. Secundaire navigatie‣ Helemaal onderaan, in de footer‣ Privacy statement, disclaimer, sitemap
  37. 37. hoofdnavigatiesubnavigatie
  38. 38. secundaire navigatie
  39. 39. Broodkruimel‣ Toont actieve pagina in hiërarchie‣ Onder de hoofdnavigatie‣ Klikbaar, behalve actieve pagina‣ Zonder ‘je bent hier: ’
  40. 40. broodkruimel
  41. 41. Zoekveld‣ Rechts boven‣ Gevaarlijk!‣ Bezoekers verwachten Google-niveau
  42. 42. zoekveld
  43. 43. Consistentie geeft houvastHet is duidelijk‣ waar je vandaan kwam‣ waar je nu bent‣ waar je naartoe kan gaanin de visuele taal die andere websites ook spreken
  44. 44. 8consistentie inhoudtypografie toegankelijkheidportability technologiesnelheid interactie
  45. 45. 2. Typografie
  46. 46. Mensen schrijven meer naar elkaardan ze bellen.“The web is text.”
  47. 47. Leeslengte‣ Ideaal: tot ongeveer 55 karakters per regel‣ Flexibele layout: gebruik maximumbreedte
  48. 48. Lettergrootte‣ Minstens 12px voor broodtekst‣ Moderne browsers schalen alles‣ “ A A A ” is overbodig
  49. 49. Geschreefd of schreefloos?Op een scherm: schreefloos (sans-serif)Ed ut perspiciatis unde omnis Ed ut perspiciatis unde omnisiste natus error sit voluptatem iste natus error sit voluptatemaccusantium doloremque accusantium doloremquelaudantium. laudantium.
  50. 50. 8consistentie inhoudtypografie toegankelijkheidportability technologiesnelheid interactie
  51. 51. 3. Portability
  52. 52. Mohammed en de bergProbeer bezoeker niet naar je website te lokken.Verspreid je inhoud op plaatsen die albezoekers hebben.
  53. 53. RSS‣ Really Simple Syndication‣ Geïnteresseerden krijgen updates‣ Zoekrobots zijn hier gek op
  54. 54. API‣ Application Programming Interface‣ Toegangspoort tot een website‣ Data toevoegen en/of data afhalen
  55. 55. Social Media plugins‣ Makkelijk te integreren‣ 1 klik‣ “Mond-aan-mond”
  56. 56. 8consistentie inhoudtypografie toegankelijkheidportability technologiesnelheid interactie
  57. 57. 4. Snelheid
  58. 58. Wat volgt is de hoeveelheid tijd die eenbezoeker wil spenderen om uit te zoeken hoeeen website werkt:
  59. 59. 0
  60. 60. Bezoekers hebben geen geduld‣ Snel laden (technisch)‣ Focus (inhoud)‣ Scanbaar (structuur)
  61. 61. Korte quiz
  62. 62. 8consistentie inhoudtypografie toegankelijkheidportability technologiesnelheid interactie
  63. 63. 5. Inhoud
  64. 64. Vers en fris!
  65. 65. “A website is like underwear.Refresh every day.”
  66. 66. Publiceer op regelmatige basis‣ Kies relevante onderwerpen‣ Nieuws‣ SEO vs. bezoeker
  67. 67. Hou statische inhoud vers‣ Schrap pagina’s die niet bezocht worden‣ Kijk af en toe of inhoud nog up-to-date is‣ SEO vs. bezoeker
  68. 68. Publiceren, updaten, ...Iedere keer langs IT-dienst of webbouwer?
  69. 69. CMS‣ Content Management System‣ De motor van de website‣ Makkelijk zélf inhoud bewerken‣ SEO!
  70. 70. Een CMS moet je toelaten om het dagelijksebeheer van je website onafhankelijk en zondertechnische kennis uit te voeren.
  71. 71. 8consistentie inhoudtypografie toegankelijkheidportability technologiesnelheid interactie
  72. 72. 6. Toegankelijkheid
  73. 73. Bouw een toegankelijke website‣ Gebruiksvriendelijk‣ Cross-browser, cross-platform‣ Anysurfer‣ Google‣ Facebook
  74. 74. Gebruiksvriendelijk‣ User Centered Design‣ Gebruikerstest
  75. 75. Cross-browser, cross-platform‣ Windows, Mac OS (Apple), Linux‣ IE, Firefox, Safari, Chrome, Opera‣ Webstandaarden‣ iPad & smartphone!
  76. 76. Anysurfer‣ Kwaliteitslabel‣ Website toegankelijk voor iedereen, ook voor mensen met een functiebeperking
  77. 77. Google‣ Grootste bron van traffiek‣ SEO!
  78. 78. Facebook‣ ‘Like’ + Open Graph‣ Zoekmachine
  79. 79. 8consistentie inhoudtypografie toegankelijkheidportability technologiesnelheid interactie
  80. 80. 7. Technologie
  81. 81. Er zal altijd nieuwe technologie zijn‣ Flash‣ Ajax‣ HTML 5‣ Video
  82. 82. Technologie mag geen drijfveer zijn.Denk na over de waarde.
  83. 83. 8consistentie inhoudtypografie toegankelijkheidportability technologiesnelheid interactie
  84. 84. 8. Interactie
  85. 85. Laat bezoekers participeren‣ Poll, testjes, ...‣ Feedback mechanismen‣ Reacties plaatsen, forum‣ Zelf inhoud toevoegen
  86. 86. + interactie met het merk verhoogd+ ‘gratis’ input voor web en print+ workload webredactie verminderd+ rijke data over voorkeuren van leden
  87. 87. 8consistentie inhoudtypografie toegankelijkheidportability technologiesnelheid interactie
  88. 88. En het grafisch ontwerp?
  89. 89. Een goed ontwerp valt niet op.Het staat ten dienste van de inhoud.
  90. 90. En social media?Wat daarmee?
  91. 91. 9consistentie inhoudtypografie toegankelijkheidportability technologiesnelheid interactie social
  92. 92. 9. Social
  93. 93. Het web gisteren‣ Website is een doorgeefluik voor info‣ Digitaal magazine
  94. 94. Het web vandaag‣ Een website (ver)bindt mensen‣ Web = mensen
  95. 95. Mensen converseren
  96. 96. Social Media‣ Conversaties initiëren‣ Conversaties voeden‣ Conversaties opvolgen‣ Enorme (marketing) waarde
  97. 97. Tips‣ Lanceer liever vandaag dan morgen‣ Niet alles ineens, kleine stappen‣ Meet, evalueer, stuur bij
  98. 98. VRAGEN?
  99. 99. twitter.com/bram_ www.netlash.com
  100. 100. Trafiek
  101. 101. Built it and they will come
  102. 102. Built it and they will come
  103. 103. Trafiek‣ SEO - SEA‣ Affiliate Marketing‣ E-mail Marketing‣ Social Media Marketing
  104. 104. SEO - SEA‣ Search Engine Optimization‣ Search Engine Advertising
  105. 105. Affiliate marketing‣ Juiste advertentie op de juiste website‣ CPC (cost per click)‣ pay-for-performance (TradeTracker Belgium)
  106. 106. E-mail Marketing‣ Nieuwsbrieven & direct mailings‣ Statistieken!‣ CRM met klantenprofielen
  107. 107. Social Media Marketing‣ Conversaties initiëren‣ Conversaties opvolgen
  108. 108. twitter.com/bram_ www.netlash.com

×