Content management systems!

Cartoon van Socialsignal.com

Rein Lemmens van Kapernikov gaf ons tijdens een gastles meer uitleg over het bouwen van websites met content managementsystemen. Wat is nu juist een content management systeem? Wel, het is een softwaretoepassing die het mogelijk maakt dat mensen zonder veel technische kennis documenten en gegevens op het web kunnen publiceren. Content management systemen vallen uiteen in twee grote stukken namelijk Document management system en Web content management system.

Het belangrijkste dat een website nodig heeft is:

  • gebruiksvriendelijkheid voor (niet technische) beheerders
  • de mogelijkheid om veel informatie te beheersen
  • interactieve features zoals zoeken en commentaar

Drupal is een voorbeeld van een opensource-contentmanagementsyteem. Drupal werd ontwikkeld door de Belg Dries Buytaert en wordt zelfs door het Witte Huis gebruikt. Drupal is populair omdat het breed inzetbaar, goed uitbreidbaar en goed beheerbaar is. Een andere belangrijke reden is dat het vrij te gebruiken is, er zijn geen licentiekosten. Dus zoals men kan afleiden uit deze blogpost is Drupal een goed hulpmiddel voor het bouwen van websites. Zelfs God wil gebruik maken van Drupal zo blijkt uit onze cartoon.


WordPress Oefening!

Cartoon afkomstig van Email-marketing-reports.com

Opdracht: Verander het uitzicht van een tekstblok op je blog met behulp van de css style sheet.
Verander volgende layout opties van je tekstblok:

  • achtergrondkleur: lichtblauw
  • rand: donkerblauw, dikte 5px
  • lettertype: Verdana, grootte 12px
  •  marge linkerkant: 30px

Ik ben als volgt te werk gegaan:

  • Via firebug ik de post gezocht die ik wilde bewerken, dit was post 63
  • Hierna heb ik in de folder public_html mijn CSS bestand gezocht.
  • Waarna ik door middel van de Code Editor het CSS bestand heb gewijzigd.

 


Accessibility!!

Cartoon van Rob Cottingham

Toegankelijkheid is een onderdeel van usability en betekent dat een product of dienst bruikbaar is voor iedereen, inclusief personen met een functiebeperking. Bovenstaande cartoon wijst erop dat wanneer men een site toegankelijk maakt voor mensen met een visuele handicap ze net zoals iedereen gebruik kunnen maken van een website.

Het web biedt voor iedere gebruiker met een functiebeperking oneindig veel mogelijkheden die voordien niet of moeilijk te bereiken waren in het dagelijkse leven. Voor diegene met een handicap biedt het een digitale revolutie die dingen mogelijk maakt die voorheen niet konden. Voor websiteontwikkelaars is het belangrijk dat iedereen toegang heeft tot de website, zo kunnen ze een zo groot mogelijke doelgroep bereiken. Maar wanneer men rekening houdt met de toegankelijkheidsmaatregelen houdt men zich eigenlijk ook bezig met SEO, aangezien Google deze websites dan beter kan lezen en indexeren.

De toegankelijkheid wordt bereikt doordat zowel internetgebruikers als webwerkers zich aanpassen. Internetgebruikers moeten aangepaste hard- en software hebben alvorens ze gebruik kunnen maken van een toegankelijke website. Maar wat ons aanbelangt is dat de webwerkers de toegankelijkheidsrichtlijnen in acht nemen.

Elk jaar wordt er een onderzoek gedaan naar de toegankelijkheid van Belgische websites door Anysurfer, dat is een kwaliteitslabel voor toegankelijke websites. Aan de hand van quickscan testen zij de toegankelijkheid van een steekproef van Belgische websites. Zij doen dit in samenwerking met verschillende Vlaamse hogescholen en universiteiten. Ook wij mochten twee websites beoordelen aan de hand van de quickscan. Zo beoordeelde ik de website van Belgacom en Immoweb op hun toegankelijkheid. Persoonlijk vond ik dat deze website over het algemeen goed scoorden op de 15 ijkpunten van de toegankelijkheidsmonitor. Ik was verbaasd toen ik las dat enkel 8.4% van de Belgische websites voldoet aan de minimum vereisten van toegankelijkheid volgens de toegankelijkheidmonitor 2011. Dit wijst erop dat dingen die online  vanzelfsprekend zijn voor mensen zonder functiebeperking niet altijd even makkelijk toegankelijk zijn voor mensen met een functiebeperking.  Er is dus nog veel werk aan de winkel!

Lees zeker Elisesblog eens over accessibility!


Mobile web: Second Screen!

Cartoon afkomstig van hystrygirlteacher

Zoals deze cartoon al aantoond hebben apps oftewel applicaties onze wereld deels overgenomen. Tegenwoordig bestaat er voor ongeveer alles een applicatie. Tijdens de gastles van Lode Nachtergaele leerden we meer bij over het fenomeen ‘Second Screen”.  Hierbij wordt bedoeld een elektronisch apparaat zoals een gsm of een tablet die een televisiekijker toelaat interactie te hebben met de televisie inhoud die ze aan het consumeren zijn. Het second screen zorgt voor interactieve televisie, dit laat een interactie toe tussen de kijker en de informatie die ze krijgen via het scherm. Uit deze gastles blijkt dat deze interactiviteit de sensatie van een live programma versterkt bij de kijker en de kijker ook sterker betrekt in de wereld van het programma. Het is daarom belangrijk dat programma makers deze techniek in de armen sluiten en zo in de toekomst hopelijk meer gaan toepassen.

Wat belangrijk is bij second screen is dat mensen het gevoel hebben dat ze samen met anderen iets beleven. Televisie heeft een sociale dimensie die er voor zorgt dat mensen er met elkaar over praten. Een second screen voorbeeld hiervan zijn de twitter reacties die verschijnen op het beeld tijdens het televisieprogramma ‘The voice van Vlaanderen’. Zo kan kijken Vlaanderen zijn mening geven op de kandidaten. Zoals je aan de volgende cartoon kan zien zal dit fenomeen zich niet beperken tot de televisie alleen, ook in het onderwijs kan een second screen een meerwaarde worden.

Cartoon afkomstig van Cartoonstock

Lees zeker eens de blogpost van Elien, zij geeft tips om je website mobiel te maken!


Web Design!

Tijdens het gastcollege van Bob De Schutter leerden we meer over webdesign. Volgens hem bestaan er twee manier om aan design te doen die hij vergelijkt met de blauwe pil en de rode pil uit de film The Matrix. In de film staat de blauwe pil voor een soort illusie wereld en de rode pil voor de realiteit die soms pijnlijk kan zijn.

“You take the blue pill – the story ends, you wake up in your bed and believe whatever you want to believe. You take the red pill – you stay in Wonderland and I show you how deep the rabbit-hole goes.” -Morpheus

Wanneer hij deze twee visies betrekt op design komen we bij het volgende:

De blauwe pil

Deze manier van design is volgens Bob De Schutter de meest veilige, volgens hem maakt ongeveer 95% van de designers gebruik van deze manier van werken. Het is bij deze manier van werken dat men vaak het werk van anderen gaat kopiëren. De blauwe pil designers maken gebruik van vastgelegde regels en durven niet ‘outside the box’ te denken. Ze werken met bepaalde kleuren programma’s zoals Kuler om te bepalen welke kleuren goed samen passen. Wanneer men de weg volgt van de blauwe pil is design makkelijk, je volgt de regels, kleed je als een designer en je komt er wel.

De rode pil

De rode pil volgt geen veilige weg, hier zijn geen standaard regeltjes te vinden men verwacht dat ze zelf de regels gaan opstellen. Het is hier belangrijk dat men gaat nadenken wat men wil communiceren en daarna gaat men zijn persoonlijkheid in het webdesign steken. Diegene die de rode pil kiezen durven ‘outside the box’ te denken maar ze lopen het risico gekopieerd te worden zonder erkenning te krijgen.

Cartoon van Mendix.com

Deze cartoon toont dat je als blauwe pil designer geen echte originele ‘skills’ moet hebben om aangenomen te worden als webdesigner.


Web analytics!

Cartoon door Stephan Pastis

Tijdens een gastcollege over web analytics van Steve Deveirman werd ons uitgelegd wat er belangrijk is aan de statistieken van je website. Kort samengevat is dit belangrijk om te zien wie je aanspreekt door je website en waar deze personen interesse voor hebben op je website. Doordat men een duidelijker beeld krijgt van de bezoeker kan men de juiste doelgroep bepalen en de boodschap afstemmen op deze doelgroep.

Google Analytics is een gratis dienst om de statistieken van een website te verzamelen en gedetailleerd weer te geven. Deze dienst heeft als doel om de beheerder van de website een duidelijk beeld te geven van onder meer bezoekersstromen, verkeersbronnen en paginaweergaves. Aan de hand van deze informatie kan een webmaster verschillende aspecten van  de website aanpassen aan het gedrag van de bezoeker (wikipedia). Google Analytics is de bekendste tool voor het meten van websites, ongeveer 70% van alle websites in de wereld worden gemeten door Google Analytics. Tijdens de gastles legde Steve Deveirman uit op basis van welk principe Google Analytics werkt. Google Analytics werkt volgens de Pixelmethode waarbij de volledige website op een server staat behalve één jpg die vanuit google moet worden geraadpleegd. Door die ene jpg kan men vanuit google meten hoeveel mensen er op je webpagina komen. Er worden drie dingen gemeten namelijk het IP adres, de user agent data en de cookies.

Enkele belangrijke functies binnen Google analytics zijn:

  • Aantal bezoeken in totaal sinds de start van de meting met Google Analytics
  • Bouncepercentage:  de bouncerate zijn het aantal bezoekers die meteen weer de pagina verlaten zonder verder te klikken. Een te hoog weigeringspercentage geeft aan dat de pagina waarop men terecht komt niet uitnodigt om verder te zoeken op de website. Een bounce percentage tussen 40% en 60% is normaal voor een website.
  • De gemiddelde tijd die bezoekers spenderen op de site
  • Een weergave van hoe de bezoekers op de website zijn gekomen

Zoals je kan zien biedt Google Analytics veel nuttige informatie voor het verbeteren van je website. Echter wijst de cartoon van deze blogpost erop dat hoe veel je ook rekening houdt met de statistieken, als je inhoud niet interessant is zal je site niet veel bezoekers lokken!


Web usability!

Cartoon van Geoff Muskett

Usability werd in de gastles van Lonneke Spinhof gedefinieerd als:

“De mate waarin een product gebruikt kan worden door specifieke gebruikers (de doelgroep) om een specifiek doel te bereiken, en dit op een efficiënte en aangename manier in een bepaalde gebruikerscontext.”

Tijdens deze gastles haalde ze een interessante term aan namelijk de ‘Three click rule’, deze regel voor web usability wordt in deze blogpost nader verklaard.

Three click rule

  De Three click rule is een onofficiële regel bij webdesign meer bepaald bij het ontwerpen van website navigatie. Deze regel stelt dat elke gebruiker van een bepaalde website de informatie die hij wenst moet vinden binnen 3 kliks met de muis. De reden hiervoor is de gedachte dat gebruikers gefrustreerd gaan worden en uiteindelijk zullen afhaken als ze niet snel genoeg de gewenste informatie vinden. Maar volgens Lonneke Spinhof is het aantal kliks niet het belangrijkste voor het al dan niet afhaken van website gebruikers, volgens haar is het belangrijker dat de gebruikers goed begeleid worden tijdens hun zoektocht naar bepaalde informatie. Deze cartoon van useit.com toont duidelijk dat wanneer men de gebruikers van een website niet zorgvuldig begeleidt ze al snel afhaken. Door het toevoegen van een simpele spellingscorrectie zouden deze vakantiegangers hun gewenste locatie wel vinden op de website.


Webproductieproces!

Tijdens het gastcollege van Mattias Vermeire van ‘Kunstmaan’ werd het proces van de productie van een website uitgelegd. Belangrijk hierbij is dat alle project stappen zorgvuldig en correct worden uitgevoerd. Hoewel deze stappen voor velen nutteloos en overbodig lijken zijn deze toch ondersteunend voor het produceren van een website. Achtereenvolgend zijn de verschillende stappen:

 

  • Project setup
    Hierin wordt bepaald voor wie de website moet dienen, wie allemaal aan de website gaat werken, wat de taakverdeling is in het communicatiebureau en wanneer de website gelanceerd kan worden. Belangrijk is hierbij dat zowel het team als de klant weten wat er mogelijk is op ondermeer budgettair vlak.
  • Analyse
    In deze fase worden de behoeften van de gebruikers als van het bedrijf geanalyseerd. Men gaat met deze informatie verder het project afbakenen.
  • Ontwerp
    Tijdens deze fase gaat men het idee concreet uitwerken doormiddel van een functioneel ontwerp, technisch ontwerp en een grafisch ontwerp. En functioneel ontwerp concentreert zich eerder op de structuur van de website en de navigatie. Een technisch ontwerp zorgt ervoor dat de site blijft werken ook al komen er miljoenen bezoekers per dag op de site. Tenslotte het grafisch ontwerp concentreert  zich eerder op de look and feel van de website
  • Ontwikkeling
    Bij het produceren van een website zijn er twee onwtikkelingen die zich voordoen en die moeten worden geïntegreerd met elkaar. De frontend ontwikkeling focust zich op wat de gebruikers uiteindelijk gaan zien op het scherm en de backend ontwikkeling houdt zich bezig met wat er gebeurd achter de schermen zoals bijvoorbeeld de software die ontwikkeld moet worden.
  • Inhoud
    Een lege site is niet interessant, daarom dat men die moet vullen met nuttige informatie. Hierbij moet men rekening houden met het medium dat men gebruikt namelijk het web, teksten lezen op het web is veel intensiever dan bij een gedrukt medium. Daarom moeten teksten op websites altijd aangepast worden aan het medium.
  • Afwerking en lancering
    De uiteindelijke website moet zorgvuldig worden nagekeken door zowel het communicatie bureau dat de site ontwikkeld, als door de klant zelf. Want indien bepaalde belangrijke onderdelen van een site niet werken, kan de gebruiker afhaken.

 

Cartoon afkomstig van Cartoonchurch

Aan deze cartoon te zien kan er veel misgaan bij het lanceren van een website. Naast deze ‘vaakvoorkomende’ fout wil ik graag nog een aantal tips meegeven van dingen die je best NIET doet bij het lanceren van een website (dotsolutions).

  • Een website lanceren zonder vooronderzoek
    Het is belangrijk dat er vooraf wordt nagedacht wat de doelgroep is van de website, want als men hier pas tijdens het ontwikkelingsproces gaat aan denken is het meestal al te laat. Zoals Mattias Vermeire al aangaf in de gastles is het zeer belangrijk om de user te betrekken bij de ontwikkeling van de website. Daarom dat men een vooronderzoek zeker niet over het hoofd mag zien!
  • Search engine optimization na het lanceren van een website
    Tijdens het productieproces van een website moet er al gedacht worden aan zoekmachine optimalisatie. Zo kan men zich tijdens de ontwikkeling al bezighouden met het ‘vindbaar’ maken van de website en vermijd men zo onvoorziene kosten na het ontwerpen van de website.
  • Geen oog hebben voor de statistieken van je website
    Wanneer men aandacht heeft voor de statistieken van de website kan men meteen bijsturen waar het fout dreigt te lopen.Deze statistieken kunnen je meer informatie geven over wie je site bezoekt en hoe ze op je site terecht zijn gekomen.
  • Geen aandacht schenken aan gebruiksvriendelijkheid
    Wanneer men een website ontwikkelt is men al snel ‘blind’ voor de aspecten waarop gebruikers kunnen afhaken. Daarom is het belangrijk de website op voorhand al te testen op gebruiksvriendelijkheid en deze indien nodig aan te passen.
  • Teveel gebruik maken van vaktaal
    Je moet er rekening mee houden dat de gebruikers van je website mogelijk niet zo op de hoogte zijn van het onderwerp waarover je spreekt. Het is daarom belangrijk dat je specifiek taalgebruik altijd verklaart zodat alles duidelijk is voor je gebruikers.


Webcopywriting!

Deze blog zal gaan over het gastcollege web copywriting van Jan Derboven. In deze gastles legde hij ons de basics van webcopywriting uit, namelijk wat zet je best op het internet en op welke manier? Tijdens deze les haalde hij twee communicatiemodellen waarvan ik er één hier verder zal bespreken namelijk het communicatiemodel van  Roman Jakobson, een Russische taalkundige uit de 20e eeuw. Dit communicatiemodel ziet er ongeveer als volgt uit:

“Een zender codeert een boodschap in een code. Hij stuurt die intentioneel via een medium naar een ontvanger die de boodschap decodeert. De boodschap moet een context hebben waarnaar verwezen kan worden en die begrijpelijk is voor de ontvanger.(wikipedia)”

Wanneer men een duidelijk beeld heeft van wat er bedoeld wordt met elk van deze elementen kan je een tekst met een goeie structuur schrijven. Dit is ook van belang bij een blog, daarom kunnen we op basis van dit communicatiemodel een aantal richtlijnen meegeven voor het schrijven van een goede blog.

  • Boodschap: de boodschap van je blog moet relevant zijn aan het topic van je blog, de tekst moet duidelijk zijn en wanneer men jargon gebruikt wordt dit best uitgelegd. De informatie die je geeft moet up to date zijn en informatief voor je doelpubliek.
  • Zender: de zender mag een persoonlijke mening meegeven in zijn blogposts, het is uiteindelijk zijn eigen blog waar hij reflecteert over een bepaald thema.
  • Kanaal: het is belangrijk om regelmatig dingen te posten, zodat bezoekers op regelmatige basis terugkeren naar je blog. Om meer verkeer van en naar je blog te verkrijgen link je best ook naar andere interessante informatie op het web.
  • Ontvanger: in het geval van een blog is de ontvanger de lezer. Het is belangrijk de lezer te betrekken bij de blog, dit kan door middel van een vraag te stellen of door het betrekken van sociale media. Wanneer men de lezer betrekt zal deze sneller terug komen naar je blog aangezien hij zich persoonlijk aangesproken voelt.

Ik zal de richtlijnen dan maar meteen eens toepassen op mijn eigen blog! Het topic van deze blog zijn de lessen van het vak productie van multimedia. Webcopywriting is de basis voor de productie van een succesvolle blog, vandaar ook deze inleidende post. Als zender zorg ik voor een persoonlijke toets aan deze blog, ik heb gekozen om steeds een cartoon te geven met betrekking op de blogpost om zo een humoristische noot aan deze opdracht te geven. Een blogpost van collega student Jensie Wouters is zeer interessant om te lezen als aanvulling op mijn blogpost over webcopywriting. Zo wat denken jullie dat deze hond verkeerd, dan wel goed doet op zijn blog ??

Cartoon afkomstig van CartoonStock