Organisatie van een website Aandachtspunten voor een goede Website. Niko Witvrouwen

Inhoud Mogelijkheden en aandachtspunten Een goede website maken: Voorbereiding Structuur en navigatie Vormgeving Homepage Inhoud van je website Testen van je site Als je online bent: PR voor je site  bezoekers lokken en bezoekers houden be

Onbegrensde mogelijkheden Internet is wereldwijd Interactief medium: E-mail Nieuwsgroepen Forums Invulformulieren Snel informatie Verzamelen Vergelijken Aanpassen (webdesigner) Gebruik multimedia: Tekst Foto’s Muziek Filmpjes 24u/24u: geen sluitingstijden Goedkoop

Aandachtspunten Doelgroep: waarom en voor wie? Vindbaarheid: “zoekmachine vriendelijk” Zapgedrag: Bezoeker klikt snel andere link aan Overzicht van de site: logische heldere structuur Functionaliteit Snelheidseis. Vb. snel antwoord op e-mail

Voorbereiding website Verken je onderwerp (brainstorm) Doel: waarom maak je een website? Doelgroep: voor wie maak je een website? Randvoorwaarden: wat kun je wel/niet? 1.Voor sportclub andere indeling dan voor bedrijf of school of e-commerce 2. overtuigen, informeren, verkopen, contacten leggen, amuseren 3. Kinderen en/of volwassenen en/of senioren, Vlaanderen en/of Wallonië en/of wereldwijd -> talen, … 4. Geld: zelf doen of laten maken, tijd, onderhoud, scholing, technische kennis,…

Structuur van een website Platte structuur Gedwongen structuur Diepe structuur

Keuze van structuur chaos Gebalanceerde Structuur Afhankelijk van wat je wil aanbieden Plat & Diepte  chaos Gebalanceerde Structuur

Keuze van structuur: Tips Teken je structuur op papier Maak je structuur helder voor je bezoeker: gebruik goed de navigatiemogelijkheden

Navigatie Knoppenbalk Externe links: naar andere sites dan eigen Inhoudelijke knoppen Functionele knoppen (vb. Home, Back, Contact, Sitemap,…) Externe links: naar andere sites dan eigen Sitemap: schematische weergave website Interne zoekmachine Breadcrumbs: volledige naam van pagina staat bovenaan vb. Home > Cursus > Webdesign

Alternatief: werken met gemeenschappelijke randen Navigatie (2) Frames: website bestaat uit 2 of meer delen. Voordeel: Balk met navigatie blijft staan: overzicht blijft behouden Nadelen: Bij veel frames: onduidelijk Zoekmachines werken niet goed met frames  site maar half getoond Alternatief: werken met gemeenschappelijke randen

Vormgeving Denk aan de laadtijd: bezoekers wachten niet graag lang Elementen van vormgeving: Schermopbouw Achtergrond Navigatiebalken Logo’s en afbeeldingen Let op functionaliteit van deze elementen.

Schermopbouw Zorg voor eenheid Denk aan leesrichting Tekengrootte, lettertype, kleuren,… niet veranderen op verschillende pagina’s. Denk aan leesrichting Navigatiebalken boven en/of links Belangrijkste informatie en logo bovenaan Zorg voor voldoende ruimte Maak tekst in kolommen

Schermopbouw (2) Zorg voor goede, aangename webteksten Schrijf zakelijk Schrijf beknopt Geen te lange zinnen Vermijd lastige constructies Zorg dat iedere pagina op zichzelf kan staan Lezen vanaf beeldscherm is moeilijk. Daarom geen teksten klakkeloos overnemen van boeken, folders,… Vanuit zoekmachine kom je vaak in het midden van een site terecht en niet op de homepage

Achtergrond Zorg voor leesbaarheid Gebruik contrastrijke, goed leesbare kleuren Kies een praktische kleur

Navigatiebalk Knoppen met tekst Knoppen met afbeeldingen die verwijzen naar de inhoud. Wees duidelijk en origineel Je navigatiebalk is als een visitekaartje

Logo en afbeeldingen Logo Afbeeldingen Herkenbaarheid bedrijf, school,… Op elke pagina Links of midden boven is geschikte plaats Afbeeldingen Een afbeelding zegt meer dan 1000 woorden Zorg voor functionele afbeeldingen: om te verduidelijken of op te vrolijken Niet te groot: laadtijd van je website

Homepage (Openingspagina) Eerste indruk: bepaalt vaak of mensen je site verder bezoeken Zeer weinig mensen scrollen op de homepage Alle cruciale informatie moet op 1 scherm Gebruik zelfde “stijl” als de rest van je site Via zoekmachines niet altijd op homepage, maar soms in midden van website

Inhoud van de site Aanpassen aan doelgroep: wie bezoekt je site en waarom? Denk aan interactieve mogelijkheden E-mail Aankoopmogelijkheid / Spelletje / … Enquête Aanvraagformulier Links: maak van 1 tot max 4 woorden een link naar andere pagina

Laat verschillende mensen uit je doelgroep de website testen. Zowel technisch… Kloppen de links Gaat e-mail naar juiste persoon Laadtijd niet te lang …als inhoudelijk (o.a. Spelfouten) Laat verschillende mensen uit je doelgroep de website testen.

PR voor je site Makkelijk adres Gebruik zoekmachinemarketing Google is belangrijkste Betaalde en onbetaalde zoekresultaten Gebruik goede trefwoorden Aantal clicks  ranking  Zoek verwante sites die een link naar je site willen plaatsen Plaats bericht op forum of blog

PR voor je site (2) Gebruik e-mailmarketing Opmaak in zelfde stijl als site Nieuwsbrief (Hoe vaak? Lengte? Speciale software nodig) Segmentatie Website op papieren correspondentie Briefpapier Visitekaartjes Folders, brochures en advertenties

En daarna??? Zorg dat bezoekers terugkomen Google Analytics: Juiste informatie Actuele informatie Lokkertjes (webcam, maandthema,…) Google Analytics: Bezoekersaantallen, herkomst, tijdstip. Onderhoud je site Ga met de tijd mee

Technische info en bron Technische informatie: zie Cursus Frontpage 2003 Presentatie Websites publiceren Nuttige links voor webdesign en logo-ontwerp: online tools Bron: Klantgerichte websites; Peter Beekman, Arjan Burger, Klaas Jan Huizing en Wencke Taatgen; AW Bruna Uitgevers Utrecht