Chatbutton do’s & dont’s – Part 1
Geplaatst op 18 september 2011 om 09:14 door Joost Rijlaarsdam
Zodra je website meer is dan een digitaal uithangbord en je bezoekers op contactmogelijkheden wilt wijzen, krijg je te maken met actiebuttons. Knoppen, hyperlinks en clickable images kunnen je bezoekers verleiden. Maar dan moeten die wel gezien worden! Voor het relatief nieuwe direct response communicatiekanaal Live Chat geldt dit nog nadrukkelijker. De vormgeving en plaatsing van chatbuttons bepalen in grote mate het conversieresultaat. Omdat de verschillen in response enorm kunnen zijn, is voor Live Chat buttons speciale aandacht nodig. Web1on1 deelt graag de opgedane ervaring met je en we geven een aantal tips voor het succesvol integreren van Live Chat in je website.
Integratie in je website
Ben je in staat Live Chat op je website aan te bieden, dan heb je met twee elementen te maken. De chatbutton (1) waarmee je bezoekers uitnodigt om de chat met je operators te starten en direct daarna, het chatvenster (2). Op het chatvenster zullen we later ingaan, want eerst hebben we onze handen vol met het creëren van de meest effectieve chatbutton. De voorbeelden die hierna genoemd worden, zijn aan de praktijk ontleend.
Gebruik van icoontjes
Nu Live Chat steeds vaker aangeboden wordt, zie je een grote diversiteit in icoontjes (pictogrammen) die de contactmogelijkheid op compacte wijze visualiseren. Het liefst zouden we willen dat iedereen dezelfde icons gebruikt, bijvoorbeeld de twee overlappende tekstballonnetjes – kijk maar op onze website. Niet handig is het om een op chat duidend icoon te gebruiken voor een andere contactmogelijkheid. Daar worden wij en de website bezoekers niet wijzer van. Voorbeeld: onderstaande button brengt bezoekers naar een blanco contactformulier. Tja, dat willen we niet en dus klikken we weer wég.
Fout: button klikt door naar leeg contactformulier
Vormgeving van de chatbutton
Zolang Live Chat op websites nog geen gemeengoed is, zal de chatbutton extra moeten opvallen. Kies daarom voor een op zichzelf staand element. Dus niet een subtiel stukje vormgeving, keurig geïntegreerd met de vormgeving van de site, zoals hieronder wordt getoond. Een losstaand element wordt sneller gezien en geeft je programmeur tal van mogelijkheden. De button mag zichzelf bekend maken door de bewegen, te knipperen, het scherm binnen te schuiven of bij mouse-over in je ogen te springen. Wees creatief!
Fout: te mooi geïntegreerd in de vormgeving. Waar moet je klikken?
Logica in beeld en kleur
Een chatbutton wil duidelijk zijn; zoek daarom aansluiting bij intuïtief gebruik van beeld en kleur. Een mevrouw met headset zit te bellen en dus niet te chatten. Een rood lampje kan “aan” betekenen, maar is wel de kleur van het stoplicht. Groen is duidelijker. Als iets knippert, beweegt of wappert, trekt het je aandacht.
Jammer: onduidelijk, plaatje en kleur onhandig.
Leg uit wat de chatbutton doet!
Bezoekers willen snel de juiste informatie vinden, gelijk producten kunnen bestellen en liefst direct een antwoord krijgen. Wees daarom duidelijk, zodra je bezoekers uitnodigt je chatbutton te gebruiken en leg uit wat deze doet.
Deze (knipperende) chatbutton is goed gekozen en duidelijk van uitleg. Het opvallende panel knippert, de tekst zegt wat er gaat gebeuren, de knop om te klikken is groen en ten overvloede staat ook de tijd van beschikbaarheid genoemd. Nu nog de vraag wáár je de chatbutton precies gaat plaatsen. Daarover een volgende keer.
