Welkom bij jouw AI-webbouwgids
Ontdek hoe je met behulp van kunstmatige intelligentie eenvoudig professionele websites kunt bouwen — zonder technische kennis. Deze gids neemt je stap voor stap mee in het proces, zodat je direct aan de slag kunt.
Of je nu een ondernemer bent, een creatieveling of gewoon nieuwsgierig: deze gids is ontworpen om jou te helpen snel en slim online zichtbaar te worden.
Bekijk de video: AI Website Builder in actie
In deze Engelstalige video (met Nederlandse ondertiteling) zie je stap voor stap hoe je een website bouwt met behulp van AI. Elke handeling wordt visueel uitgelegd, zodat je direct kunt meedoen.
📚 Ga direct naar een stap in de gids:
Stap 1 – API-sleutels instellen
In deze eerste stap leer je hoe je jouw AI-platform activeert door API-sleutels toe te voegen van twee providers: Google Gemini en OpenAI. Dit is essentieel om alle AI-mogelijkheden van het platform te benutten.
🔑 Google Gemini API-sleutel verkrijgen
- Ga naar Google AI Studio
- Log in en klik op “API-sleutel aanmaken”
- Kopieer de gegenereerde sleutel
- Plak deze in je platform onder “Key Identifier” en geef het een herkenbare naam
💳 Facturering instellen bij Google
- Ga naar het tabblad ‘Plan’ → ‘Facturering instellen’
- Voeg een factureringsaccount toe om onderbrekingen te voorkomen
- Je kunt een tegoed van $5 of $10 toevoegen, (voldende voor 50 websites)
🔐 OpenAI API-sleutel toevoegen
- Ga naar OpenAI API instellingen
- Klik op “Maak geheime sleutel” en voer verificatie uit
- Kopieer de sleutel en plak deze in je platform
- Geef het een naam zoals “Open sleutel 2” en klik op Opslaan
💳 Facturering instellen bij OpenAI
- Ga naar Facturering
- Voeg je betaalgegevens toe
- Voorkom onderbrekingen in je AI-diensten. (5 tot 10$ is voldoende voor 50 websites)
Stap 2 – Werkruimte aanmaken
In deze stap creëer je jouw eigen digitale werkruimte — de plek waar je projecten, instellingen en AI-tools samenkomen. Dit is je persoonlijke cockpit voor het bouwen van websites.
🏗️ Nieuwe werkruimte toevoegen
- Ga naar het dashboard van je platform
- Klik op ‘Werkruimte toevoegen’
- Voer een naam in voor je werkruimte (bijv. bedrijfsnaam of projectnaam)
- Voeg een subdomeinnaam toe, zoals
mijnbedrijf.busineasy.ai - Bevestig met ‘Oké’ om de werkruimte aan te maken
🚀 Wat gebeurt er daarna?
- Je werkruimte is nu actief en gekoppeld aan je API-sleutels
- Je kunt pagina’s gaan bouwen en AI-tools gebruiken
- Je kunt ook vanaf nul beginnen en alles stap voor stap opbouwen
Stap 3 – Website bouwen met AI-chatbot
In deze stap ga je daadwerkelijk communiceren met de AI-chatbot om je website te bouwen. Je geeft input over je bedrijf en de AI genereert automatisch een volledige site-indeling.
🤖 Starten met ‘Maken met AI’
- Selecteer de werkruimte die je hebt aangemaakt
- Beantwoord vragen zoals: bedrijfstype, naam, locatie, doelgroep
- Kies een taal voor je website (bijv. Engels, Nederlands, Arabisch)
📐 Structuur van je website
- AI genereert automatisch: koptekst, over ons, diensten, galerij, getuigenissen, call-to-action
- Je kunt elementen verwijderen of toevoegen zoals ‘Contact’, ‘Producten’, ‘Team’
🎨 Kies een sjabloon
- Selecteer een visuele stijl die past bij jouw merk
- Klik op ‘Doorgaan’ en de AI bouwt automatisch je website
- Alle content, afbeeldingen en animaties worden gegenereerd
🛠️ Website bewerken
- Klik op ‘Bewerken’ om de editor te openen
- Bekijk je site op desktop, tablet en mobiel
- Pas tekst, kleuren, lettertypes en secties aan
- Gebruik het HTML-tabblad voor geavanceerde bewerkingen
Stap 4 – Pagina’s, SEO en contentblokken
In deze stap leer je hoe je pagina’s toevoegt, SEO-instellingen configureert en contentblokken gebruikt om je site visueel en functioneel op te bouwen.
⚙️ Pagina-instellingen en SEO-optimalisatie
- Klik op het tandwieltje rechtsboven op je pagina
- Voeg SEO-titels, meta-beschrijvingen en zoekwoorden toe
- Upload een favicon en activeer de GDPR-cookiebanner
🧱 Contentblokken en secties toevoegen
- Gebruik de linkerzijbalk om blokken te slepen en neer te zetten
- Kies uit headers, artikelen, foto’s, FAQ’s, call-to-actions, winkelmodules en meer
- Voor e-commerce kun je specifieke product- en winkelblokken activeren
🖼️ Afbeeldingen en componenten bewerken
- Selecteer een afbeelding en upload je eigen media
- Pas afmetingen aan, voeg links toe of gebruik de AI-afbeeldinggenerator
- Bewerk tekst, knoppen en kleuren direct in de editor
Stap 5 – Navigatie en menu’s instellen
In deze stap leer je hoe je een overzichtelijk navigatiemenu opbouwt, pictogrammen toevoegt, dropdowns maakt en externe links koppelt aan je menu-items.
🧭 Menu opbouwen
- Open de menubouwer via module-instellingen
- Voeg nieuwe menu-items toe zoals ‘Blog’, ‘Over ons’, ‘Contact’
- Gebruik pictogrammen in plaats van tekst voor visuele navigatie
🔀 Dropdowns en submenu’s
- Sleep items onder elkaar om dropdowns te maken
- Pas kleuren en stijlen aan voor submenu’s
- Voeg subitems toe zoals ‘Herenkapsel’ onder ‘Onze diensten’
📞 Contactopties en externe links
- Voeg WhatsApp of telefoonnummer toe als menu-item
- Koppel aan een externe URL of laat openen in een nieuw tabblad
- Gebruik pictogrammen zoals een telefoon of envelop
Stap 6 – Interactieve secties en media
In deze stap voeg je interactieve elementen toe aan je website, zoals klikbare secties, video’s, afbeeldingen met effecten en dynamische contentblokken.
🔗 Secties koppelen aan menu-items
- Geef een sectie een unieke
section-IDvia de instellingen - Koppel een menu-item aan
#section-IDzodat het automatisch naar die plek scrollt - Perfect voor one-page websites met vloeiende navigatie
🎥 Video en media toevoegen
- Sleep een videoblok naar je canvas
- Voeg een YouTube-link toe of upload je eigen video
- Pas instellingen aan zoals autoplay, formaat en achtergrond
🖼️ Afbeeldingen en visuele effecten
- Gebruik AI om afbeeldingen te genereren op basis van je prompt
- Pas effecten toe zoals Ken Burns (inzoomen), parallax (scroll-effect) en hover-zoom
- Voeg overlays, tinten of animaties toe voor extra stijl
🧱 Contentblokken en layout
- Sleep blokken zoals koppen, knoppen, foto’s, contactformulieren en producten
- Gebruik canvasmodus om elementen vrij te positioneren
- Combineer blokken tot één container voor overzicht en consistentie
Stap 7 – HTML, formulieren en AI-assistent
In deze stap leer je hoe je eigen HTML-code toevoegt, formulieren opzet voor leadgeneratie en de AI-assistent gebruikt om content te herschrijven, ontwerpen en genereren.
🔧 HTML-integratie
- Voeg HTML-, CSS- of JavaScript-code toe via het HTML-blok
- Gebruik dit voor trackingpixels, embedcodes, autoresponders of betaalknoppen
- Plak je code in het instellingenvenster van het blok
📝 Formulieren en leadgeneratie
- Sleep een contactformulier naar je canvas
- Pas velden aan: naam, e-mail, bericht, etc.
- Koppel het formulier aan externe tools via webhooks (bijv. Zapier, Pabbly)
🧠 AI-assistent gebruiken
- Gebruik spraak-naar-tekst om opdrachten in te spreken
- Laat de AI tekst herschrijven, visueel herontwerpen of een volledige sectie vernieuwen
- Genereer content zoals artikelen, opsommingen of prompts voor nieuwe secties
- Gebruik de AI-afbeeldinggenerator voor unieke visuals
Stap 8 – Typografie, animatie en layout
In deze stap geef je je website karakter en dynamiek. Je past lettertypes aan, voegt animaties toe en optimaliseert de layout voor een professionele uitstraling.
✍️ Typografie instellen
- Kies uit vooraf ingestelde typografische stijlen
- Pas toe op een specifieke sectie of de hele site
- Stel lettertype, regelafstand, uitlijning en transparantie in
🎞️ Animaties toevoegen
- Voeg animaties toe aan tekst, afbeeldingen, kolommen of containers
- Kies uit effecten zoals vervagen, verschuiven, inzoomen
- Stel timing, vertraging en gedrag in (bij scrollen, binnenkomst, verlaten)
📐 Layout en canvasmodus
- Gebruik canvasmodus om elementen vrij te positioneren
- Combineer blokken tot één container voor overzicht
- Optimaliseer layout voor desktop, tablet en mobiel
Stap 9 – Publicatie en export
Je website is klaar om live te gaan. In deze laatste stap zorg je voor een correcte SEO-configuratie, exporteer je je project en upload je het naar je hostingomgeving.
🔍 SEO & GDPR instellen
- Open het tandwielmenu op je pagina
- Voeg SEO-titel, meta-beschrijving en favicon toe
- Activeer de GDPR-cookiebanner indien nodig
📦 Website exporteren
- Download je website als ZIP-bestand
- Het bestand bevat alle pagina’s, afbeeldingen en instellingen
- Klaar om te uploaden naar je eigen hosting of die van een klant
🚀 Livegang
- Upload het ZIP-bestand via FTP, cPanel of een hostingdashboard
- Controleer of alle links, formulieren en media correct werken
- Je site is nu live en klaar om bezoekers te ontvangen
🎉 Gefeliciteerd! Je hebt alle stappen doorlopen en bent klaar om je AI-website te lanceren. Veel succes met je online zichtbaarheid!
