In deze nieuwe reeks artikels geven we in het totaal 10 tips voor een zeer goede webshop. Als Marlon hebben we al heel wat webshops bedacht, ontworpen en gebouwd. Geen bandwerk bij ons. We maken van elke shop iets uniek, met een eigen gezicht en het resultaat is altijd van een zeer hoge kwaliteit. Dus we mogen stellen — ok, toegegeven, dit klinkt arrogant — dat we stilaan weten waarover we het hebben.
The money will roll right in
Ga echter niet denken dat deze tips een perfect draaiende en geld binnenrijvende webwinkel garanderen. Zo werkt het helemaal niet!
Een goede webshop heeft om te starten een aantal basisvereisten, die keihard voor zich spreken, maar die we toch even kort opsommen:
- een reeks straffe producten;
- aan exact de juiste prijs;
- ideaal gepromoot;
- met een fenomenale klantendienst als ondersteuning.
Zonder deze fundering mag je webshop nog zo professioneel gemaakt zijn, zo mooi ogen of zo state-of-the-art zijn, je bereikt er niet zoveel mee. De vier puntjes hierboven, dat is waar je aan moet voldoen voor je ook maar aan de rest begint te denken.
Want dat is waar we het in deze artikels over gaan hebben: the icing on the cake. Die kleine dingen die het af maken. Die eenvoudige zaken die aandacht vergen, werk vereisen, met als resultaat dat jouw webshop nog beter wordt dan die al is.
Tip 1: De ervaring van het online shoppen
Elke winkel die zichzelf respecteert — en we hebben het hier even over echte winkels uit baksteen, met deuren en ramen, en in een straat; je weet wel, dat oud soort winkels — wil ervoor zorgen dat de klant iets ervaart. Sommige winkels zijn zeer praktisch ingericht, denk maar aan de Colruyt warenhuizen. De ervaring en sfeer in die winkels is quasi onbestaand. Maar dat is ook niet erg.
Andere winkels daarentegen gaan ver de andere richting uit: de etalage, de muziek, de belichting, hoe het personeel gekleed is (of niet gekleed is): aan alles wordt aandacht geschonken. En daar eindigt het niet: de verpakking, het prijskaartje, de kapstokken, tot en met de zak die je mee neemt naar buiten: dat allemaal maakt deel uit van een merk, van een ervaring, van een sfeer. Een identiteit.
Bij een webshop is dit niet anders. We hebben vaak het idee dat iemand die online winkelt een vrij praktische actie aan het uitvoeren is. Ah ja! Ze zitten aan een computer, hét saaie en technische werkinstrument bij uitstek! Dat is een foute redenering. Natuurlijk heeft de webshop een aantal zeer praktische voordelen tegenover een gewone winkel, en natuurlijk moet de webshop uitmunten in gebruiksvriendelijkheid. Maar dat betekent niet dat we een webshop mogen herleiden tot een praktische tool. Uw webshop moet op alle vlakken ook nog haar identiteit uitstralen.
De aankoop start vroeger en duurt langer dan je denkt
Als we nadenken over welke stappen doorlopen worden door iemand die in contact komt met je webshop, dan komen we ruwweg tot deze lijst:
- eerste kennismaking: een artikel lezen, je naam lezen (en al dan niet onthouden; of al dan niet weten hoe je die juist schrijft); of een vriend of vriendin die het er over heeft en zeer eerlijk zal zijn in het delen van zijn of haar ervaring; of een zoekresultaat in Google;
- je website bezoeken: welke kleuren gebruik je, welke afbeeldingen;
- nog straffer: welke bewoording hanteer je, hoe beschrijf je jouw producten, hoe praat je tegen je bezoeker;
- hoe loopt de bestelling: stroef, de ene drempel na de ander; of gaat alles vlot en is alles ongelooflijk duidelijk;
Let op je taal, jongen!
Kortom, stap één is je eigen stijl ontwikkelen. En dat is niet enkel visueel. Ook je taalgebruik is van belang. Het grootste gevaar is dat je webshop als een machine gaat klinken. Een aanvang als ‘Gelieve een… ‘ of een beschrijving als ‘Kurkentrekker die er uit ziet als een stier’ geeft niets van je persoonlijkheid of stijl weer.
Dus het start al met de productomschrijving. Webshop Lisa Mille schrijft bij elk product een haast persoonlijke beschrijving. Zelfs een eikokertje krijgt een mooi zelf geschreven en persoonlijke beschrijving. Zomaar de tekst van de leverancier overnemen is echt uit den boze.
Lisa Mille webshop: zelfs een eikokertje krijgt een persoonlijke beschrijving
Bij De Kleine Zebra trekken ze dit door in de manier waarop ze hun categorieën noemen, net als Monsters with an Attitude. Hier geen ‘Badkamer’ maar ‘splish splash‘ of geen ‘Speelgoed’ maar ‘Ravot’ en ‘Kot op stelten’
De naam van een categorie bij Monsters with an Attitude is allesbehalve gewoontjes.
Bedanken en bevestigen, maar niet als een machine
En dan? Wat na de bestelling? Dan denken veel webshops dat het is afgelopen. Dan begint het pas! Weet de klant wanneer het pakje komt? Kan de klant het pakje volgen? Stuur je een degelijk bevestigingsmail uit? Wat staat daar in? Spreek je de klant persoonlijk aan of klinkt alles zeer technisch? Het geld is binnen en het lijkt er op dat alles beklonken is: de bestelling is namelijk geplaatst. Ook vlak na die stap moet je in contact blijven, de ervaring moet blijvend zijn. Je mag niet verzanden in formeel en technisch de bestelling af te handelen. Zo hebben we voor de website van Fuchsia-kwekerij Katrien Michiels een bevestigingsmail ontworpen waar een collage staat van de foto’s van de bloemen die je besteld hebt. Zo krijg je na je bestelling een mooi visueel overzicht van wat je kocht. Voor haar klanten — die echt gepassioneerde fuchsia-fans zijn — is het belangrijk dat ze na hun bestelling een visuele bevestiging hebben, waarmee ze bijvoorbeeld aan vrienden of familie in één oogopslag hun mooie bestelling kunnen tonen.
Verpakking, verpakking, verpakking
Is het dan afgelopen, eenmaal je mooi en persoonlijk bevestigd hebt? Neen, nog steeds niet. Want wat is allesbepalend bij het online kopen: het ontvangen van het product zelf. Is de doos een saaie bruine kartonnen ding vol gaten en blutsen, die ook nog eens lelijk is dicht gekleefd? Of is het een doos met een eigen grafiek? De Kleine Zebra levert aan in mooi bedrukte dozen. Zelf de sticker met het adres is ontworpen. De aankoop van een product bij hen blijft dus doorlopen tot het openen van het pakje. Het is zelfs zo dat we die dozen meermaals bij mensen thuis zien staan. Ze gooien die niet weg of gebruiken die niet om oude kranten in te verzamelen. Sommige klanten gebruiken die als volwaardige opbergdozen die mogen gezien worden.
De mooie verpakkingen van De Kleine Zebra
Verrassing!
Zit er een verrassing in de doos? Een klein extraatje die de klant blij maakt? Vraag je achteraf om feedback, op een zeer persoonlijke manier? Monsters with an Attitude legt in al haar pakjes die ze opsturen een cadeautje: een klein stoffen popje. Een kleine attentie die bij vele klanten een leuke extra is en mensen een positief beeld geeft van de webshop en het online bestellen.
Monsters with an Attitude stopt een extra popje in elke verpakking
Maar hou het sober
Belangrijk is wel dat die ervaring niks in de weg staat. Een achtergrondmuziekje lijkt iets te zijn dat de sfeer van een webwinkel versterkt, maar werkt voor de overgrote meerderheid van de mensen eerder irritatie op. Een splash-pagina, een soort homepage voor de homepage, waar je in één beeld je sfeer wil oproepen: nutteloos en een drempel vol goede bedoelingen maar met een tegengesteld effect.
Tip 2: Persoonlijkheid: ge zijt wie ge zijt
We hebben het hiernet al vaak gezegd, en ik heb zelfs al 7 maal het woord ‘persoonlijk’ of een variant gebruikt: hoe technische een website ook lijkt (een stuk code, bekeken op een scherm, aan een computer), je webwinkel moet persoonlijkheid uitstralen in elke stap.
Je zal merken dat elk van de webshops die we gebouwd hebben dat doet. Of de meeste toch.
Geef je webshop een gezicht
De Kleine Zebra maakt elk jaar opnieuw een foto van de drie zussen die de winkel hebben opgestart, samen het hun kinderen. Wij vinden dit zo’n mooi voorbeeld. Deze dames zeggen en tonen dat ze echt zijn, dat ze net dezelfde personen zijn als hun klanten: mama’s op zoek naar mooie spullen voor hun kinderen. Ze maken ook werk van een jaarlijks aangepaste beschrijving van hun verhaal.
De jaarlijkse aangepaste 'Wie zijn we' pagina van De Kleine Zebra.
Lisa Mille spreekt de bezoeker ook zeer persoonlijk aan. Om te beginnen in de manier waarop ze de producten op een eigen manier beschrijft (zie hierboven), maar ook door een kleine foto met haar kinderen op elke pagina van de website te zetten. Op haar Facebook pagina geeft ze ook een eerlijke inkijk op haar werk als mama die een webshop runt.
Persoonlijkheid is je klanten ook inkijk geven op wat er zich achter de schermen afspeelt.
Ook voor de kwekerij Fuchsia Michiels maakten we een punt van dat principe: Katrien Michiels, die de kwekerij van haar vader overnam, is in haar sector een naam en een gezicht. Het is daarom essentieel dat ze onmiddellijk op de homepagina staat. Iedereen in die sector kent haar. En op die manier geeft ze ook aan hoe authentiek de website is.
Katrien Michiels spreekt haar klanten rechtstreeks aan. Iedereen in haar sector kent haar. Persoonlijkheid ten top!
Vriendelijk ‘dank u’ zeggen
Maar persoonlijkheid kan ook schuilen in een klein hoekje. Zo leerden we van Plan België het belang van eenvoudigweg ‘bedankt’ te zeggen. Na een bestelling je klant bedanken, daar heel eerlijk en persoonlijk in zijn, geeft je webshop heel wat authenticiteit. Of je kan een eigen persoonlijkheid weergeven door een bepaalde filosofie te hanteren, zoals de bio, eco & fair-trade webshop Villa Kakelbont dat doet.
Villa Kakelbont, een webwinkel met een 'Onze filosofie' pagina.
Giveaways
Wat te onthouden?
- Get the basics right: product, prijs, promoten, customer service; die moeten allemaal top-notch zijn;
- Zorg voor een echte ervaring: van copywriting (de lange teksten & de short-copy), tot stijl, tot verpakking; verras je klanten; maak hen blij; wees speciaal;
- Zeg ‘Dank u’, wees vriendelijk en persoonlijk; maak van je webshop iets met een gezicht en kleef er zelfs letterlijk je eigen gezicht op; zorg voor een kijk achter de schermen. Wees dus levensecht;
- En overdrijf niet, hou het subtiel;
Volgende keer…
In deel 2 zullen we het hebben over meer praktische zaken zoals ‘Duidelijkheid’ en ‘Bereikbaarheid’. Want naast een gevoel en sfeer moet je webshop vooral ook vertrouwen uitstralen.
Eind januari lanceerden we de nieuwe webshop voor de babyspeciaalzaak Monsters With An Attitude. Deze webshop is, net zoals alle andere webshops & projecten die we afleveren, “tailor made” naar de noden en wensen van de klant.
Zowel de look&feel als de functionaliteit werden vastgelegd na enkele rondes feedback en aanpassingen samen met de klant. Een goed inlevingsvermogen in de business en werkwijze van de klant laat toe om het aantal iteraties tot een minimum te houden terwijl we naar een maximum aan klantentevredenheid streven.
Wie de vorige posts op deze blog gelezen heeft weet dat we bepaalde ontwikkelings- en functionaliteitsprincipes hanteren. We kunnen ze gerust “web industry best practices” noemen. Wat nu volgt is een mix van een case study en whitepaper voor een webshop.
Analyse: analyse this
Eerst en vooral hebben we de analysefase. De eerste sessies met de klant zijn eerder brainstormsessies. Alle mogelijke functionaliteiten, inclusief de toeters en bellen, die relevant kunnen zijn voor dit type project worden uitvoerig besproken. Op het einde van de analysefase leggen we samen met de klant vast wat er zal worden uitgewerkt, hoeveel dat zal kosten en hoe lang dat zal duren. Vaak wordt er op dit ogenblik beslist om bepaalde opties al dan niet meteen te nemen of te verschuiven naar een volgende fase. Dankzij deze gefaseerde aanpak kan een project geleidelijk groeien.
Heel belangrijk is dat, naast de functionaliteit, ook de business processes van de klant mee onder de loupe worden genomen. In overleg worden scenario’s opgesteld voor de verschillende types van gebruikers (doelpubliek) die de website gaan gebruiken. Een gebruikerscenario identificeert handelingen met stappen en acties die moeten gebeuren om bepaalde doelen te kunnen bereiken.
Tijdens de analysefase staan deze gebruikerscenario’s centraal. Enerzijds bepalen ze de functionaliteit en logica. Anderzijds kunnen ze worden gebruikt ter controle of alle afgesproken functionaliteiten zijn verwerkt, maar ook of de website gebruiksvriendelijk en logisch is opgebouwd.
Uit de hele analyse vloeit uiteindelijke een prototype. Vincent had enkele posts terug over dit punt al een interessante uiteenzetting online geplaatst.
Design: het uithangbord
Tijdens de analysefase kan ook al aandacht worden besteed aan de look&feel van de webshop. Onderschat het belang hiervan niet. Een shop moet niet alleen functioneel goed werken, het moet er ook professioneel uitzien en vertrouwen wekken. Bovendien wordt de webshop het uithangbord voor de winkel. Een reden te meer om een knap en origineel design af te leveren. De klant weet op dit vlak meestal wel heel duidelijk waar hij naartoe wil. Onze designer Gert wist, zoals altijd, enkele verbluffende, toepasselijke designs uit zijn mouw te schudden.
Ontwikkeling: goede afspraken
Na deze eerste fases, die meestal wel parallel verlopen, start de technische ontwikkeling van de webshop. Tijdens de interne, technische kick-off meeting worden heel wat zaken besproken. We spreken goed af hoe de zaken technisch geïmplementeerd zullen worden. Doorgaans volgen nu 3 grote brokken in de ontwikkeling:
- Back-end development: dit houdt in dat de functionaliteit en bedrijfsprocessen die eigen zijn aan de webshop in code worden vertaald. Daarbij moet er ook communicatie naar een databank of externe systemen zijn.
- Front-end development: de design templates worden opgeknipt en vertaald naar XHTML, CSS en Javascript. Onderschat het belang van deze taak niet want hier leggen we de basis voor de Search Engine Optimalization (SEO).
- De laatste brok is de integratie van de back-end-ontwikkeling met de front-end-ontwikkeling.
Fasering, iteratie en klantfeedback
De ontwikkeling wordt opgedeeld in fases op basis van functionaliteit. Iedere fase wordt ontwikkeld en getest voor men naar de volgende fase overstapt. Veelal steunt een latere fase op eerder ontwikkelde fases dus is het van extreem belang dat men iedere fase goed test. Unit testing is hierbij een grote hulp.
Een belangrijk voordeel van fasering is dat men op het einde van iedere fase feedback kan vragen van de klant. Zo vermijdt je eventuele “verrassingen” op het einde van de complete ontwikkelingscyclus. Betrek je klant zo snel mogelijk bij de ontwikkeling. Iedere fase waarbij men binnen een korte periode een bepaalde functionaliteit ontwikkelt, test en ter goedkeuring voorlegt aan de klant noemt men een sprint.
Best practices
Er zijn een aantal best-practices die we in de kijker willen zetten:
- CSS sprites: we voegen een aantal afbeeldingen samen tot één afbeelding. (voorbeeld)
- Custom fonts door gebruik te maken van Adobe Flash.
- Search Engine Optimized (SEO) url’s & content.
- Gebruik van Ajaxvoor het winkelmandje met als doel een betere user experience.
- Meertaligheid. Je kunt argumenteren dat dit een functionaliteit is en geen “best practice”. Je kunt je echter geen Europese webshop inbeelden zonder. Meertaligheid is een “must”. Momenteel is de webshop van Monsters With An Attitude beschikbaar in één taal. De shop is zo ontwikkeld dat het toevoegen van extra talen slechts een administratieve kwestie is. Het leuke aan de meertaligheidsfunctie is dat wanneer men van taal verandert men op dezelfde pagina in de andere taal terecht komt. De meeste sites gaan bij het switchen van taal naar de hoofdpagina waardoor men de gebruiker verplicht om opnieuw een product of pagina te zoeken. Bij good practices hoeft dit niet. “It’s what separates the men from the boys”
Beheermodule: geen dubbel werk
Als laatste willen we je ook even laten meekijken achter de schermen want de publieke webshop is slecht de helft van de webapplicatie.
Deze beheersmodule laat toe de gegevens van klanten, producten, bestellingen en stock te beheren. Daarnaast is er ook nog volledige synchronisatie voorzien tussen de database voor de webapplicatie en de Filemaker-software in de winkel zodat de klant geen dubbel beheer moet doen voor de fysische winkel en de webshop.
De beheersmodule laat o.a. de volgende zaken toe:
- Beheer klanten, producten, bestellingen en stockindicatie;
- Printen BTW-listings, verkooplijsten;
- Printen van facturen, inhoudsdocumenten, plakbonnen & transportdocumenten;
- Printbare facturen en creditnota’s zijn PDF-documenten die dynamisch worden gegenereerd.
- Verzenden van betalingsherinneringen.
Oh ja, de ontwikkeling gebeurde in ASP.NET. Maar dit is slechts een triviaal gegeven.
Verdere informatie over dit project kan je terugvinden op de projectpagina
In een vorige blogpost rond e-commerce zagen we onder andere dat de creatie van een webshop als uitbreiding van een fysieke winkel extra uitdagingen met zich meebrengt. Vooral de synchronisatie van de stock tussen fysieke winkel en webshop was hierbij cruciaal. In deze post willen we het hebben over online betalen en het beheer van bestellingen.
Het onveiligheidsgevoel voorbij
Hoewel online shoppen ook in België sterk in de lift zit, zijn heel wat surfers nog steeds wantrouwig om hun betaalkaart te gebruiken op het internet. Noem het een ‘onveiligheidsgevoel’, een angst voor misbruik van de kredietkaartgegevens. Online payment providers zoals Ogone garanderen de shopper een veilige transactie. De stap in de check-outprocedure waar men de kredietkaartgegevens moet ingeven, gebeurt op een beveiligde pagina van de payment provider. Bovendien is ook de beheerder van de shop zeker van de betaling. De integratie van een betaaldienst biedt dus garanties aan zowel de koper als de verkoper. Diensten als Ogone werken met maandelijkse abonnementen en een bedrag per transactie, afhankelijk van het gekozen abonnement.
Naast een abonnement bij een online payment provider moet je ook, afhankelijk van de gewenste ondersteuning, contracten afsluiten met de desbetreffende bankinstellingen of kaartsystemen zoals VISA en Mastercard.
Overschrijving
Ondanks de garanties die een online payment provider biedt, blijft betalen met een kredietkaart voor heel wat mensen nog steeds een drempel. Voor deze groep gebruikers is er toch een oplossing. Naast een online betaling met bankkaart kan een webshop immers ook aanbieden om te betalen met een overschrijving. Dit betekent dat de eigenlijke betaling van de bestelling achteraf gebeurt. De shophouder moet dus zijn uittreksels in de gaten houden om na te gaan of een klant zijn bestelling heeft betaald. De bestelde artikelen worden ondertussen wel gereserveerd voor de klant en de stock wordt navenant aangepast.
Kortingscodes/cadeaubonnen
Heel wat shops werken met kortingscodes en cadeaubonnen. Cadeaubonnen gaan altijd uit van een vast bedrag, terwijl kortingscodes zowel een vast bedrag als een percentage kunnen zijn. Beiden moeten een unieke ID hebben voor een goede werking van het systeem. Wanneer een shopper een cadeaubon gebruikt, moet het systeem achter de schermen bijhouden hoeveel deze bon waard is en hoeveel van dat bedrag overblijft na het gebruik. Bij een kortingscode wordt de korting pas zichtbaar en actief na het invoeren van de code.
In een volgende blogpost gaan we dieper in op het online beheer van bestellingen.
Enkele van onze realisaties:
- De Kleine Zebra
- Codima
- Tele Atlas
- Monsters With An Attitude
Kort na de lancering van de webshop ‘de Kleine Zebra’, in april 2007, kregen we regelmatig een vraag binnen om een gelijkaardige shop te maken. Aangezien ‘Ik wil een shop,” een nogal vage omschrijving is, toetsen we eerst een aantal zaken af.
Fysiek en online, één shop
Om te beginnen vragen we eerst of de prospect al een winkel heeft. Een positief antwoord betekent dat men al ervaring heeft met het inkopen van producten, aanleggen en bijhouden van een stock, boekhouding enz. Dat is een enorm voordeel want voor het opstarten van een webshop zijn deze zaken vanzelfsprekend ook noodzakelijk. Het betekent ook dat wij als webbouwers onze ontwikkeling moeten afstemmen op en integreren in de bestaande businessprocessen en -software. Vooral de synchronisatie van de stock is uitermate belangrijk. De webshop kan anders nooit zekerheid bieden rond de beschikbaarheid van een product. Zo kan iemand in de winkel een product kopen dat net online ook werd besteld. De synchronisatie met bestaande software en de integratie van de webshop in de gebruikelijke werkwijze van de uitbater vereisen een ontwikkeling op maat.
We stellen ook de vraag of de prospect de bestellingen online beheren wil via de webinterface. Het lijkt een retorische vraag, maar dat is het niet. In een sterk vereenvoudigde vorm zou je ook iedere bestelling per mail kunnen laten binnenkomen en de afhandeling offline laten gebeuren. Doorgaans kiest men voor de integratie van een online betaaldienst waardoor men de bestellingen online moet beheren. In een volgende blogpost gaan we hier dieper op in.
Magic box
Vaak leeft het idee dat een webfirma wel ergens een doos met een kant-en-klare webshop op het schap heeft. Uitpakken, installeren, ander kleurtje tegenaan gooien en klaar. Het klopt dat er standaardpakketten bestaan die toelaten om snel ‘een’ webshop online te hebben. Het prijskaartje valt meestal goed mee. De poppen gaan echter aan het dansen wanneer men het pakket wil aanpassen of uitbreiden om beter tegemoet te komen aan de eigen noden en werkwijze. Dan botst men op de onverzettelijke beperkingen van het standaardpakket. Men kan vervolgens kiezen tussen een dure modificatie of helemaal opnieuw beginnen.
Bij Marlon geloven we in de aanpak op maat. Het laat toe om een shop te ontwikkelen die volledig aansluit bij het product, de werkwijze en de andere activiteiten van de klant. We houden er ook aan om een toepassing te ontwikkelen die op ieder moment kan worden uitgebreid of aangepast. Het project kan bovendien groeien door een gefaseerde ontwikkeling.
In een volgende blogpost rond e-commerce gaan we dieper in op online betalen van bestellingen.
Enkele van onze realisaties:
