Uw site moet werken zoals bedoeld was toen u deze voor het eerst bouwde. Anders zullen uw gebruikers uiteindelijk het vertrouwen in uw merk verliezen, wat resulteert in verlies van inkomsten en leads. 67% van de consumenten noemt slechte ervaringen als reden voor verloop. 4% van de klanten klaagt rechtstreeks bij een bedrijf over een slechte ervaring, en 91% van de ontevreden klanten zal gewoon vertrekken zonder hun klachten te uiten.

Het Systems Sciences Institute bij IBM heeft gerapporteerd dat “de kosten om een fout te herstellen die na de productlancering wordt gevonden vier tot vijf keer zo hoog waren als een fout die tijdens het ontwerp werd ontdekt, en tot 100 keer meer dan een fout die in de onderhoudsfase werd geïdentificeerd.”

Het World Quality Report heeft aanbevolen dat bedrijven het QA-budget op 25% van de ontwikkelingskosten houden. Hun universele aanbeveling komt voort uit een begrip van wat “redelijk” is om kwaliteit en veiligheid te behouden en de klantervaring te verbeteren, terwijl het potentieel voor nieuwe ontwikkeling niet wordt vertraagd.

Of je website nu een affiliate website, lokaal bedrijf, SaaS, of een eenvoudige HTML-site is, wanneer mensen fouten zien, zullen ze graag op de terugknop klikken en je zult ze nooit meer zien.

Met dit artikel zullen we leren over het concept van site kwaliteitsborging, het belang ervan, hoe het verschilt van testen, hoe je ervoor kunt zorgen dat je site van hoge kwaliteit is, enkele beste praktijken om te volgen, en een QA-checklist die je kunt aannemen om je werk gemakkelijker te maken.

Wat is website QA?

Website QA (Quality Assurance) kan worden gedefinieerd als het proces van het testen van een website om fouten, vergissingen of over het hoofd geziene zaken te ontdekken die mogelijk niet zijn opgemerkt tijdens de webontwikkeling of -ontwerp voordat de site live gaat. Het wordt ook wel QA-testing genoemd. Merk op dat QA veel eerder begint, zelfs voordat de ontwikkeling begint. Het begint zodra de vereisten voor de website zijn opgesteld en culmineert in testen. De overkoepelende zorg is de kwaliteit van de gehele site, wat veel verder gaat dan alleen het oplossen van bugs.

website testing

Hoe verschilt QA van andere testtypen?

Zoals we al zeiden, QA is een proces, geen eenmalige taak. Hier is hoe het verschilt van andere testtypen:

QA vs gebruikerstesten

Het is belangrijk om onderscheid te maken tussen kwaliteitsborgingstesten en gebruikerstesten. Beide kunnen dezelfde doelen nastreven (geweldige gebruikerservaring - UX en correcte websitefunctionaliteit), maar er zijn verschillende verschillen tussen hen.

Gebruikerstesten is simpelweg observeren en analyseren hoe gebruikers daadwerkelijk de website gebruiken en ermee omgaan en hun mening over de ervaring die ze krijgen tijdens het gebruik ervan. Het omvat ook het vinden van wat onduidelijk is en wat verwarrend kan zijn voor de gebruiker. Uiteindelijk is er een vergelijking tussen de gebruikerservaring en het daadwerkelijke gebruik van de website en het beoogde gebruik en de verbeelde gebruikerservaring van de ontwikkelaar en de webmaster.

QA verschilt van gebruikerstesten doordat het wordt gedaan voordat de website wordt gepubliceerd, en dat het wordt gedaan door een QA-tester (niet door gebruikers). De tester simuleert verschillende gebruikersacties op de site om te zien of ze werken zoals bedoeld.

De twee (QA en gebruikerstesten) zijn echter complementair, en de gegevens of feedback verzameld uit beide processen is essentieel om ervoor te zorgen dat de website werkt zoals bedoeld en dat UX-standaarden zijn bereikt.

QA vs functioneel testen

Functioneel testen kan worden gedefinieerd als een QA-proces gebaseerd op de gespecificeerde ontwerpeisen van het specifieke component dat wordt getest. Het omvat het invoeren, of voeden, van input en vervolgens het analyseren van de output.

QA, aan de andere kant, is niet beperkt tot een bepaald component of gespecificeerde ontwerpeisen. QA zorgt ervoor dat de hele site van goede kwaliteit is, van hoe het functioneert tot hoe aantrekkelijk het is voor de gebruiker. Het omvat ook testen voordat de site live gaat.

QA vs eisen testen

Vereisten testen houdt in dat de vereisten en verwachtingen van de klant worden gebruikt om de lay-out, het prototype of de alpha versie van een site te evalueren. QA komt binnen om de gebruikersspecificaties en vereisten zoals uiteengezet in ontwerpdocumenten goedgekeurd door de klant, evenals andere anderszins uitgedrukte vereisten, te analyseren. De specificaties worden vervolgens vereenvoudigd en geïntegreerd in verschillende ontwikkelingsfasen, en uiteindelijk gebruikt in vereisten testen.

QA vs design testing

Ontwerptesten onderzoekt hoe de site eruitziet en aanvoelt. QA komt binnen om te controleren of het uiterlijk en gevoel in lijn is met de gedocumenteerde lay-out en ontwerp.

Andere testtypen:

Regressietesten - evalueren of wijzigingen op uw site andere delen van de site beïnvloeden. Het controleert of wijzigingen in de code bijvoorbeeld de site breken.

Integratietesten - dit is het testen of diensten of bronnen van derden werken zoals verwacht wanneer ze zijn geïntegreerd met uw site. Deze diensten kunnen API's omvatten.

Prestatie testen - dit test of de site verkeerspieken en -stijgingen aankan. Deze test kan ook omvatten hoe snel de site laadt.

Er zijn veel meer tests die je kunt doen op je QA-testen. Leer meer over website test types hier.

Waarom is het belangrijk?

Website QA is gericht op het waarborgen dat de gebruikersinterface (UI) van de website functioneert zoals bedoeld (er zijn geen bugs). Het zorgt er ook voor dat een geweldige gebruikerservaring wordt bereikt. Hier zijn de andere voordelen van QA testen:

  • Toont uw merk als betrouwbaar. Wanneer alles op uw site werkt zoals het hoort, associëren klanten uw merk met uitmuntendheid. Ze zullen daarom uw producten willen kopen, betalen voor uw diensten, en geassocieerd willen worden met uw merk.
  • Het zou problemen kunnen onthullen die ernstige gevolgen kunnen hebben, bijvoorbeeld een kritieke beveiligingskwetsbaarheid.
  • Maakt de levering van een betrouwbare site mogelijk. Je bent zeker van hoe je site zal presteren, dus er zijn minimale zorgen over inconsistenties.
  • Het bespaart het bedrijf uiteindelijk geld en tijd die verloren zouden zijn gegaan bij het oplossen van bugs lang nadat de site is gepubliceerd. Het is ook goedkoper om een bug te verhelpen voordat de site is gepubliceerd dan daarna. Er zullen geen gebruikers worden getroffen, je hebt geen behoefte aan je klantenservice om aan gebruikers uit te leggen waarom de site niet werkt zoals verwacht, en je hoeft de site niet ‘uit te schakelen’ voor reparaties, waardoor je verkeer en zaken verliest.

Hoe website QA testen uit te voeren

QA is geen geringe prestatie. Tijd en geld moeten worden geïnvesteerd om ervoor te zorgen dat een site van hoge kwaliteit aan de gebruikers wordt geleverd. Afhankelijk van de complexiteit van de site en de projectdetails, kan QA tot 50% van de budgettoewijzing nodig hebben.

Om website QA effectief uit te voeren, moet je een proces definiëren dat gedurende de testfase zal worden gevolgd. Dit proces wordt gewoonlijk de QA-processtroom genoemd. De processtroom verdeelt de hoeveelheid tijd die nodig is per testfase, afhankelijk van het beschikbare budget en de prioriteit.

strategie

Factoren om te overwegen bij het ontwerpen van een QA-processtroom

Er zijn verschillende factoren die je moet overwegen bij het ontwerpen van een QA-processtroom. Deze omvatten:

Publiek

Voordat je zelfs maar begint na te denken over de site, moet je nadenken over voor wie je deze bouwt. Dit zal je helpen de juiste platforms te definiëren die je doelgroep het meest gebruikt. En dit zal van pas komen om de testomgevingen te beperken, bijvoorbeeld de browsers die je moet gebruiken en de apparaten die je moet testen.

Toepassingstype

mobiele testen

Je moet rekening houden met het type applicatie dat je aan het testen bent, aangezien de testbenaderingen verschillen afhankelijk van het type site. Is je site statisch of dynamisch? Ga je een mobiele site testen?

Testspecificiteit

De test moet goed gedefinieerd en beschreven zijn, en één scenario behandelen waarbij de uitkomst duidelijk gedefinieerd is. Definieer de aannames en voorwaarden. Gebruik zoveel mogelijk ‘echte gegevens’ (gegevens die zo dicht mogelijk bij de gebruikersinvoer liggen).

Risiconiveau

Bouw je een site met een hoog of laag risico? Het risiconiveau hier wordt bepaald door de functionaliteit van de site en de industrie. Bijvoorbeeld, als je site gebruikersinformatie verzamelt, dan moet je testen of de ingevoerde informatie correct is. Bovendien moet je testen op de privacy van de informatie. Als financiële transacties via je site worden uitgevoerd, dan moet je grondig testen op veiligheid.

Aan de andere kant, voor een statische site, moet de nadruk liggen op de UI (gebruikersinterface) en functionaliteit.

Geschat aantal gebruikers

Werken met een geschat aantal gebruikers helpt bij prestatietests. Dit controleert de stress en belasting (of het verkeer) dat de site tegelijk kan verwerken tijdens een piek in het verkeer.

Tools om te gebruiken

Je moet nadenken over de testtools die je gaat gebruiken. Je hebt mogelijk verschillende tools nodig voor verschillende testtypes of -fasen. Je hebt mogelijk verschillende tools nodig voor cross-browser testing en andere voor prestatie testing. Bepaal hoeveel automatisering je moet gebruiken. Je kunt tools gebruiken die delen van je testen automatiseren, bijvoorbeeld, zoals de CloudQA tool die regressietesten automatiseert.

Het platform waarop de site wordt geopend

Als de site bedoeld is om te worden geopend op verschillende platforms of browsers, moet je rekening houden met cross-platform testen.

QA beste praktijken

Er zijn een aantal dingen die je moet doen om je QA-processtroom effectief te implementeren. In dit gedeelte kijken we naar QA best practices:

  • Definieer de gebruikers die het eindproduct zullen gebruiken.
  • Volg je checklist voor elke testfase of -type.
  • Testen met behulp van een staging site (een site die de echte site simuleert).
  • Plan de hoeveelheid tijd die elke testfase moet duren.
  • Test zo vroeg mogelijk - test nieuwe functies zodra ze zijn toegevoegd.
  • Gebruik een agile QA benadering (test aan het einde van verschillende stadia van ontwikkeling).
  • Geef prioriteit aan het oplossen van bugs, afhankelijk van hoe cruciaal ze zijn voor de functionaliteit van je site.
  • Automatiseer waar mogelijk, vooral de risicovolle delen van de site. Automatiseer echter niet ‘te veel’. Geef prioriteit aan het testen van de delen waar automatisering het beste zou passen.
  • Streef ernaar om een samenwerkingsaanpak te creëren tussen je QA-team en het ontwerp-/ontwikkelingsteam.
  • Maak een site mindmap, een visueel hulpmiddel dat je helpt de structuur van je site te zien om een idee te krijgen van de omvang van het werk en de onderdelen te identificeren die je moet prioriteren.

Welke tools kun je gebruiken voor je website QA?

gereedschap

QA kan een ontmoedigend proces zijn als het handmatig wordt gedaan. Zoals we al eerder hebben vermeld, moet je automatiseren waar nodig en waar mogelijk. Het is gemakkelijk om je site op je browser en PC te testen en te denken dat het er geweldig uit zal zien en zal presteren zoals verwacht op alle browsers en apparaten, en dat gebruikers intuïtief zullen weten wat te doen. Je moet mogelijk een set tools gebruiken om je te helpen bij het testen van verschillende fasen van je QA-proces. Hier zijn de tools die je kunt gebruiken om je QA-testen gemakkelijker te maken:

TestRail

TestRail is volledig webgebaseerde testsoftware met realtime inzichten om je te helpen je voortgang bij te houden. Je kunt het in de cloud gebruiken of downloaden. De tool integreert gemakkelijk met testautomatiseringstools.

CrossBrowserTesting

Deze cloud-gebaseerde tool wordt gebruikt om tests uit te voeren op zowel mobiele als desktopbrowsers. Er zijn meer dan 2050 browsers beschikbaar voor testen. Het zal handig zijn voor compatibiliteits- en regressietesten. Wordt geleverd met een gratis proefperiode.

Webontwikkelaar Formulier Invuller

Als je formulieren op je site gebruikt, zelfs als ze zo eenvoudig zijn als een contactformulier, moet je testen of het formulier alleen het opgegeven type gebruikersinvoer toestaat, of het de juiste informatie verzendt, of zelfs of de gedeelde informatie (vooral als het persoonlijke gebruikersinformatie is) wordt weergegeven in de browser-URL. Bekijk de chrome extension form filler.

De Web Developer Form Filler tool laat je de functionaliteit van een formulier testen. Alles wat je hoeft te doen is de waarden invullen die je in je invoervelden wilt hebben, en de tool zal deze dan automatisch voor je invullen. Op deze manier kun je je formulieren sneller testen.

Ranorex Webtestit

Deze tool is ideaal voor UI testen op verschillende browsers en besturingssystemen (Mac, Android, Windows en Linux). Met Ranorex kun je alle tests uitvoeren op je lokale pc of desktop. Het wordt geleverd met een gratis proefversie en ingebouwde testrapportage.

Venster Resizer

Window Resizer is een Chrome-extensie die je helpt visualiseren hoe je site eruitziet bij verschillende venstergroottes. Deze tool stelt je in staat om de meest gebruikte formaten voor zowel desktop als mobiel te testen. Je kunt ook aangepaste schermformaten toevoegen. De tool geeft je inzicht in content die zou moeten wordenboven de vouw, en suggesties om je scherm er beter uit te laten zien op verschillende schermformaten.

CloudQA

CloudQA tool is geschikt voor gebruik door alle niveaus van testers, zelfs degenen zonder technische ontwikkelings- of ontwerpvaardigheden. Je kunt het gebruiken voor regressietesten en het geeft directe feedback. Het is in staat om honderden tests tegelijkertijd uit te voeren in verschillende browsers. Hun prijsmodel is dat je alleen betaalt voor wat je gebruikt. Je kunt de tool zelfs gebruiken als een browserextensie om je tests op te nemen.

SEOptimer

Deze tool komt goed van pas voor SEO-testen. Het voert een site-audit uit om je te helpen identificeren wat je goed doet op het gebied van SEO, en de aspecten die verbetering behoeven om je site beter te laten ranken in zoekmachineresultaten.

Het is eenvoudig te gebruiken, zelfs als je niet veel SEO-kennis hebt. Het geeft je een update van de prestaties van je site en stelt je in staat om je rapport aan te passen aan je merk. Je kunt ook de taal kiezen waarin je je rapport wilt hebben.

Het is ook geïntegreerd met CRM's zoals MailChimp en Salesforce voor betere leadbeheer.

Website QA checklist

In deze sectie verkennen we een checklist die je kunt gebruiken bij het uitvoeren van je site QA. Hier is een samenvatting:

website testen

Beeldbron

Functioneel testen

Hier test je de functies van je site. Het is gemakkelijker om deze te testen als je een mindmap hebt die uiteenzet hoe je site zou moeten werken en eruit zou moeten zien. Zelfs als je geen mindmap hebt, zijn hier de aspecten om op te letten:

Controleer of deze werken zoals bedoeld. Dat ze daadwerkelijk het juiste type informatie verzamelen en indienen (voor formulieren) of mensen op de juiste manier doorverwijzen. Uw formulier validatie moet bevatten:

  • Verplichte velden mogen niet leeg worden gelaten.
  • Plaatshoudertekst om het voor gebruikers gemakkelijker te maken zich het type inhoud voor te stellen dat u wilt dat ze invullen, naast duidelijke instructies over het soort invoer dat u van hen verwacht, bijvoorbeeld wachtwoorden met ten minste 8 tekens, met cijfers, hoofdletters en speciale tekens.
  • Dat de verzamelde informatie veilig wordt opgeslagen (wachtwoorden worden bijvoorbeeld versleuteld voordat ze in de database worden opgeslagen).

Het procesverloop van uw site

Wat is de reis van de gebruiker door uw site? Heeft u een ideale reis die ze zouden moeten maken? De meeste gebruikersreizen beginnen met de homepage. Als u bijvoorbeeld kleding verkoopt, kan de gebruikersreis zijn van de:

homepagina >> categorieën >> specifiek product >> toevoegen aan winkelwagen >> aanmelden >> afrekenen

Is dat de reis die uw gebruikers daadwerkelijk maken? Of haken ze af zodra ze ‘aanmelden’ bereiken? Wat zegt dat over waar ‘aanmelden’ zou moeten zijn in het siteproces?

broken link checker seoptimer

Controleer of alle links werken en mensen naar de bedoelde locaties leiden. Een tool om te controleren op gebroken links zal hier van pas komen. Zorg ervoor dat er geen doodlopende pagina's zijn (pagina's zonder oproepen tot actie of links naar andere pagina's - ze vertellen gebruikers niet wat ze vervolgens moeten doen) en dat e-maillinks e-mails naar de juiste ontvangers sturen.

Lees ons artikel over Broken Links om meer te leren over hoe je ze kunt repareren.

Cookies

Cookies worden door een browser aangemaakt wanneer je een site bezoekt. Ze bevatten informatie zoals gebruikersvoorkeuren en hun inlogstatus. Hier is wat je QA moet controleren met betrekking tot cookies:

  • Dat ze niet actief zijn na de ingestelde ‘verval’ periode.
  • Dat ze versleuteld zijn voordat ze op het apparaat van een gebruiker worden opgeslagen.
  • Dat ze correct functioneren - om dit te doen, test wanneer cookies zijn ingeschakeld ten opzichte van wanneer ze zijn uitgeschakeld.
  • Hun impact op de beveiliging van je site - verwijder ze en controleer hoe dit de beveiliging van je site beïnvloedt.

Andere functionele tests

  • Controleer op syntaxisfouten.
  • Controleer op het bestaan van een sitemap, en of deze nauwkeurig is geïmplementeerd.

Prestatie testen

de snelheid van je webpagina controleren

Hier test je of je site in staat is om zware pieken in verkeer aan te kunnen en nog steeds te presteren zoals bedoeld. Hier is waar je op moet letten:

Hoe de site presteert tijdens:

  • Spikes in verkeer (stresstesten).
  • Toenemende werklast (loadtesten).
  • Normale werklast (stabiliteitstesten).
  • Meerdere gebruikerslogins (concurrentietesten).
  • Een toename van het datavolume in de database (volumetesten).
  • Een continue toename van de werklast (uithoudingstesten).

Andere prestatietests:

  • Laadsnelheid van de pagina (hoeveel tijd kost het om uw site te laden). Een prestatie-testtool zou hier van pas komen.
  • Hoe uw site presteert wanneer de gebruiker een trage internetverbinding heeft.

Beveiligingstesten

security testing Beeldbron

Hier is waar je op moet letten op het gebied van beveiliging:

  • Kunnen wachtwoorden worden ‘gekraakt’?
  • Worden gebruikers doorgestuurd naar versleutelde SSL-pagina's?
  • Hebben uw formulieren captchas? Werken ze zoals verwacht?
  • Kan een gebruiker inloggen zonder een wachtwoord of met een verkeerd wachtwoord?
  • Autorisatie - alleen geautoriseerde gebruikers kunnen toegang krijgen tot bepaalde delen van de site.
  • Zijn beperkte bestanden alleen downloadbaar door geautoriseerde en toegankelijke gebruikers?
  • Authenticatie - alleen een geverifieerde gebruiker mag inloggen en vervolgens toegang krijgen tot bepaalde delen of functies op uw site (hier is een verschil tussen authenticatie en autorisatie).
  • Wordt een gebruikerssessie beëindigd als deze een bepaalde tijd duurt, bijvoorbeeld een betaling die meer dan 10 minuten duurt?
  • Je kunt ook definiëren hoe een beveiligingsinbreuk eruit zou zien en deze simuleren om te zien hoe je site ermee om zou gaan (penetratietesten).

Compatibiliteitstesten

CSS CODE

Uw gebruikers zullen uw site openen op verschillende apparaten en platforms - browsers en besturingssystemen. Hier kunt u controleren hoe uw site eruitziet en presteert op verschillende apparaten en platforms. U moet controleren:

  • Hoe zien de afbeeldingen eruit?
  • Is je NAP (naam van de site of het bedrijf, adres en telefoonnummer) gemakkelijk toegankelijk?
  • Responsiviteit (ziet het er goed uit op mobiel vs desktop/pc? Op verschillende schermformaten? Heeft de gebruiker voldoende ruimte om op de links en knoppen te klikken? - onthoud dat op een kleiner scherm de gebruiker een knop zal aanraken om deze te ‘klikken’. Zijn de items op je site goed verdeeld op kleinere schermen?
  • Ziet je site er geweldig uit en presteert deze zoals verwacht op verschillende browsers en schermresoluties?

Inhoud testen

seoptimer crawl report

Hier evalueer je de inhoud van je site. Deze test zal nuttiger zijn als je je doelgroep al hebt gedefinieerd.

  • Dat de gebruikte kleuren overeenkomen.
  • Dat de lettergroottes die worden gebruikt ideaal zijn.
  • Dat de informatie logisch verloopt.
  • Heb je pagina's met dunne inhoud?
  • Voldoet je inhoud aan de gebruikersintentie?
  • Controleer op typefouten en grammaticale fouten.
  • Dat afbeeldingen geoptimaliseerd zijn met alt-tags.
  • Bevat het uw primaire [trefwoord]?
  • Wordt de belangrijkste informatie als eerste weergegeven?
  • Dat er geen dummy-inhoud meer op de site aanwezig is.
  • Dat de inhoud die bedoeld is om boven de vouw te staan, op de juiste locatie wordt weergegeven.
  • Controleer op afbeeldingen en video's. Worden ze goed weergegeven? Hebben ze enige inbreuk op het auteursrecht?

Gebruik onze website QA checklist voor uw behoeften, en voeg toe aan uw eigen checklist en pas deze aan zoals u dat wilt.

Ter conclusie

Website QA is een proces dat begint wanneer de sitevereisten worden opgesteld, en gaat door zelfs nadat de site is gelanceerd en in gebruik is. Dingen die moeten worden opgelost zullen in de loop van de tijd blijven opduiken, dus het is belangrijk om uw site routinematig te testen. Het is belangrijk om het QA-proces te definiëren en uit te stippelen voordat het testen begint, om het testen gemakkelijker, meer gefocust en inzichtelijker te maken. Tot slot, log de bugs en sla ze op voor toekomstige referentie wanneer u begint met het oplossen van de bugs of fouten die u bent tegengekomen.