Wat is het verschil tussen hand gecodeerde websites en WordPress-sites?
Statische websites (Handgecodeerd) vs Dynamische websites (WordPress, Wix, enz.)
Belangrijkste bevindingen
- 1). Statische websites die vanaf nul zijn gecodeerd, laden tot 10 keer sneller dan paginabouwers zoals WordPress. Als je website meer dan 3 seconden nodig heeft om te laden, zal het merendeel van je bezoekers de site verlaten, waardoor je klanten verliest.
- 2). Google indexeert je website op basis van hoe je mobiele site presteert, en paginabouwers zijn vaak niet geoptimaliseerd, niet snel genoeg, niet volledig responsief, wat je zoekresultaten kan schaden.
- 3). Mijn handgemaakte statische sites worden mobiel-eerst gecodeerd, wat betekent dat ik de code schrijf beginnend met mobiele schermen, en vervolgens code toevoeg voor tablet en desktop. Dit maakt mobiele sites meer responsief, geoptimaliseerd en ongelooflijk snel in laden - waardoor de prestaties van je website op Google verbeteren en ervoor zorgen dat bezoekers je site niet verlaten.
- 4). WordPress staat erom bekend kwetsbaar te zijn en moet regelmatig worden bijgewerkt om beveiligingslekken te dichten die hackers kunnen gebruiken om je website te compromitteren. Handgemaakte statische sites kunnen niet zo gemakkelijk worden gecompromitteerd en zijn vrijwel ondoordringbaar vanwege hun eenvoud en het gebrek aan toegangspunten om te hacken.
In de wereld van webontwikkeling zijn er twee soorten websites - statische en dynamische. Een statische site is een site die alleen de belangrijkste bouwstenen van webontwikkeling gebruikt: html, css en JavaScript. Er zijn geen databases, functionaliteiten om gegevens te manipuleren of andere geavanceerde zaken. Het toont gewoon de pagina zoals deze is gemaakt. Deze drie programmeertalen vormen alles wat je op een website kunt zien en in veel gevallen is dit alles wat je nodig hebt. Wanneer je een statische site laadt, is het je browser die de code van de website leest, compileert en direct laadt. Elke gebruiker laadt exact dezelfde inhoud. Een van de beste manieren om een statische site te maken is door het met de hand te coderen (wat ik het beste kan!) of met een statische site generator.
Een dynamische site (WordPress, paginabouwers) is een site die gebruik maakt van aanvullende server-side talen en technologieën om html, css en andere middelen uit een database te halen en de website samen te stellen terwijl deze op de server laadt, voordat het naar de browser wordt verzonden. In plaats van dat de browser de code compileert, is het de server die dit voor de browser doet en het resultaat verzendt. In plaats van dat elke gebruiker exact dezelfde inhoud krijgt, ontvangen ze allemaal individueel verschillende inhoud. Dit leidt tot langere laadtijden en maakt je website kwetsbaar voor aanvallen van malware en hackers die het proces van de server kunnen verstoren wanneer deze de database controleert voor de website-inhoud. Statische sites hebben geen databases, dus er is niets om aan te vallen. Later in deze blog zullen we hier dieper op ingaan.
Dynamische sites omvatten websites gebouwd met WordPress, Wix, Squarespace, GoDaddy, paginabouwers of gebouwd met php, etc. Deze paginabouwers slaan de middelen en inhoud op in een database. Wanneer iemand de website bezoekt, controleert de server zijn inventaris van de dingen die de browser vraagt en haalt ze uit die database om ze samen te voegen tot de landingspagina die je ziet. Hoewel deze paginabouwers het gemakkelijk maken om je eigen website te maken en dat ook nog goedkoop, zijn er ENORME nadelen in vergelijking met de statische websites die ik bouw.
Waarom zijn statische websites sneller dan dynamische websites?
Een van de belangrijkste aspecten van de rangschikking van je website op Google is hoe snel het laadt en presteert - vooral op mobiele apparaten. Het probleem met dynamische websites (WordPress, Wix, etc.) is dat de server meer tijd nodig heeft om de database te controleren en alles samen te voegen. Hoe meer plug-ins en extra functies je op je site hebt, hoe meer het de laadtijd zal vertragen. Dit is cruciaal omdat studies hebben aangetoond dat het merendeel van de gebruikers een website zal verlaten als het langer dan 3 seconden duurt om te laden. Dus als je website meer dan 3 seconden nodig heeft om te laden, wat is dan het punt van het hebben ervan als de meerderheid van de gebruikers het niet eens zal bekijken? Dat is een van de GROOTSTE nadelen die ik zie bij WordPress- en Wix-sites - ze kunnen te langzaam laden en je geld kosten.
Statische sites daarentegen kunnen tot wel 10 keer sneller laden dan een dynamische website omdat er geen chirurgie op de website nodig is en de onderdelen van de pagina zo snel mogelijk aan elkaar moeten worden genaaid op de operatietafel van de browser. Alles is al voorgebouwd, dus het enige wat de browser hoeft te doen is het laden en het aan ons presenteren. Er zijn geen plug-ins, geen databases, geen verspilde ruimte of overbodigheden. Elke regel code die ik schrijf voor mijn sites is met een doel en op een georganiseerde manier geschreven die gemakkelijk te lezen en te begrijpen is voor Google. Dynamische sites zoals WordPress hebben VEEL opgeblazen en rommelige code die de laadtijden verder vertragen.
Stel je voor dat je een bord spaghetti hebt en je wilt weten hoeveel spaghetti er op je bord ligt. Nou, het is allemaal door elkaar gehusseld en in elkaar verstrengeld, dus het kost veel tijd om ze uit elkaar te halen, te tellen en er zin van te maken. Op je andere bord (je "statische" bord) heb je al je spaghetti netjes gegroepeerd in groepen van 10 op het bord, met het vlees aan de zijkant klaar om te eten (maar eet alsjeblieft geen spaghetti op deze manier). Het is veel gemakkelijker en sneller om te analyseren hoeveel spaghetti je hebt wanneer alles volgens plan is gegroepeerd en georganiseerd. Dit is het verschil in hoe de code van een dynamische site eruitziet versus de code van een statische site. Het wordt "spaghetti-code" genoemd. En het maakt het laden van een site een tijdrovende taak voor de browser om te analyseren en te laden, terwijl de zoekcrawlers van Google moeite hebben om je inhoud te begrijpen en de betekenis ervan te achterhalen omdat het verstopt zit in een rommelige code zonder context eromheen.
De benchmark laadtijd voor een website is 2 seconden. Mijn handgemaakte statische websites kunnen vaak in minder dan 0,5 seconden laden, aanzienlijk lager dan het gemiddelde. Ze laden bijna direct. De code is gegroepeerd en georganiseerd, waardoor het lezen en begrijpen ervan gemakkelijker is voor je browser en voor Google, wat de laadtijden verbetert en op zijn beurt ervoor zorgt dat klanten je site niet verlaten en je website rangschikken op Google verbetert. Als de laadtijd meer dan 3 seconden bedraagt, is de kans groot dat mensen vertrekken voordat ze het überhaupt bereiken.
Mobiel-eerst programmeren en verhoogde sitesnelheid
Mobile first programmeren is iets wat niet gedaan kan worden door een pagina bouwer. Het is een ontwerppatroon waarbij wij als ontwikkelaars de code schrijven, beginnend met de mobiele schermen en code toevoegen voor tablet en desktop naarmate we verder gaan in het bestand. Wanneer de browser het CSS-bestand leest om te zien hoe de pagina moet worden gestructureerd en gestileerd, leest het van boven naar beneden. Als we bovenaan beginnen met het schrijven van desktopcode, zal de browser dat eerst lezen en laden. Vervolgens blijft het naar beneden gaan op de pagina om regels te controleren voor verschillende schermgroottes en laadt die ontwerpen en bewerkt de desktopinhoud om in de mobiele versie te passen. Als je op een mobiel apparaat bent en de mobiele code staat onderaan het CSS-bestand, moet de browser ALLE code in dat bestand lezen, desktopcode laden, de schermgrootteregel controleren en zeggen "ja, dit is inderdaad mobiel". Vervolgens moet het alles van de desktop afbreken en alles op het mobiele scherm proppen. Dit verspilt tijd en middelen.
Met de mobile first-benadering staat je mobiele code bovenaan en wordt deze als eerste gelezen. Dus wanneer je op je telefoon bent en de site laadt, laadt het eerst de mobiele stylingcode, controleert de schermgrootteregels en zegt "nou, dat is het jongens, zet die code op het scherm. Het is showtime!".
Laat me je uit ervaring vertellen - het is makkelijker om content te laten groeien naar zijn ruimte in plaats van het te verkleinen en in de kleinere ruimtes te proppen. Mobile first programmeren + statische site ontwikkeling maakt je site bliksemsnel.
Waarom zijn statische sites veiliger dan dynamische sites?
Dynamische websites hebben databases en server-side platforms die kunnen worden aangevallen wanneer ze proberen toegang te krijgen tot de database of content management systemen die alle gegevens van je website opslaan. Dus terwijl de server de site aan het opbouwen is en deze gereed maakt voor de browser, kunnen hackers zichzelf injecteren in het proces en je website compromitteren.
Statische sites daarentegen hebben niets om aan te vallen. Er is geen database, geen sessietokens, geen informatie die wordt verzameld of verzonden waar een hacker zich mee kan bemoeien of onderscheppen. Er zijn geen stappen voor hen om binnen te glippen en iets in de achterzak van onze website te stoppen op weg naar de browser.
Een van de problemen met WordPress-sites is de hoeveelheid plugins die je moet gebruiken. Als je een WordPress-site opzet en er een tijdje niet meer naar omkijkt, zullen veel van die plugins updates hebben gehad om beveiligingslekken te dichten. Als je ze niet bijwerkt, is je site niet veilig voor aanvallers en soms werken verouderde plugins gewoon niet goed samen en halen ze de hele site naar beneden zonder dat je het merkt. Wie heeft er tijd om al deze updates en patches bij te houden? Daar komt mijn werk met het maken van statische sites echt naar voren - er zijn geen updates nodig. Het is gewoon html en css. Er zijn geen handmatige beveiligingspatches nodig om je site veilig en beveiligd te houden. Als het eenmaal is opgezet, is het klaar.
Denk er zo over na - je hebt twee hutten in het bos, de ene heeft elektriciteit en internet en fancy elektronische sloten op de deuren die je bedient met een app en de verlichting en apparaten zijn verbonden met internet en de cloud die je vanaf je telefoon kunt bedienen. Dat is leven! In de andere hut is geen verbinding met een netwerk of cloud en de open haard zorgt voor alle warmte en de sloten op de deuren zijn gewoon ouderwetse bouten.
Nou, in die andere chique hut hackte iemand hun internetverbinding en kreeg controle over de sloten van het huis en schakelde ze uit, waardoor ze naar binnen konden komen en alles konden meenemen. Al die mooie snufjes creëerden alleen maar meer ingangen voor aanvallers om in je hut te komen, terwijl je de hut alleen nodig had om te ontspannen na het wandelen.
Maar de andere hut, zonder elektriciteit of internetgestuurde sloten en apparaten, is nog steeds veilig. Ze redden zich met de basis zoals een houtkachel en lantaarns. Dat is html en css. Gewoon goede ouderwetse houtkachels en lantaarns. En de sloten op de deur zijn veilig tegen aanvallen. Niemand komt binnen. Dat is wat een statische site is. Het verwijdert alle extra's en is gewoon een website gebouwd uit zijn kern bouwstenen. Dat is het type website dat ik maak. Ze zijn met de hand gesneden en gebouwd als blokhutten, alleen met de gereedschappen van een vakman. Die paginabouwers zijn massaal geproduceerde beveiligingsrisico's van lagere kwaliteit.
En omdat WordPress het meest populaire content management systeem (CMS) is voor het bouwen van websites, zullen hackers specifiek WordPress-sites targeten om bekende kwetsbaarheden uit te buiten en websites met verouderde versies en plugins te targeten. Jouw website heeft een doelwit op zijn rug. Door te kiezen voor een statische site, verwijderen we dat doelwit van je rug en kan je website vrij leven zonder zorgen over ontvoerd te worden van de straten van het internet.
Maar wat dacht je van de servers waarop deze statische sites leven? Kunnen ze worden gecompromitteerd en kan de site worden neergehaald? Nee hoor! Wanneer je statische site wordt geserveerd door een Content Delivery Network (CDN), leeft je site op meerdere servers over de hele wereld die klaar staan om toegang te bieden. Dus als een server uitvalt, kan deze gewoon worden geladen vanaf een andere locatie. Geen downtime!
Handgemaakte statische sites vs WordPress en Wix
Over het algemeen zullen handgemaakte statische websites bijna ALTIJD beter presteren dan paginabouwers zoals WordPress en Wix. Statische websites laden in milliseconden vergeleken met de meerdere seconden of meer die een WordPress- of Wix-site kan kosten. En het feit dat ze bijna ondoordringbaar zijn voor hacks of compromissen vanwege hun eenvoud maakt ze de duidelijke winnaar in de strijd om je bedrijf.
Dynamische sites bieden momenteel ook geen manieren om mobiel eerst te programmeren en kunnen niet profiteren van de voordelen ervan. Een van de problemen die je zelf kunt zien, is om een Wix-site te vinden en de browser te proberen te herschalen. Je zult merken dat ze geen tabletversie van je site bieden en dat de hele pagina niet erg responsief is, wat betekent dat de inhoud niet verandert of beweegt naarmate het scherm groter of kleiner wordt. Op bepaalde schermformaten wordt de inhoud van je webpagina in zijn vak geperst en wordt deze eigenlijk afgesneden aan de randen van het scherm omdat hij nergens heen kan, waardoor mensen niet eens kunnen lezen wat er staat. Of tekst kan op vreemde manieren rond afbeeldingen beginnen te wikkelen die de lay-out vervormen, waardoor je site kapot lijkt. Deze paginabouwers geven je niet de controle die je nodig hebt om je site responsief te maken voor elk mogelijk schermformaat zonder te weten hoe je moet coderen en toegang hebt tot de API van paginabouwers om met hun systeem te praten en zeer aangepast, ingewikkeld werk te doen.
Waarom zou ik iemand betalen om een website te maken als ik het zelf kan doen?
Wix en WordPress adverteren dat iedereen gratis een website kan maken, wat het zeer aantrekkelijk maakt voor kleine bedrijven die geen geld hebben om een ontwikkelaar zoals ik in te huren om er een voor hen te maken. Echter, als paginasnelheid, laadtijden, beveiliging, het converteren van meer klanten en Google-rankings zorgen zijn die je graag zou willen aanpakken op een website en je wilt opvallen bij de concurrentie, dan raad ik ten zeerste aan om iemand te vinden om een statische website voor je te laten maken (zoals ik!). Denk er op deze manier over na, iedereen kan gewoon verf kopen en zijn eigen huis gaan verven. Maar niet iedereen zal het met dezelfde kwaliteit kunnen doen als een professional, en hun huis zal daaronder lijden en er verschrikkelijk uitzien. Net als schilderen is webontwikkeling een vak en kan het wat duur zijn. Het laten bouwen van een statische site door een ontwikkelaar kan variëren van €1800 tot €3000 of meer, afhankelijk van de complexiteit. Dus het is natuurlijk verleidelijk om paginabouwers te gebruiken en geld te besparen door het zelf te doen. Daar is niets mis mee! Maar als je je bedrijf naar het volgende niveau wilt tillen, stop dan met geld laten liggen en overweeg om een statische site te laten maken. Maak iets dat veel beter presteert en een streepje voor heeft op de concurrentie.
En er zijn ontwikkelaars die aangepaste WordPress-sites maken en goed werk leveren en om geven wat ze doen. Ik zeg niet dat ALLE WordPress-websites of ontwikkelaars bedriegers zijn of slechte producten maken. Die zijn nog steeds helemaal oké om te gebruiken en hebben hun doeleinden. Als je een website nodig hebt die een database moet hebben en honderden pagina's dynamisch moet kunnen bouwen, afhankelijk van de inhoud die de bezoeker opvraagt, dan is dat waar WordPress uitblinkt. WordPress is geweldig voor mensen die hun eigen inhoud willen bewerken, een online winkel willen opzetten, een blog willen schrijven en bewerken, aangepaste toepassingen of datamanipulatie, en alles wat een database nodig heeft. Statische sites zijn precies dat - ze zijn statisch, onveranderlijk. Ze zijn perfect voor websites die alleen informatie hoeven weer te geven. Ze slaan het niet op, manipuleren het niet en genereren geen nieuwe inhoud individueel voor elke bezoeker. Wordpress gebruiken om een strikt informatieve site te maken, is als een breekhamer gebruiken om een spijker in te slaan.
Waarschijnlijk heeft jouw concurrentie ook een WordPress-site. Sommige ontwikkelaars of bureaus rekenen duizenden euros aan om deze eenvoudige WordPress-sites te maken die statisch hadden kunnen zijn, en veel daarvan zijn gewoon template fabrieken die ze aan je overhandigen zonder ondersteuning, snel en efficiënt. Dus het vinden van een goede ontwikkelaar of bureau kan moeilijk zijn, maar het zal de moeite waard zijn. Je moet gewoon wat tijd besteden om de slechte van de goede te scheiden.
Investeren in je website
Op basis van mijn ervaring zijn er twee soorten mensen: bedrijfseigenaren en ondernemers. Een van de meest voorkomende fouten die bedrijfseigenaren maken als het gaat om een website, is dat ze het zien als een uitgave in plaats van een investering. Ondernemers begrijpen dat wanneer je geld uitgeeft aan het bedrijf, het een investering IN het bedrijf is, geen uitgave, en kunnen de waarde ervan rechtvaardigen door te kijken naar het rendement dat die investering zal opleveren. Bijvoorbeeld, je koopt een website van een ontwikkelaar voor €3000 om een statische site voor je te maken. Lijkt veel, maar met een beter uitziende en beter presterende site kun je misschien bezoekers omzetten in klanten die de site anders zouden hebben verlaten omdat deze te lang duurde om te laden of er verouderd en slecht uitzag en je niet te vertrouwen leek. Opeens brengt die €3000 je na enige tijd jaarlijks €10.000 of meer aan nieuwe zaken. Als je €3000 kon uitgeven en er in een jaar €10.000 mee kon verdienen, zou je die "investering" dan doen? Ik weet dat ik die cijfers uit de lucht heb gegrepen, maar dat betekent niet dat het niet mogelijk is.
Websites zijn net als tatoeages - je krijgt waar je voor betaalt. Als je iets wilt dat in elkaar is geflanst en er generiek of verouderd uitziet, wat mensen misschien zal afschrikken, dan is dat wat je krijgt voor een €300 website van Marktplaats of Fiverr. Net zoals bij het vinden van een tatoeëerder, moet je wat onderzoek doen en gerenommeerde ontwikkelaars vinden die al je vragen kunnen beantwoorden en gewoon een hoogwaardig, mooi product kunnen maken.
Dus met al deze goedkope en snelle opties die beschikbaar zijn om een website te bouwen, is het belangrijk om te weten dat een geweldige website nooit uit dat prijsniveau zal komen. Het zou eigenlijk een afschrikmiddel moeten zijn. Als ik een operatie moest ondergaan, zou ik zeker de dokter die ik online vond niet vertrouwen om het te doen voor ongeveer €350 wanneer het overal elders €4000 kost. Het schreeuwt gewoon gebrek aan kwaliteit en gebrek aan moeite, en ergens langs de lijn slaan ze een paar stappen over om het zo snel mogelijk af te ronden om zoveel mogelijk geld te verdienen met zo min mogelijk inspanning. Jouw bedrijf verdient beter. Als je de goedkope site wilt, verwacht dan goedkope resultaten. Maar als je het goed gedaan wilt hebben, dan komt er een ontwikkelaar aan te pas.
Conclusie
Uiteindelijk komt het erop neer, of je nu kiest voor een statische site of een dynamische site, het draait allemaal om je budget en prioriteiten. Als je niet veel te besteden hebt aan een website en gewoon iets nodig hebt dat er is, dan is het prima om WordPress of Wix te gebruiken. Maar als je het budget hebt om iets te laten doen dat een stap hoger is en je online aanwezigheid kan maximaliseren, dan is het laten maken van een statische site je beste return on investment.