Met ChatGPT een website maken

Je kunt het je bijna niet voorstellen maar ChatGPT van complete websites maken. Dit is iets dat veel mensen nog niet weten. Meestal wordt het AI taalmodel alleen voor het creëren van teksten en blogs gebruikt. Wil je een nieuwe website bouwen? Doe dit met ChatGPT: een website maken was nog nooit zo makkelijk geweest. Laten we hiermee aan de slag gaan.

Hoe maak ik een website met ChatGPT?

Het makkelijkst is om een website met behulp van een websitebuilder te maken. Bijvoorbeeld Wix of WordPress. Hiermee bouw je een website op basis van wat je ziet is wat je krijgt.

Welnu, je wil toch met programmeertaal werken. Voer de volgende prompt in (of pas hem aan, waar nodig)”:

Maak een html-skelet met een responsief ontwerp en een responsief hamburgermenu dat ook op mobiel werkt. Importeer alle benodigde scripts vóór de afsluitende body-tag, zoals jQuery, popper en bootstrap.

Het is belangrijk dat je de benodigde JavaScript-bestanden (jQuery, Popper.js en Bootstrap.js) vóór de afsluitende body-tag importeert.

Heb je geen verstand van dit soort scripts? Laten we dan een eenvoudige webpagina maken. Gebruik deze prompt:

Maak een html-skelet voor een webpagina. Ik heb geen scripts nodig en gebruik geen andere programmeertalen zoals CSS of PHP.

Mooi toch wat hieruit komt?

Een mobiele website maken

Met alleen html is je website goed zichtbaar op desktop (pc of laptop). Maar niet op mobiele apparaten (smartphone of tablet). Wil je met je ChatGPT een website maken dan moet je zeker aangeven dat je een mobiel menu nodig hebt. De chatbot zal een code schrijven waarin ook CSS is verwerkt.

Laat ChatGPT een titel verzinnen

Het is best leuk om met ChatGPT een website te maken. Heb je niet zoveel ideeën omtrent je nieuwe website? Vraag de chatbot om een titel te verzinnen. Dat doe je met de volgende prompt: ‘wat moet de titel van mijn website zijn, ik {verkoop product X of bied deze dienst aan]’. Je moet zelf nog even aangeven wat het doel van je website is.

Vind je het idee dat naar voren komt niet zo goed? Je kunt opnieuw deze vraag stellen, maar misschien vind je het praktisch om direct een keuze te maken. Voer daarom de volgende prompt in: ‘geef 10 mogelijke titels voor mijn website’. Uiteraard moet je wel nog even doorgeven wat voor ‘n website het gaat worden.

De inleiding van de website

Je moet nu een inleiding voor je website schrijven. Ook dit kan ChatGPT voor jou doen. Geef hiervoor de opdracht: ‘schrijf een inleiding voor mijn website die over {onderwerp} gaat’.

Meestal moet je de inleiding nog een beetje aanpassen. Wanneer je niet tevreden bent over de inleiding dan kun je ChatGPT gewoon een nieuwe laten maken. Wees in je opdracht zo specifiek mogelijk. Dit vergroot de kans op een pakkende en mooie inleiding voor je website.

Een afbeelding laten maken

Je kunt ChatGPT niet vragen om een afbeelding te tonen. Maar het is wel mogelijk om hier een code voor te laten schrijven, die je vervolgens aan de code op je website toevoegt. Allereerst moet je weten waar de afbeelding vandaan moet komen. Gebruik hiervoor een stockfotowebsite voor gratis foto’s, zoals Pixabay of Pexels.

Vervolgens vraag je ChatGPT om een afbeeldingselement voor je website te maken, waarbij je ook aangeeft van welke stockfotowebsite de afbeelding afkomstig moet zijn. Hieronder een voorbeeld van een html img-tag, geschreven door ChatGPT.

<img src=”pad/naar/jouw/afbeelding.jpg” alt=”berglandschap”>

Uiteraard moet je ‘pad/naar/jouw/afbeelding.jpg’ vervangen voor de URL van de afbeelding.

Een contactformulier toevoegen

Het is wel handig wanneer bezoekers op je website contact met jou op kunnen nemen. Ook deze code kan de chatbot voor jou maken. Dat doe je met de volgende opdracht: ‘Ik wil een contactformulier op mijn website plaatsen. Schrijf hier een code voor.’

En kijk eens aan, er komt een code voor een contactformulier tevoorschijn. Let op want het formulier is enerzijds gemaakt met html. Aan de andere kant wordt gebruikt gemaakt van een scripttaal zoals PHP.

Speciale effecten

Vind je het leuk om een website te maken met behulp van ChatGPT? Experimenteer dan eens met speciale effecten. Zo kun je bijvoorbeeld tekst laten knipperen, gloeien of bewegen. Al die opdrachten geef je aan de chatbot, die vervolgens de juiste code schrijft. Plaats deze code op je website. Het is altijd aan te raden om de werking van de code te testen.

Houd er rekening mee dat sommige codes niet werken. Dit kan aan ChatGPT liggen, maar ook aan je webhosting en wat je website allemaal ondersteunt. Daarnaast is het aan jou om de codes goed te implanteren.

Overzicht van wat ChatGPT allemaal kan

Wordt ChatGPT daadwerkelijk gebruikt voor het bouwen van websites? Ja, dit komt steeds vaker voor. Hieronder een overzicht van wat ChatGPT allemaal kan maken.

• Een standaard webpagina (html voor de opbouw)
• Afbeeldingen invoegen
• Contactformulieren
• CSS-code voor opmaak van de website
• JavaScript code voor dynamische elementen
• PHP-code
• SQL-code voor het beheren van de database
• API-code voor externe service is
• Ajaxcode voor asynchrone functionaliteit
• Bootstrapcode
• Een navigatiebalk
• Special effect
• Een footer
• Blogs, artikelen en teksten
• Meta beschrijvingen

Je ziet dat er best veel mogelijk is. Maar dit wil niet zeggen dat alles perfect werkt. Daarom blijft het je eigen verantwoordelijkheid om de codes te testen. Laat je een blog of tekst door ChatGPT schrijven? Controleer dan altijd of het niet om plagiaat gaat. Ondanks dat het plagiaatpercentage heel laag is, kan het voorkomen dat stukken tekst toch van een andere website afkomstig zijn, en hiermee herkenbaar.

De voordelen en nadelen van ChatGPT

Voor het schrijven van codes voor je website is ChatGPT ideaal. En je kunt er ook ideeën mee opdoen voor titels of onderwerpen voor je website. Maar het is minder geschikt om er hele blogs, artikelen en teksten mee te schrijven.

Waarom dit zo is leer je in de cursus Online Zichtbaarheid. Het gaat in deze cursus over SEO, social media, concurrenten, doelgroepen en AI-taalmodellen. Een AI-taalmodel heeft wat voordelen maar er kleven ook heel wat nadelen aan. Juist het gebruik van ChatGPT kan ertoe leiden dat je website niet meer zo hoog in zoekmachines scoort.

Volg de cursus en leer alles over je online zichtbaarheid. Op de speciale pagina vind je meer informatie over de inhoud van de cursus.