Schema.org is good for you!

gepost op Donderdag 17 november 2011 door Thomas

De belangrijkste zoekmachines (Google, Bing en Yahoo) hebben een initiatief genomen om een gezamelijke markup te gebruiken om websites beter te begrijpen. Als gevolg is schema.org ontstaan. Het komt er op neer dat je als webdeveloper extra "micro data" toevoegt aan de html code. Op die manier geef je aan zoekmachines mee wat voor type inhoud je op de website kan terug vinden.

Onderstaande code is een eenvoudig voorbeeld van een product item. Maar op schema.org kan je nog andere types vinden: Event, Intangible, Organization, Person, Place en Product

Nadat je de micro data aan de html code hebt toegevoegd, controleer je dit best eens via Rich Snippets Testing Tool. Deze tool zal aangeven of je micro data goed overkomt.

Na verloop van tijd zal Google en co extra informatie tonen in de zoekresultaten. Je moet wel wat geduld hebben om het resultaat te zien. Bij deze heb je alvast enkele voorbeelden::

Evenement

Filmpjes & foto's

Broncode van Youtube.com: (zie itemscope & itemprop)

Met als resultaat

We hebben bij webatvantage een eye tracking test gedaan. Het resultaat kan je hier bekijken. Maar je hoeft geen dure eye tracking tests te doen om tot de conclusie te komen dat de aandacht naar de afbeeldingen en de foto's gaat.

E-commerce

Bij onderstaande screenshot wordt de aandacht getrokken naar de gele sterretjes en naar het filmpje.

Recept

Dit voorbeeld illustreert goed dat je niet perse de eerste in het rijtje moet zijn om alle aandacht naar je toe te trekken. 

Conclusie

Schema.org zullen de zoekresultaten alleen maar ten goede komen. Enerzijds heb je een beter visueel effect (zie screenshots) anderzijds zal belangrijke informatie zoals merken, datums, locaties enz. beter geïndexeerd geraken. Maar dat van die indexatie is eerder een vermoeden dan een feit. Of vergis ik mij?

Bij webatvantage hebben we op enkele websites schema.org geïntegreerd. Het is nog even wachten wat het resultaat zal zijn op lange termijn. We houden jullie in ieder geval op de hoogte!

Reacties, ervaringen of vragen i.v.m. met schema.org zijn altijd welkom via een reactie.

Met de zomer in aantocht, mag het allemaal een beetje korter...

gepost op Vrijdag 08 april 2011 door Lieven

Zo denken wij er ook over bij Webatvantage. Na gretig gebruikt gemaakt te hebben van bit.ly of tiny.cc, vonden we het tijd om een eigen .be url-shortener in het leven te roepen nl. http://urls.be en deze meteen ook voor iedereen toegankelijk te maken.

Voorlopig is het een heel eenvoudige tool, paste er een lange url in en je krijgt een korte url, met een vaste lengte van steeds 16 karakters terug. Deze korte url is ideaal om te gebruiken in bv. Twitter, Facebook,...

Een voorbeeld: deze url http://www.webatvantage.be/Portfolio/leirovins-101 kan je makkelijk inkorten tot http://urls.be/SecSzT.

In de komende maanden zullen nog extra functionaliteiten worden toegevoegd, zoals een QR-code bij elke verkorte URL, de mogelijkheid om een account aan te maken om statistieken en extra features te kunnen raadplegen, ... Dus plaats deze site zeker in je bookmarks.

Heb je suggesties of ideeën, mail of tweet ze ons gerust.

Webdesign proces Schoenen Verduyn

gepost op Dinsdag 18 januari 2011 door Inge

Schoenen Verduyn uit Kortrijk had reeds een website. Omdat ze een moderner online imago wensten nu hun fysieke winkel een opfrissing gekregen had en omdat ze hun collectie ook online wilden gaan aanbieden, klopten ze bij ons aan om een nieuwe website te maken voor hen.  

Schoenen Verduyn is zowat de betere schoenwinkel en dat moest hun website ook gaan uitstralen. Hun aanbod is heel groot en de doelgroep bestaat zowel uit mannen, vrouwen en kinderen.

Bij mijn eerste voorstel voor een nieuw design, hield ik rekening met de bestaande huisstijl en met de web usability regeltjes.



De reactie van de klant op dit ontwerp was dat ze meer wilden uitpakken met de foto's van hun winkel. Bij  het tweede ontwerp werkte ik met een grotere foto in de header die tevens een slideshow is zodat de bezoekers meerdere foto's van de winkel kunnen bekijken. Ook werk ik hier subtiel met een schermvullende achtergrondfoto (zwart/wit).



De reactie van de klant op dit ontwerp was idem als op het eerste ontwerp. Ze stelden voor om als beginpagina enkel een schermvullende foto te gebruiken. Omdat het seo-gewijs niet aan te raden is om geen content te gebruiken op de homepage, sloten we het compromis om een kleine introtekst met links naar de andere pagina's van de website te plaatsen op de foto.
En dit is wat het geworden is:

Usability tips voor webdesigners

gepost op Dinsdag 14 september 2010 door Inge

Mensen surfen op het internet omdat ze iets zoeken. De taak van een webdesigner is om deze zoektocht zo 'luxueus' mogelijk te maken.
Kortom moeten we ervoor zorgen dat de surfer efficiënt vindt wat hij zoekt én dat deze zoektocht een aangename ervaring is.

Enkele eenvoudige usability tips:

• Het gebruik van breadcrumbs. Als Hans en Grietje gebruik hadden gemaakt van broodkruimels, hadden ze hun weg naar 'Home' wel gevonden. Breadcrumbs worden vooral gebruikt wanneer pagina's bestaan uit meerdere subpagina's. Het zorgt voor een transparante structuur van een website.
  
• Vergroot (indien mogelijk) het aanklikbaar veld van een link. Maak bijvoorbeeld van een link in een lijstje een block-element (display:block;).
  
• Gebruik genoeg contrast op de website en zorg ervoor dat de lettertypes groot genoeg zijn. Om een aangename leeservaring te bieden, kan je gebruik maken van de line-height. Een paragraaf leest veel vlotter als de lijnen niet tegen elkaar gedrukt staan.
  
• Zorg voor een duidelijke navigatie & structuur op de website.
  
• Het gebruik van genoeg ruimte tussen de elementen op een pagina zorgt ervoor dat de structuur gezien wordt.
  
• Geef elke gebruiker gemakkelijk toegang tot de website. Maak gebruik van de webstandaarden.
  
• Geef zinvolle feedback op wat de surfer doet. Vult de bezoeker bijvoorbeeld een veld in een formulier fout in, geef dan aan wat wel verwacht wordt.
  
• Dat goede copyrighting de gebruiksvriendelijkheid van een website verhoogt, is een understatement.
  
• Maak van het bedrijfslogo, een link naar de homepage.
  
• Zorg ervoor dat alles werkt. Niets zo frustrerend voor een bezoeker als iets dat niet lijkt te werken.
  

En zo zou ik nog wel even kunnen doorgaan. Maar misschien dat de tip der usability tips wel deze is: wees een user!
Leef je in als bezoeker van de website en ontdek zo wat beter kan.