Category Archives: Webdesign

Excel-dashboard voor statistieken website

Posted on by

Ik ben mezelf meer aan het ontwikkelen op het gebied van online marketing en SEO en volg daar sinds kort een cursus voor. Ik hoop hiermee mijn kansen op de arbeidsmarkt te verstevigen en mijn kennis over SEO e.d. aan te kunnen tonen. Daarom was ik op zoek naar een Excel-dashboard waar je de statistieken/Analytics gegevens van je website in kunt verwerken. Van een oud-collega op Twitter kreeg ik een mooie link naar een aantal Excel-dashboards, maar deze waren net te uitgebreid voor mijn smaak.

Na nog wat rondgezocht te hebben, besloot ik mijn eigen Excel-dashboard te maken. En ik moet zeggen dat het me aardig afging! Om anderen een soortgelijke zoektocht als die van mij te besparen, heb ik besloten deze vrij te geven.

Benodigheden:
Microsoft Excel 2007 of hoger.
Je statistieken van je website, het liefst geserveerd door Google Analytics.

Handleiding:
Na het openen van het Excel-bestand, zie je dat er twee werkbladen zijn: dashboard en gegevens. In het blad ‘Gegevens’ vul je de statistieken van je website in.
Dan kun je op het werkblad ‘Dashboard’ via de twee tabellen en de twee grafieken heel makkelijk de trends van je website zien. Gaan de bezoeken omlaag? Hoe zit het met mijn verkeer? De trends kun je met dit dashboard makkelijker zien, dan via alle cijfers en grafiekjes die bijv. Google Analytics laat zien.
Belangrijk: pas geen formules, grafieken of celeigenschappen aan, als je niet weet wat je doet. Hierdoor kan de hele functionaliteit wegvallen.

Het is geen vervanging voor je website-statistieken programma, maar een mooie en overzichtelijkere aanvulling erop. Zeker als je voor collega’s of stakeholders een overzichtje moet maken.

Op- of aanmerkingen? Laat het weten, dan kan ik het dashboard aanpassen en een nog betere versie afleveren!

Download Sophie’s Choice’s Excel analytics-Dashboard!

Versie 1.1, 21 mei 2013: Versie 1.1 van mijn Excel-dashboard. In de twee tabellen op het werkblad ‘Dashboard’ waren er formulefoutjes in de kolom die percentage stijging of daling berekend.
Versie 1, 21 mei 2013: Versie 1 van mijn Excel-dashboard.

(Technische) achtergronden bij de grote update van All Things Royal

Posted on by

Na een hele tijd piekeren over de inhoud van de website ben ik aan de slag gegaan met een redesign en het verdelen van inhoud. Ik dacht dat het misschien wel interessant was voor sommigen om wat meer achtergrond te hebben bij de update van mijn royaltywebsite All Things Royal :) .

Zo is de lay-out van de website gebaseerd op een mix van drie lay-outs van designer Andreas Viklund: te weten Andreas01, Basic Modular en Variant Multi. Er is nog geen HTML 5 of CSS 3 aan te pas gekomen, ik ben gewoon bij XHTML en CSS 2 gebleven. Wel heb ik middels CSS het design responsive kunnen maken, zodat bezoekers met een smartphone of tablet ook een fijne ervaring hebben.
Ik ontdekte een mooie techniek op de website van Simon Collison, en heb die gebruikt voor de bronvermelding en voetnoten op de site.

Qua lay-out was het snel voor elkaar gebokst. Maar qua inhoud was het een ander verhaal. Ik was niet echt tevreden met de indeling en de informatie die erop stond. Het enige onderdeel er mee door kon, was koninklijke juwelen. Uiteindelijk besloot ik genealogie, informatie over ordes en decoraties en de pagina’s van getikte monarchen te verwijderen. Deze zullen op de blog in een of andere manier gepubliceerd worden. De website moet namelijk zich meer op de basisinformatie gaan richten over koninklijke families. De blog is geschikt voor achtergronden en nieuws.
De fansites over prinses Diana, prinses Máxima en hertogin Catherine (nieuw!) zijn eveneens aangepakt.

Veel plezier!

De voorkennis van een gebruiker

Posted on by

Terwijl ik mijn kennis over usability aan het opfrissen was, kwam ik op een alleraardigst stukje terecht dat je als webdesigner altijd moet inhaken/inspelen op de voorkennis van een gebruiker. Je kunt het ook zo stellen: inspelen op waar een gebruiker aan gewend is geraakt of verwacht.

Denk bijvoorbeeld aan een webwinkel. Het is inmiddels een ongeschreven wet bij webwinkels dat er overal een winkelwagentje is te zien, dat in het perfecte scenario linkt naar een pagina waar de klant de inhoud van zijn winkelwagentje kan bekijken (en het liefst ook de totale kostprijs). Door het succes van webwinkels als Wehkamp, Amazon en Bol.com zijn mensen daar aan gewend geraakt, hou daar dus rekening mee voor je eigen webwinkel.

Nog een aantal zaken wat een bezoeker op een website verwacht:

  • op een website van een bedrijf of organisatie verwachten bezoekers dat er contact-informatie aanwezig is, alsmede een routebeschrijving.
  • bij een webwinkel is een plus als aangegeven wordt dat een bepaald product niet meer op voorraad is. Ook informatie over het ruilen/terugsturen van producten of (bij mode) welke kledingmaten gehanteerd worden is zeer gewenst.
  • het navigatie-gedeelte is duidelijk aanwezig. Aan de linkerkant op de pagina of bovenaan in het midden. De verschillende opties in de navigatie zijn duidelijk en helder omschreven, zodat mensen direct zien waar ze kunnen vinden wat ze nodig hebben.
  • een zoekfunctie is onmisbaar
  • links vallen goed op en hebben een duidelijke tekst.

Probeer dus zoveel mogelijk aan de verwachtingen van bezoekers te voldoen. Ze zullen u dankbaar zijn, want ze hoeven niet eerst uit te puzzelen hoe uw site nu precies werkt en wat ze er allemaal kunnen doen.

Google Breadcrumbs

Posted on by

Ik ben al een tijdje bekend met het fenomeen Sitelinks van Google, en nu hebben ze sinds 18 november iets nieuws: breadcrumbs. Van de week dacht ik al zoiets te spotten tijdens een zoekopdracht (betrof een zoekresultaat van de website van Apple) en het zag er best tof uit. Gebruikers krijgen zo meteen een beeld van de structuur van de website.

screenshot_googlebreadcrumb3

Vanuit een usability-ooghoek bekeken is het geen slecht idee, maar wat de precieze meerwaarde zal zijn bij het optimaliseren van je website?
Na een paar zoekopdrachten gedaan te hebben, lijkt er nog geen vaste lijn te zitten aan wat voor soort websites ze worden toegekend. Vermoedelijk omdat het nog nieuw is.

Google zelf heeft dit erover te zeggen:

“The information in these new hierarchies come from analyzing destination web pages. For example, if you visit the ProductWiki Spidersapien page, you’ll see a series of similar links at the top, “Home> Toys & Games> Robots.” These are standard navigational tools used throughout the web called “breadcrumbs,” which webmasters frequently show on their sites to help users navigate. By analyzing site breadcrumbs, we’ve been able to improve the search snippet for a small percentage of search results, and we hope to expand in the future.”

Vooralsnog is mij ook nog niet duidelijk hoe je ze kunt krijgen, en of het aansluiten bij het webmastersprogramma helpt. Al lijkt het me wel logisch dat een pagina voldoet aan de standaarden voor HTML en CSS en dat de structuur van de pagina netjes is. Stay tuned!

(lees Google Breadcrumbs launched op Searchcowboys en het bericht over de breadcrumbs op de officiële Googleblog)

Gebruikers Internet Explorer hebben weer normaal beeld

Posted on by

Tot mijn grote schrik meldde iemand me via MSN vanmiddag dat deze website er in Internet Explorer niet uitzag, de letters waren onleesbaar groot. Als webdesigner kreeg ik meteen het schaamrood op mijn kaken. Het zou toch niet…?

Jawel.

Het is hersteld, dus mensen met Internet Explorer hebben geen koeienletters meer op hun scherm.

Grmbl

*mompelt iets over Microsoft, Internet Explorer en standaarden*

Degene die het meldde trouwens vond het een leuk moment om nog even fijntjes onder de neus te wrijven dat een Apple je-van-het-is-en-zich-wel-aan-standaarden-houdt. Maar ze heeft me wel overtuigd :P ;)