15 voorbeelden van bedankpagina's met code en vervolgstappen | We.Inc
Vijftien originele ontwerpen voor bedankpagina's na bestellingen, aanmeldingen, boekingen, downloads en donaties, elk met bewerkbare HTML en CSS en één duidelijke volgende stap.
Voorbeelden van bedankpagina's
Een goede bedankpagina bevestigt wat er net is gebeurd, vertelt wat er hierna komt en wanneer, en biedt precies één nuttige volgende stap. Hieronder staan vijftien originele ontwerpen voor bestellingen, aanmeldingen, boekingen, downloads, donaties en meer, elk geschreven in gewone HTML en CSS die u hier kunt bewerken en naar uw eigen site kunt kopiëren.
Stem de volgende stap af op wat de bezoeker net heeft gedaan
De bezoeker heeft net...
Bevestig
Beste enkele volgende stap
Iets gekocht
Ordernummer, artikelen, verwachte levering
Bestelling volgen of een account aanmaken
Zich aangemeld voor een nieuwsbrief
Welk adres, hoe vaak u verstuurt
Inbox controleren om te bevestigen, of een eerste artikel lezen
Een tijd geboekt
Datum, tijd, locatie of videolink
Toevoegen aan agenda
Een bestand gedownload
Bestandsnaam, een reservelink voor de download
Verwante gids of tool
Een contactformulier verstuurd
Reactietijd, een kopie van het bericht
Antwoorden op veelgestelde vragen bekijken
Gedoneerd
Bedrag, ontvangstbewijs per e-mail
Delen of een maandelijkse gift instellen
De meeste bezoekers komen op een bedankpagina op het moment dat ze u het meest vertrouwen, en vertrekken dan omdat de pagina niets zegt. Deze voorbeelden zijn gemaakt voor dat moment. Elk is een compleet, bewerkbaar fragment voor een fictief bedrijf, op maat om in een pagina te plaatsen, en elk laat een andere manier zien om de bezoeker naar de stap te leiden die er daarna toe doet.
Blader door de voorbeelden per situatie: aankopen, aanmeldingen, boekingen, downloads en berichten, en daarna donaties en evenementen.
Bewerk de code naast een voorbeeld en het resultaatvenster wordt bijgewerkt terwijl u typt. Scripts staan uit in het venster.
Kopieer het fragment, vervang de tekst en kleuren door uw eigen, en plaats het op de pagina waar uw formulier of checkout mensen naartoe stuurt.
Loop de checklist boven de voorbeelden door voordat u publiceert, zodat de pagina antwoord geeft op wat bezoekers zich afvragen.
Herhaal het belangrijkste detail: het e-mailadres, de geboekte tijd of het ordernummer. Dat stelt mensen gerust en vangt typefouten vroeg op.
Zeg wanneer het volgende gebeurt. Een bevestigingsmail die na vijf minuten aankomt, voelt kapot als niemand zei dat u die kon verwachten.
Bied één hoofdactie aan. Een muur van sociale knoppen, upsells en links verdeelt de aandacht en levert meestal minder klikken op elk ervan op.
Houd de siteheader zodat mensen verder kunnen kijken, maar laat pop-ups en nieuwsbriefvakken weg voor iemand die zich net heeft aangemeld.
Voeg een noindex robots-metatag toe aan bedankpagina's zodat ze niet in zoekresultaten verschijnen voor mensen die nooit zijn geconverteerd.
Veelgestelde vragen
Wat moet er op een bedankpagina staan?
Drie dingen: een bevestiging van precies wat er is gebeurd, wat de bezoeker hierna kan verwachten en wanneer, en één duidelijke actie om nu te ondernemen. Al het andere is optioneel.
Moet een bedankpagina door zoekmachines worden geïndexeerd?
Meestal niet. Voeg <meta name="robots" content="noindex"> toe aan de head. Google merkt op dat als robots.txt de pagina blokkeert, de crawler de noindex-regel nooit ziet, dus blokkeer dezelfde pagina niet ook nog in robots.txt.
Is een bedankpagina beter dan een succesmelding op dezelfde pagina?
Een aparte pagina heeft een eigen adres, wat het meten van conversies eenvoudig maakt en ruimte geeft voor een volgende stap. Een melding op de pagina zelf houdt mensen op hun plek, wat past bij kleine formulieren zoals een reactieveld. Beide moeten in woorden bevestigen wat er is gebeurd.
Wat maakt een goede orderbevestigingspagina?
Het ordernummer in grote letters, een korte samenvatting van de artikelen en het totaal, de verwachte levering of afhaaltijd, het e-mailadres waar het ontvangstbewijs naartoe ging, en één link om de bestelling te volgen of te beheren.
Kan ik upsellen op een bedankpagina?
Ja, als het aanbod duidelijk aansluit bij wat ze net hebben gedaan en de bevestigingsgegevens niet naar beneden duwt. Een passend accessoire of een beloning voor doorverwijzen is veel welkomer dan een algemene uitverkoopbanner.
Waarom de pagina na het formulier ertoe doet
Een verzonden formulier of afgeronde checkout is het enige moment waarop u precies weet wat iemand wilde. De pagina die volgt kan twijfels wegnemen, supportmails voorkomen en de volgende stap in de relatie zetten, of een doodlopend punt zijn dat alleen bedankt zegt.
Schrijf de pagina als het antwoord op de volgende vraag van de bezoeker. Na betalen is dat wanneer het pakket aankomt. Na boeken is het waar u naartoe moet en hoe u kunt verzetten. Na een download is het of het bestand echt is opgeslagen.
Toegankelijke bevestiging
Geef de pagina een duidelijke kop zoals Bestelling bevestigd in plaats van alleen een icoon, en vertrouw niet uitsluitend op kleur om succes aan te geven. Als u de bevestiging op de pagina zelf toont in plaats van op een nieuwe pagina, plaats die dan in een element met role="status" zodat schermlezers haar beleefd voorlezen zonder de focus te verplaatsen.
Na een aankoop
1. Bestelling bevestigd met een groot ordernummer
Het nummer is het eerste waar support om vraagt, dus het krijgt na de kop de grootste letters.
2. Verzendtijdlijn
Drie stappen laten zien waar de bestelling is en noemen de levertijd voordat iemand ernaar hoeft te vragen.
3. Van gastcheckout naar account
Een gastkoper heeft al een e-mailadres getypt, dus de pagina biedt een wachtwoordveld aan om de bestelgeschiedenis te bewaren.
4. Verwante aanvulling, onder de bevestiging
Het aanbod staat onder de bevestigingsgegevens en sluit aan bij wat is gekocht, zodat het leest als hulp in plaats van als harde verkoop.
Na een aanmelding
5. Controleer uw inbox
Lijsten met dubbele opt-in hebben deze stap nodig. Door de afzender en onderwerpregel te noemen vinden mensen de e-mail snel.
6. Welkom met een eerste artikel
Zodra iemand is ingeschreven, wijst u hem naar het beste dat u al hebt gepubliceerd in plaats van hem op de volgende editie te laten wachten.
7. Gratis proefperiode gestart
Een korte installatielijst van drie stappen maakt van een leeg account vooruitgang, met de eerste stap gemarkeerd als startpunt.
Na een boeking of een bericht
8. Afspraak met toevoegen aan agenda
Datum, tijd en locatie in een compact blok, met links voor de agenda en om te verzetten er direct naast.
9. Kennismakingsgesprek geboekt met voorbereidingsvragen
Een korte voorbereidingslijst maakt het gesprek nuttiger en schept stilletjes verwachtingen aan beide kanten.
10. Bericht ontvangen met reactietijd
Het bericht terug laten zien bewijst dat het is aangekomen, en een echte reactietermijn voorkomt dat mensen het twee keer sturen.
11. Offerteaanvraag met een referentie
Een referentienummer en een persoon met naam geven een offerteaanvraag het gevoel dat ze wordt behandeld in plaats van zoek te raken in een wachtrij.
Na een download, donatie of aanmelding voor een evenement
12. Download met een reservelink
Browsers blokkeren soms automatische downloads, dus een zichtbare link en de bestandsgrootte vangen het geval op waarin er niets verscheen.
13. Donatie met impact en ontvangstbewijs
Zeggen wat de gift doet en het ontvangstbewijs bevestigen werkt beter dan een algemeen bedankje. De maandelijkse optie wordt één keer aangeboden, voorzichtig.
14. Inschrijving voor een evenement met een ticket
Een blok in de vorm van een ticket bevat de gegevens die mensen op de dag zelf zoeken: datum, deuren open en hun naam.
15. Wachtlijst met een duwtje om door te verwijzen
Een wachtlijst is de enige plek waar een deeloproep past, omdat vrienden uitnodigen de bezoeker iets oplevert wat hij wil.
De kop zegt in woorden wat er net is gebeurd
Het belangrijkste detail wordt herhaald (ordernummer, e-mail, tijd)
Er staat wat er hierna komt en ongeveer wanneer
Er is één primaire volgende stap, opgemaakt als de hoofdknop
Er is een manier om een fout te herstellen (verkeerd e-mailadres, verzetten, annuleren)
De sitenavigatie is nog beschikbaar om verder te kijken
Geen pop-up of aanmeldvak voor iemand die zich net heeft aangemeld
De pagina heeft een noindex robots-metatag
Checklist voor bedankpagina's
{n} van {total} gedaan
Alles gedaan. Uw bedankpagina beantwoordt wat bezoekers zich afvragen.