Landingspagina ontwerpen
Landingspagina ontwerpen betekent één pagina één taak geven: een kop die de belofte van de advertentie herhaalt, bewijs naast één knop en een kort formulier dat op een telefoon snel laadt. Hieronder vind je de onderdelen, acht regels, drie voorbeelden en een gratis manier om er een te bouwen.
Gids gecontroleerd op 13 oktober 2026 · Mobirise-team
De opbouw van een landingspagina
Een landingspagina is de plek waar iemand terechtkomt via één bepaalde advertentie, e-mail, social post of QR-code, en ze bestaat om één actie van die bezoeker te krijgen. Zes vaste onderdelen dragen haar, meestal in deze volgorde.
Een kop die de belofte herhaalt
Gebruik de woorden van de advertentie of het bericht waarmee de bezoeker binnenkwam. Biedt de advertentie een gratis offerte voor dakreparatie, dan staat precies dat in de kop, niet je bedrijfsslogan.
Eén regel over voor wie het is
Een subkop van een of twee zinnen: voor wie het aanbod bedoeld is, wat diegene krijgt en hoe snel. Zelfstandige naamwoorden en cijfers zeggen meer dan bijvoeglijke naamwoorden; “een vaste prijs voor morgen” vertelt de lezer meer dan “snelle, vriendelijke service”.
Een afbeelding van het echte werk
Het product, de ruimte, het team of het resultaat. Geposeerde stockfoto’s maken de pagina alleen zwaarder, niet informatiever. Kijk hoe de afbeelding wordt bijgesneden op een smal scherm.
Eén call-to-action
Eén knop met een werkwoord en een resultaat, in de enige opvallende kleur op de pagina. Herhaal de knop verderop voor wie tot het einde leest, maar voeg nooit een tweede, concurrerend doel toe.
Bewijs naast de beslissing
Reviews met namen, beoordelingen met het aantal stemmen, klantlogo’s die je mag gebruiken, certificaten. Zet ze naast de knop, waar twijfel opkomt, in plaats van op één hoop onderaan.
Eerst antwoorden, dan het formulier
Hoe het werkt, wat het kost en wat er na de klik gebeurt. Daarna het formulier: alleen de velden die de volgende stap nodig heeft, en één zin die zegt wat de bezoeker krijgt en wanneer.
Landingspagina ontwerpen: regels die standhouden
Elke regel kun je in een minuut of twee op de afgewerkte pagina controleren. Waar een regel een getal bevat, komt dat uit een genoemde openbare standaard.
Haal de uitgangen weg
Laat het hoofdmenu, links naar je blog en social-iconen weg. Elke extra link is een uitweg voordat de actie plaatsvindt. Een logo, een contactregel en juridische links in de footer zijn genoeg.
Sluit aan op de bron
Houd de bewoordingen, het aanbod en de visuele stijl van de advertentie aan. Google Ads rekent de landingspagina-ervaring, dus hoe relevant en nuttig de pagina is voor mensen die hebben geklikt, tot een van de drie onderdelen van de Kwaliteitsscore.
Laat het essentiële op één scherm passen
Op een telefoon moeten de kop, de subkop en de knop zichtbaar zijn zonder te scrollen. Duwt de afbeelding de knop omlaag, maak dan de afbeelding kleiner, niet de tekst.
Noem het resultaat op de knop
“Mijn offerte aanvragen”, “Een bezoek boeken”, “Stuur me de prijslijst”. Labels als “Verzenden” of “Meer informatie” beschrijven de klik in plaats van wat de bezoeker krijgt.
Vraag minder
Voor een eerste contact is een naam plus een e-mailadres of telefoonnummer meestal genoeg. Elk extra veld heeft een reden nodig die je kunt uitleggen; kwalificerende vragen kunnen wachten tot het gesprek.
Haal de snelheidsdrempels van Google
Core Web Vitals beoordelen een pagina als goed wanneer het grootste element binnen 2,5 seconden is weergegeven, invoer binnen 200 ms een reactie krijgt en de layoutverschuiving 0,1 of lager blijft, gemeten op het 75e percentiel van de bezoeken.
Voldoe aan de basis van toegankelijkheid
WCAG 2.2 vraagt op niveau AA een tekstcontrast van minstens 4,5:1 (3:1 voor grote tekst) en tikdoelen van minstens 24 bij 24 CSS-pixels. Geef elk formulierveld een zichtbaar label, niet alleen een placeholdertekst.
Test telkens één wijziging
Een A/B-test vergelijkt twee versies die op één punt verschillen en heeft per versie genoeg bezoeken en conversies nodig om toeval uit te sluiten. Bij een kleine campagne leer je vaak meer door een paar mensen de pagina te zien gebruiken.
Voorbeelden van landingspagina’s uit drie Mobirise-thema’s
De drie desktopschermafbeeldingen onder de titel van deze gids zijn de openingsschermen van demo’s van Mobirise-thema’s: een vrijwilligersorganisatie (HumanityM5), een merk voor voedingssupplementen (EvolveM5) en een medische kliniek (SpecialtyM5). Het zijn demo’s, geen campagnepagina’s. Hieronder staat wat elk eerste scherm goed doet en wat je moet aanpassen voordat je voor verkeer gaat betalen.
Vrijwilligersorganisatie
Alles staat gecentreerd: één grote kop, één zin over het doel en één donkere knop, boven een vervaagde foto van uitgestoken handen, zodat de woorden leesbaar blijven. Verander voor een wervingscampagne “About Organization” in “Meld je aan als vrijwilliger” en noem het volgende evenement.
Merk voor voedingssupplementen
Een close-up van groene bladeren over de volle breedte zet de sfeer neer voordat iemand een woord leest. De productnaam staat in heel groot wit lettertype, met een korte beschrijving linksonder en een knop “About supplement” rechtsonder. Zet voor een advertentie het voordeel in de kop in plaats van de categorie en voeg een beoordeling of certificaat toe bij de knop.
Medische kliniek
Een gesplitste hero: links een kop met schreef en drie regels over ervaren artsen, diagnostiek en patiëntgerichte zorg, rechts een foto van een lichte kliniekruimte. Een echte ruimte wekt meer vertrouwen dan een illustratie. Voor een boekingscampagne zou de hoofdknop “Afspraak maken” moeten zeggen, met het telefoonnummer ernaast.
Wat alle drie zouden veranderen
Elke demo heeft een volledig menu (Home, About, Events of Pricing), zoals een gewone website hoort. Voor een campagne zou je het verwijderen, één actie overhouden en verderop bewijs en een kort formulier toevoegen. Omdat elke pagina een stapel blokken is, is dat een aanpassing en geen herontwerp.
Een landingspagina ontwerpen en bouwen in Mobirise
Eén editor bouwt landingspagina’s en complete websites, in een browser of in de gedownloade app. Met vier stappen breng je een pagina naar een live adres.
Maak een eerste versie
Vertel de AI in een of twee regels, in je eigen taal, wat je aanbiedt en voor wie, of geef een getekende schets of een screenshot. De AI-generator levert vier ontwerpen, elk met teksten en afbeeldingen, meestal binnen een minuut; met Regenerate krijg je meer varianten zonder dat het een poging kost. Of open een thema en voeg zelf blokken toe.
Beperk het tot één doel
Sleep blokken in de juiste volgorde, verwijder de blokken die de actie niet dienen en laat het menu weg. Gebruik Clone Block om de call-to-action verderop te herhalen en kies de H-tag van elke titel, zodat de pagina één H1 heeft. Tekst en afbeeldingen bewerk je ter plekke; de parameters van elk blok bepalen de tussenruimte, achtergrond, kolommen en zichtbare elementen.
Voeg het formulier en extra’s toe
Met Form Builder maak je het leadformulier, Popup Builder voegt een pop-up toe en Chat Button opent een gesprek in WhatsApp, Telegram, Messenger en andere apps. Alle drie zitten in KIT, BASE en GROW, de betaalde abonnementen.
Controleer op een telefoon en publiceer dan
Bekijk een voorbeeld op telefoon-, tablet- en desktopbreedte; afbeeldingen worden automatisch WebP. Publiceer op een adres van mobirisesite.com met HTTPS of op een eigen domein (abonnementen BASE en GROW). Met elk abonnement, ook FREE, kan de desktop-app de pagina ook via FTP of FTPES uploaden, op GitHub Pages publiceren of naar een lokale map schrijven.
Mobirise heeft geen ingebouwde A/B-tests. Wil je twee versies vergelijken, publiceer dan elke versie op een eigen adres, stuur de helft van je advertenties naar elk adres en vergelijk de resultaten in je advertentieaccount of analysetool. Bewerken werkt ook zonder verbinding in de offline desktop-app; publiceren en AI hebben internet nodig.
Welke bouwer voor landingspagina’s past bij de klus
Speciale platforms voor landingspagina’s zijn gebouwd rond testen en advertentieverkeer. Algemene websitebouwers kosten minder en laten één pagina uitgroeien tot een website. Onze keuzes, ook de gevallen waarin we zelf niet zouden kiezen:
- Veel varianten op betaald verkeer
- Unbounce of Instapage. Beide bieden A/B-tests in hun middelste abonnementen; Instapage test aan de serverkant en voegt personalisatie toe.
- A/B-tests met een kleiner budget
- Leadpages, waar testen begint bij het Grow-abonnement.
- Eén eenvoudige pagina voor weinig geld
- Carrd: een gratis abonnement en betaalde abonnementen met een jaarprijs.
- Een gratis pagina die je als bestanden bewaart
- Mobirise: de desktop-app kost niets, exporteert HTML en publiceert naar elke host.
- Een AI-ontwerp voordat je betaalt
- 8B AI: ontwerpen kost niets, en live gaan vereist het Pro-abonnement.
- Een pagina die een complete website wordt
- Mobirise, of een andere websitebouwer, omdat latere pagina’s in hetzelfde project staan.
- Waar Mobirise tekortschiet
- Geen ingebouwde A/B-tests; formulieren en pop-ups horen bij betaalde extensies; geen aparte telefoonlay-out; gratis sites tonen Mobirise-branding.
Zes bouwers voor landingspagina’s vergeleken
Mobirise verliest de rij met A/B-tests; de gespecialiseerde platforms verliezen op het bewaren van je bestanden en op offline werken. Let in de prijsrij op de factureringsbasis: per maand of per jaar.
| Mobirise | Unbounce | Leadpages | 8B AI | Carrd | Instapage | |
|---|---|---|---|---|---|---|
| Gemaakt voor | Landingspagina’s en complete websites van responsive blokken, met bestanden die je zelf houdt | Marketeers en bureaus die campagnepagina’s draaien | Kleine bedrijven die landingspagina’s, websites en blogs publiceren | Een compleet AI-websiteontwerp gratis uitproberen en later publiceren | Eenvoudige onepagers en profielpagina’s | Advertentiecampagnes op schaal, met personalisatie |
| A/B-tests | Nee, niet ingebouwd | Ja, onbeperkt, vanaf het Experiment-abonnement | Ja, vanaf het Grow-abonnement | Niet vermeld | Niet vermeld | Ja, aan de serverkant, vanaf het Optimize-abonnement |
| Formulieren | Extensie Form Builder, in KIT, BASE en GROW | Leadformulieren in elk abonnement; meerstapsformulieren vanaf Build | Formulieren en webhooks in elk abonnement | Contact- en leadformulieren, gratis en in Pro | Vanaf Pro Standard; geavanceerde formulieren bij Pro Plus | Formulierbouwer in elk abonnement; meerstapsformulieren vanaf Optimize |
| AI-hulp | Vier ontwerpen per generatie, met als uitgangspunt getypte tekst, een schets of een screenshot; 3 gratis generaties per maand | AI-copywriting vanaf Build; AI-verkeersoptimalisatie bij Optimize | AI-paginacreatie in elk abonnement | Genereert een volledig ontwerp uit één zin; AI-aanpassingen via chat in Pro | Niet vermeld | AI-tekst voor koppen, alinea’s en knoppen |
| Gratis abonnement | Ja: de desktop-app met 200+ blokken, onbeperkt aantal sites op elke server, plus 3 gratis online sites op een Mobirise-subdomein; gratis sites tonen branding | Nee; een proefperiode van 14 dagen zonder creditcard, zonder eigen domein tijdens de proefperiode | Nee; een proefperiode van 7 dagen, creditcard vereist | Alleen ontwerpen; niet publiceren | Ja, tot 3 sites met de branding “Made with Carrd” | Nee; een proefperiode van 14 dagen, creditcard vereist |
| Goedkoopste betaalde abonnement | $149 per jaar voor KIT: desktop-app, alle extensies, geen branding. $199 per jaar voor BASE, dat eigen domeinen op Mobirise-hosting toevoegt | Starter, $22 per maand bij jaarlijkse facturering ($29 bij maandelijkse): 5 pagina’s, verkeer tot 500 | Pro, $29 per maand; jaarlijkse facturering bespaart 20% | $9 per maand voor Pro, jaarlijks betaald, met hosting en een eigen domein | $9 per jaar voor Pro Lite (alleen een Carrd-adres); $19 per jaar voor Pro Standard, dat eigen domeinen en formulieren toevoegt | Create, $79 per maand bij jaarlijkse facturering ($99 bij maandelijkse): 15.000 unieke bezoekers per maand |
| Code exporteren | Ja: gewone HTML-, CSS- en JS-bestanden, gratis vanuit de desktop-app; exporteren vanuit de browserversie vereist BASE of GROW | Nee; pagina’s worden alleen gedownload als .unbounce-bestanden voor Unbounce | Classic Builder: een HTML-bestand dat de pagina vanuit Leadpages laadt; een statische kopie wordt niet ondersteund | Volledige HTML-export in Pro | Pro Plus ($49 per jaar): HTML, CSS en JS in een zip; formulieren werken dan niet meer | Niet vermeld |
| Werkt offline | Ja, in de desktop-app (Windows, macOS, Linux) | Nee, alleen in de browser | Nee, alleen in de browser | Nee, alleen in de browser | Nee, alleen in de browser | Nee, alleen in de browser |
Bekeken op 13 oktober 2026 op de prijspagina’s en in de supportartikelen van elke aanbieder. Prijzen in Amerikaanse dollars; “bij jaarlijkse facturering” is het maandelijkse equivalent van één jaarbetaling, terwijl Mobirise en Carrd een jaarprijs noemen. De dollarbedragen van Leadpages komen uit de FAQ op de prijspagina. Oudere reviews noemen vaak eerdere abonnementen en prijzen veranderen, dus controleer het op elke site voordat je koopt.
Checklist vóór de lancering van een landingspagina
Loop deze lijst door op een telefoon, via mobiele data in plaats van wifi op kantoor, voordat de eerste betaalde klik binnenkomt, en verstuur zelf een testinzending via het formulier.
Los elk punt op dat niet klopt voordat je aan verkeer uitgeeft: betaalde klikken op een kapot formulier zijn hier de duurste fout. Voor een onepager-website in plaats van een campagnepagina sla je het eerste punt en het ene doel over.
- Aansluiting op de bron. De kop gebruikt de woorden van de advertentie, e-mail of post.
- Eerste scherm. Kop, subkop en knop zijn op een telefoon zichtbaar zonder te scrollen.
- Eén doel. Het menu en niet-gerelateerde links zijn weg; elke herhaalde knop leidt naar dezelfde actie.
- Knoptekst. Die noemt wat de bezoeker krijgt.
- Bewijs. Het staat bij de knop en elk citaat heeft een naam.
- Formulier. Alleen de velden die de volgende stap nodig heeft, elk met een zichtbaar label.
- Testinzending. Die komt in de juiste inbox aan en het bedankbericht zegt wat er daarna gebeurt.
- Contrast en tikgrootte. De tekst haalt 4,5:1 en knoppen zijn makkelijk met een duim te raken.
- Snelheid. De pagina slaagt voor Core Web Vitals in PageSpeed Insights.
- Basis voor zoekmachines. De paginatitel en beschrijving omschrijven het aanbod en er is één H1.
- Footer. De links naar het privacybeleid en het contact werken.
- Tracking. Een conversie wordt geteld in je analysetool of advertentieaccount.
Veelgestelde vragen over landingspagina’s
Wat houdt landingspagina ontwerpen in?
Landingspagina ontwerpen betekent één pagina plannen rond één actie voor bezoekers uit een bepaalde bron: een advertentie, een e-mail, een post of een QR-code. Het omvat de kop, de lay-out, het bewijs, het formulier en de snelheid, en het resultaat wordt beoordeeld aan de hand van één getal: het aandeel bezoekers dat actie onderneemt.
Wat maakt een landingspagina goed?
Een belofte die aansluit op waar de bezoeker vandaan komt, één actie, bewijs naast die actie en een kort formulier. De pagina moet ook snel laden en prettig lezen op een telefoon, want campagneverkeer komt daar vaak binnen.
Hoe ontwerp ik stap voor stap een landingspagina?
Schrijf de ene actie op die je wilt en waar het verkeer vandaan komt. Maak de kop op basis van de eigen woorden van de bron, verzamel het bewijs dat je kunt tonen en schets de volgorde van de zes onderdelen. Bouw de pagina daarna met blokken of een AI-concept en test haar vóór de lancering op een telefoon.
Is een onepager-website hetzelfde als een landingspagina?
Niet helemaal. Een onepager-website zet een hele kleine site op één scrollende pagina, meestal met een menu dat naar de secties springt, en dient meerdere doelen. Een landingspagina heeft één doel, wordt meestal voor één campagne gemaakt en kan deel uitmaken van een grotere website.
Moet een landingspagina een navigatiemenu hebben?
Meestal niet: elke menulink is een manier om weg te gaan voordat de bezoeker handelt. Houd het logo, een contactregel en juridische links aan; op een lange pagina vervangt een knop die naar het formulier springt het menu.
Hoe lang moet een landingspagina zijn?
Zo lang als de vragen van de bezoeker. Voor een gratis download zijn een of twee schermen genoeg; een dure dienst heeft prijzen, werkwijze, bewijs en antwoorden nodig en wordt dus langer. Herhaal dezelfde knop op natuurlijke rustpunten.
Wat is de beste bouwer voor landingspagina’s?
Dat hangt van de klus af. Voor voortdurend A/B-testen op betaald verkeer zijn Unbounce, Instapage en Leadpages ontworpen. Carrd is een goedkope keuze voor één eenvoudige pagina. Mobirise past bij een gratis pagina die je overal kunt hosten en later kunt laten uitgroeien tot een complete website, al heeft het geen ingebouwde A/B-tests.
Kan ik gratis een landingspagina maken?
Ja. De te downloaden app van Mobirise is gratis, bevat 200+ blokken en kan de pagina uploaden naar je eigen server. Online omvat het gratis abonnement 3 sites op een adres van mobirisesite.com plus 3 AI-generaties per maand, met een Mobirise-badge op elke site. Form Builder en Popup Builder vereisen een betaald abonnement, vanaf $149 per jaar.
Kan AI een landingspagina ontwerpen?
Ja. In Mobirise beschrijf je het aanbod en het publiek, kies je uit vier AI-ontwerpen en verfijn je er een door met de AI te chatten of zelf blokken te bewerken. Eén generatie levert één pagina of een ruwe versie van de complete website op. Je echte prijzen, feiten en foto’s komen nog steeds van jou.
Ondersteunt Mobirise A/B-tests?
Nee, er zijn geen ingebouwde A/B-tests. Je kunt twee versies op verschillende adressen publiceren, de helft van je advertentieverkeer naar elk adres sturen en de resultaten vergelijken in je advertentieaccount of analysetool.
Bouw je eerste landingspagina
Begin online met een door AI gegenereerd concept, of zet de pagina blok voor blok op in de gratis app op een Windows-, Mac- of Linux-computer, en publiceer de pagina daarna waar je campagne dat nodig heeft.