Hoe je een Webflow-website herbouwt met AI

Inleiding

Webflow is een krachtig hulpmiddel waarmee je uitstekende websites kunt maken, maar het staat ook bekend om zijn complexiteit. Duizenden bedrijven voelen zich er gevangen in zitten.

Tegenwoordig maken AI-hulpmiddelen het mogelijk om even goede sites te bouwen door simpelweg te chatten met AI. En als je al een Webflow-site hebt, kun je die automatisch herbouwen, zodat je niet opnieuw hoeft te beginnen.

In deze handleiding laat ik je zien hoe je een Webflow-website migreert naar een nieuw AI-hulpmiddel genaamd Repaint.

Waarom een Webflow-website herbouwen?

AI-websitebouwers zijn aanzienlijk eenvoudiger in gebruik dan Webflow. In plaats van een complexe visuele editor te leren, beschrijf je wat je wilt en het gebeurt. Daardoor is het realistisch om je site echt up-to-date te houden, in plaats van elke wijziging als een risico te behandelen.

De reden dat de meeste mensen nog niet zijn overgestapt, is dat weggaan uit Webflow altijd betekende dat je alles opnieuw moest opbouwen. AI-hulpmiddelen hebben die balans veranderd. Voor het eerst kun je wat je al hebt meenemen naar een eenvoudiger platform, zonder opnieuw te beginnen of iemand duizenden euro's te betalen.

Hoe AI-websitemigratie werkt

AI-migratie werkt door je bestaande site te lezen en opnieuw te bouwen op een nieuw platform. Het haalt je inhoud, afbeeldingen en indeling op, en genereert vervolgens een nieuwe versie die je kunt bewerken door met AI te chatten. Als je tevreden bent, zet je je domein over en ben je klaar.

Als je de originele site precies wilt kopiëren, zal het resultaat ongeveer 80% kloppen. De AI verliest doorgaans details in de vertaling. Animaties zijn bijzonder lastig over te zetten. Maar je inhoud wordt gemigreerd, je indelingen worden nagebouwd, en het resultaat ligt veel dichter bij het origineel dan een template ooit zou kunnen. Daarna kun je alle details corrigeren door de AI om aanpassingen te vragen.

Als je site vijf jaar oud is en verouderd aanvoelt, is dit een goed moment om het ontwerp te vernieuwen. Repaint kan je bestaande inhoud meenemen en er een volledig nieuw ontwerp omheen bouwen.

Stap 1: Importeer je inhoud

Ga om te beginnen naar Repaint. Voer bovenaan de link naar je Webflow-website in. Dit start het herbouwproces. Repaint scant je site, downloadt je afbeeldingen en maakt schermafbeeldingen van elke pagina om je originele site te begrijpen.

Dit werkt alleen voor openbaar beschikbare websites, wat betekent dat je Webflow-site gepubliceerd moet zijn, ook als het op een gratis Webflow-subdomein staat zoals xxxx-xxxx-xxxx.webflow.io.

Zodra Repaint een goed beeld heeft van je bedrijf, begint het je vragen te stellen om de nieuwe site te plannen. Het is een begeleide procedure, dus je hoeft niets voor te bereiden.

Stap 2: Plan je nieuwe website

Voordat er iets wordt gebouwd, stelt Repaint je vragen om te begrijpen wat je voor ogen hebt. Dit duurt meestal 3 tot 5 berichten. Zie het als een kort interview: Repaint wil weten welke pagina's je wilt behouden, of er iets gereorganiseerd moet worden, en welke stijl je wilt gebruiken. Zodra je hebt geantwoord, stelt het een plan op dat jij kunt goedkeuren.

Als je niet zeker weet wat je wilt, is dat prima. Je kunt Repaint een plan laten voorstellen. Als je het resultaat niet bevalt, kun je het altijd vragen het opnieuw te proberen. Je zit niet vast aan je eerste poging.

Plan de inhoud

De eenvoudigste aanpak is alles over te brengen zoals het is: dezelfde pagina's, dezelfde tekst, dezelfde afbeeldingen. Als de huidige structuur van je site werkt en je alleen een beter hulpmiddel wilt om het te beheren, is dit de juiste keuze.

Maar als je site door de jaren heen rommelig is geworden, is dit een kans om het op te schonen. Misschien heb je verouderde blogposts, landingspagina's van oude campagnes, of secties die nooit logisch waren. Je kunt Repaint vertellen welke pagina's je wilt behouden en welke niet, of het vragen een eenvoudigere structuur voor te stellen op basis van wat het heeft gevonden.

Als je Webflow-site CMS-collecties gebruikt, zoals een blog, casestudies of een portfolio, kun je die ook meenemen. CMS-pagina's volgen een herhalend sjabloon, dus begin met slechts één of twee om te controleren of de indeling er goed uitziet. Als je site meer dan 20 pagina's heeft, zal het in één keer importeren van alle pagina's waarschijnlijk het volledige gratis gebruikslimiet opgebruiken. Je wordt dan gevraagd te upgraden om door te gaan. Voor grote sites is het verstandig met een kleine steekproef te beginnen en de rest later toe te voegen.

Plan de stijl

Je hebt een aantal opties voor hoe je nieuwe site eruit moet zien:

• Je originele uitstraling recreëren
• De stijl van een andere website overnemen
• Kiezen uit de stijlbibliotheek van Repaint
• Een aangepaste stijl aanvragen
• Repaint laten beslissen

Welke aanpak je ook kiest, je kunt het resultaat aanpassen. Repaint kan je merkkleuren en lettertypen verwerken in elke stijl, zodat je niet vastgehouden bent aan precies wat je hier kiest.

Bekijk het plan

Voordat er iets wordt gegenereerd, schrijft Repaint precies op wat het gaat bouwen: welke pagina's, welke inhoud en welke stijl. Bekijk het goed en breng eventuele laatste wijzigingen aan. Het is veel sneller om het plan aan te passen dan de hele site opnieuw te genereren.

Zodra je bevestigt, bouwt Repaint je nieuwe website!

Stap 3: Genereer je website

Zodra je het plan bevestigt, begint Repaint met het bouwen van je site. Je ziet voortgangsberichten terwijl het elke pagina verwerkt. Een eenvoudige startpagina kan een minuut of twee duren. Een grote website met tientallen pagina's kan meer dan tien minuten duren.

Op de achtergrond schrijft Repaint de code voor je nieuwe site aan de hand van je inhoud en stijl. Als het klaar is, maakt het schermafbeeldingen van wat het heeft gebouwd om duidelijke problemen op te sporen voordat het je het resultaat toont.

In de eerste versie kun je wat ruwe kantjes tegenkomen: een knop met moeilijk leesbare tekst, een te klein logo, of ruimte die er niet goed uitziet. Dat is normaal, en je kunt deze details corrigeren door met Repaint te praten.

Animaties zijn iets dat mogelijk niet naadloos wordt overgebracht. Webflow heeft een uitgebreid animatiesysteem, en de AI heeft moeite om af te leiden hoe animaties werken op basis van schermafbeeldingen alleen. Je moet ontbrekende scroll-effecten, hover-animaties of paginaovergangen opnieuw aanmaken door te beschrijven wat je wilt. Repaint kan dezelfde animaties maken; ze worden alleen niet altijd automatisch overgebracht.

Stap 4: Aanpassingen maken

Na het genereren van je site kun je wijzigingen aanbrengen door met Repaint te chatten.

Begin met het beoordelen van de algemene visuele stijl: kleuren, lettertypen en indelingen. Dat is de basis waarop alles is gebouwd. Als je die later wilt veranderen, kan dat de hele site ingrijpend veranderen en detail-verbeteringen die je al hebt gedaan ongedaan maken.

Als je tevreden bent met de algemene stijl, kun je de fijnere details doorlopen: controleren of tekst klopt, afbeeldingen op de juiste plek staan, links werken en de opmaak er op elke pagina goed uitziet.

SEO controleren

Als je Webflow-site zoekverkeer genereerde, is SEO een belangrijk aandachtspunt tijdens de migratie. Google rangschikt afzonderlijke pagina's, niet hele websites. Elke pagina op je site heeft in de loop van de tijd een eigen ranking opgebouwd, en die ranking is gekoppeld aan een specifieke URL. Als je naar een nieuw platform overstapt en die URL's veranderen of verdwijnen, behandelt Google ze als nieuwe pagina's zonder geschiedenis, en verlies je het verkeer dat ze genereerden.

Vraag Repaint je oude site te vergelijken met de nieuwe en te bevestigen dat alle pagina's op dezelfde URL's staan als op Webflow. Als URL's zijn veranderd, wil je omleidingen instellen van de oude naar de nieuwe URL's, zodat Google het pad kan volgen. Repaint kan daarbij helpen.

Als je site er goed uitziet en de inhoud klopt, ben je klaar om te publiceren.

Stap 5: Publiceren

Als je er klaar voor bent, klik je op de knop Publiceren rechtsboven. Dit werkt hetzelfde als publiceren in Webflow. Je site gaat live op een Repaint-URL die je met iedereen kunt delen. Die ziet er ongeveer zo uit: https://xxxxxx-xxxxxx-xxxxxx.sites.repaint.com

Hiermee is het een echte website op internet. Je kunt het openen op je telefoon, naar een vriend sturen of delen op sociale media.

Op dit punt heb je twee live websites: één op Repaint en één op Webflow. Je domein wijst nog steeds naar je Webflow-site, dus voor je bezoekers is er nog niets veranderd. Als je klaar bent voor de overstap, kun je je domein overzetten naar de nieuwe site.

Stap 6: Domein overzetten

Als je live wilt gaan, moet je je domein naar Repaint laten wijzen. Ga naar Website-instellingen > Domeinen en klik op Verbind een eigen domein. Dit vereist een betaald abonnement. Je kunt de prijsdetails hier bekijken.

Je domein staat los van Webflow. Het is geregistreerd bij een domeinprovider zoals GoDaddy, Namecheap of Cloudflare. Je hoeft het nergens naartoe te verplaatsen. Je werkt alleen de instellingen bij bij je domeinprovider, zodat je domein naar Repaint wijst in plaats van naar Webflow. Als iemand anders je website heeft opgezet, zorg dan dat je inloggegevens voor je domeinprovider hebt voordat je met deze stap begint.

Als je dit nog nooit hebt gedaan, geen zorgen. Vraag Repaint om je er stap voor stap doorheen te leiden.

De wijziging kan een paar uur duren voordat deze van kracht wordt. Zodra Repaint je domein als geverifieerd toont, ben je live. Je kunt je Webflow-abonnement dan opzeggen wanneer je wilt.

Conclusie

Jarenlang betekende migreren uit Webflow opnieuw beginnen of iemand inhuren om het voor je te doen. Dat is niet langer het geval. Je kunt je inhoud in Repaint brengen, binnen enkele minuten een werkende site krijgen en die zelf beheren zonder een complex hulpmiddel te hoeven leren. Als je een rebuild steeds hebt uitgesteld omdat het te veel werk leek, is dit een goed moment om het te proberen.

Veelgestelde Vragen

Hoe lang duurt een Webflow-migratie?

Het plannen van de site, importeren van je inhoud en genereren van de nieuwe website duurt meestal 3 tot 15 minuten. Daarna hangt de tijd tot publicatie af van hoeveel aanpassingen je nodig hebt en of je meer inhoud moet importeren. De meeste sites kunnen binnen een paar uur worden gemigreerd.

Ziet mijn site er ook goed uit op mobiel?

Repaint bouwt je site automatisch zo dat het zich aanpast aan verschillende schermformaten. Meestal hoef je je er geen zorgen over te maken. Maar als je iets opmerkts dat niet klopt, kun je Repaint vragen aanpassingen te maken voor specifieke apparaatformaten.

Werken mijn formulieren nog na de migratie?

Ja. Repaint kan contactformulieren maken die e-mails naar je inbox sturen. Als je een aangepaste integratie gebruikt zoals Typeform of Google Formulieren, zal Repaint proberen die te koppelen, maar mogelijk moet je de insluitcode met Repaint delen.

Wat gebeurt er met mijn Webflow-site tijdens de migratie?

Terwijl je migreert, verandert er niets aan je Webflow-site. Die staat er volledig los van. Je doet niets anders dan een nieuwe site bouwen in Repaint. Zodra je tevreden bent met de nieuwe site, kun je je domein overzetten. Als je besluit je Webflow-site te houden, hoef je niets te doen.

Kan ik een Webflow-site met e-commerce migreren?

Gedeeltelijk. Repaint kan websites voor e-commerce maken, maar het bouwt niet het afrekenproces of betalingsverwerking. Als je producten wilt verkopen, moet je verbinding maken met een externe dienst zoals Shopify of Stripe. Als je winkel gebruik maakt van insluitbare widgets, deel dan de insluitcode met Repaint en het integreert die.

Kan ik eerst slechts één pagina migreren om het uit te proberen?

Ja. Je kunt slechts één pagina importeren om het uit te proberen. Dit is een goede manier om te zien of Repaint geschikt is voor jouw bedrijf. Als je tevreden bent met het resultaat, kun je Repaint vragen de rest van je site te bouwen.

Hoeveel kost het om van Webflow naar Repaint te migreren?

Het genereren van een site en beginnen met bewerken is gratis. De belangrijkste beperkingen van gratis abonnementen zijn een beperkt gebruik, geen mogelijkheid om een eigen domein toe te voegen, en een Repaint-badge op de site. Betaalde abonnementen beginnen vanaf $20 per maand bij jaarlijkse facturering, of $25 per maand bij maandelijkse facturering. Dat omvat uitgebreid gebruik, ondersteuning voor een eigen domein en verwijdering van de Repaint-badge.

Wat gebeurt er als de AI een fout maakt? Kan ik afzonderlijke wijzigingen ongedaan maken?

Terwijl je aanpassingen maakt, slaat Repaint elke versie van je site op. Je kunt Repaint vragen terug te gaan, en het keert dan terug naar een eerdere versie. Als je naar een specifiek moment in de tijd wilt teruggaan, kun je ook handmatig een eerdere versie herstellen.

Hoe gaat Repaint om met aangepaste code of insluitingen van derden uit Webflow?

Repaint kan aangepaste code of insluitingen van Webflow-sites uitvoeren. Het zal bij de eerste doorloop proberen alles automatisch te migreren, maar mist soms iets. Als dat het geval is, plak je de insluitcode in de chat en Repaint handelt het verder af.