Debuggen voor dummies: zo doe je het goed

Inhoudsopgave van dit blog

• Wat is debuggen voor dummies
• Wanneer debuggen wij
• Debuggen in de development omgeving
• Debuggen in de live omgeving
• Zo debuggen wij bij Stoere Binken Design
• Hoe debug jij als klant
• Bugs zijn alleen maar lastig – meer niet
• Debuggen fase afsluiten

Wat is debuggen voor dummies

Bij de ontwikkeling van de website wordt het door Stoere Binken Design gemaakte ontwerp omgezet naar html (bron)code. Dan koppelen we het WordPress Content Management Systeem zodat de website gevuld kan worden.
Tijdens deze fase kan er altijd wat fout gaan, of niet meteen perfect geprogrammeerd zijn. Dit is heel normaal. Het gaat om duizenden regels code, veel technieken, animaties, effecten, externe data koppelingen, etc. 

Wij realiseren dat het debuggen van een website voor sommige klanten erg technisch of verwarrend kan overkomen. Deze ‘Debuggen voor dummies’ pagina is onze ondersteuning (met een knipoog) bij dit traject.

Wanneer debuggen wij

Tijdens de ontwikkeling van de website zijn er twee fases waarin we bij Stoere Binken Design debuggen. 

• Demo omgeving: de website staat op onze server
• Live omgeving: de website staat online bij jouw eigen hosting aanbieder

Laten we beide fases doornemen zodat jij het verschil begrijpt.

Debuggen in de development omgeving

De belangrijkste debug fase is in de development omgeving, ook wel ‘staging omgeving’ genoemd. We zijn vol in ontwikkeling en finetunen aan alle kanten de werking van de website. Nog niets is definitief, dus feedback op wat wel of niet goed werkt is zeer welkom.

Hoe moet jij als klant de development omgeving beoordelen én evalueren? Hier onze tips zodat jij weet wat wij nodig hebben om jouw site optimaal te kunnen debuggen:

• De development site is nog niet af, dus er zullen nog oneffenheden in zitten. Dit is heel normaal en geen reden tot onrust. We fixen alle bugs!
• Beoordeel de development site altijd aan de hand van het goedgekeurde webdesign. Wat daar niet in zit, zit ook niet in de development site.
• Animaties en effecten voegen we pas helemaal aan het einde toe. Deze zijn een belangrijk onderdeel van de beleving en we besteden hier veel aandacht aan.
• Je kunt de dingen die jij ziet via ons project management software doorgeven. Als het beter bij jouw werkwijze past dan kan dit ook via email.

Als de website in de development omgeving goed werkt, dan werkt het vrijwel zeker ook probleemloos bij jouw eigen hosting aanbieder. Om 100% zeker te zijn debuggen we de website ook nog op de live omgeving.
We sluiten debuggen in de development omgeving af en debuggen daarna uitsluitend nog issues die met de nieuwe hosting omgeving te maken hebben.

Debuggen in de live omgeving

Nadat we alle bugs uit de development omgeving gefixt hebben, gaat de site live bij jouw eigen hosting aanbieder. We houden nog een vinger aan de pols, mochten er kleine bugs opduiken die nog geplet moeten worden. Elke server omgeving is anders, dus door de switch naar de live omgeving kunnen kleine dingen nog niet optimaal werken. We pakken uitsluitend issues aan die met jouw hosting aanbieder te maken hebben. Ontwerp issues vallen nu niet meer onder het debuggen omdat de site live is.

Zo debuggen wij bij Stoere Binken Design

Wij hebben onze eigen methodes en workflow ontwikkeld om zo goed mogelijk te debuggen. Wij willen dat onze websites perfect zijn en jij er succesvoller mee kunt zijn. 
Hier een overzicht van de punten waar we bij Stoere Binken Design op letten tijdens dit proces:

• Wij programmeren op een Mac en testen tijdens de ontwikkeling alles in Chrome, Safari en Firefox. Dit zijn de meest gebruikte browsers. Als het hierop werkt, dan geheid ook op de overige browsers.
• Wij debuggen in een Mac en (virtuele) Windows omgeving.
• Wij debuggen op de meest gebruikte schermformaten (statistieken 2019) van desktop tot smartphone. Wij doen dit in een digitale omgeving. Het is niet realistisch om hiervoor alle fysieke apparaten in huis te hebben. 
• Wij testen en debuggen de volgende schermformaten:
  – Extra large devices (desktop): 1200 x 700 px
  – Large devices (desktop): 992 <-> 1200 x 700 px
  – Medium devices (tablet): 768 <-> 922 x 1024 px
  – Small devices liggend (smartphone): 544 <-> 768 px breed
  – Extra small devices staand (smartphone): -544 px breed
• Internet Explorer debuggen wij niet meer. Microsoft heeft zelf de ondersteuning voor deze browser beëindigd. We debuggen Microsoft Edge natuurlijk wel.

Hoe debug jij als klant

Iedere computer is anders. Iedere werkomgeving is anders. Veel van onze klanten werken met laptop PC’s in een Windows omgeving. Sommigen zelfs met computers die met een bedrijfsnetwerk gekoppeld zijn, met instellingen die door een IT afdeling afgedwongen worden. Dan is het heel moeilijk om de oorzaak van bugs te analyseren en op te lossen, omdat die bij andere gebruikers vaak niet eens opduiken.

Daarom hebben we bij Webdesign Bureau Stoere Binken Design Maastricht een aantal regels opgesteld hoe jij als klant moet debuggen. Pas als jullie bugs aan deze voorwaarden voldoen kunnen we ze aannemen:

• Het debuggen gebeurt hoofdzakelijk op de development omgeving. Na het lanceren van de site debuggen we op de live omgeving uitsluitend issues die met de nieuwe hosting omgeving te maken hebben, niet het ontwerp.
• Gebruik voor het debuggen van de website een neutrale computer, alsof die zo uit de verpakking komt. Het is belangrijk dat op de computer geen persoonlijke instellingen gedaan zijn. Denk daarbij aan het schalen van beeldscherm resolutie, extra browser werkbalken, server verbindingen zoals VPN, etc. Issues die ontstaan uit persoonlijke instellingen kunnen wij niet debuggen.
• Bij het debuggen op de development omgeving gaat het uitsluitend om issues m.b.t. het (geprogrammeerde) ontwerp. Veranderingen aan het reeds goedgekeurde ontwerp vallen buiten het debuggen. Dit zijn veranderingen die we als extra project zullen oppakken en kunnen wellicht ook niet meteen gefixt worden.
• Geef door op welk besturingssysteem een bug optreedt.
• Geef door op welke computer een bug optreedt.
• Geef door wat voor (externe) beeldschermen met welke formaten jullie gebruiken.
• Stuur van elke bug screenshots en/of een computer log bestand mee.
• Wis zo vaak mogelijk het browser cache in Google Chrome onder de Instellingen > Geavanceerd > Browsergegevens wissen. 
• Gebruik bij voorkeur één van deze Google Chrome plugins om je browser cache te wissen:
  Clear Cache van Benjamin Bojko
  Web Developer van Chris Pederick

Jouw bugs op Active Collab

Als wij websites ontwikkelen dan werken we altijd met Active Collab, onze project management software. Hierin staan alle bug lijsten van jouw website. We zullen je hier ook taggen zodat je bij de ontwikkeling betrokken blijft. Je kunt aan discussies deelnemen, input geven en zien wat de status van het debuggen is.

Log in op jouw persoonlijke Active Collab account van Stoere Binken Design om het debuggen van jouw website te volgen.

Bugs zijn alleen maar lastig – meer niet

De meeste bugs die we op je site pletten zijn alleen maar lastig en geen belemmering voor de lancering van je website. Uiteraard moet je site perfect zijn voordat we lanceren, maar de meeste bugs kunnen we probleemloos later nog fixen.
Het kan zelfs zijn er nog bugs optreden als we de development site overzetten naar de live omgeving. Technische systemen storen elkaar heel snel, dus dit verhelpen we ook.

Debuggen fase afsluiten

Als alle bugs geplet zijn, dan sluiten we de web development van de website. Dan is de website officieel af en dragen we de gebruiksrechten en verantwoordelijkheid over aan jullie. Stoere Binken Design is vanaf dat moment niet meer verantwoordelijk voor de website. We ondersteunen jullie natuurlijk altijd graag zodat je optimaal van je website kunt genieten.
We sluiten ook het project op Active Collab. Jullie kunnen dan niet meer inloggen. Het project blijft wel bestaan, voor vervolgopdrachten en als archief.

Verdere aanpassingen en uitbreidingen zullen we als nieuw project oppakken. Hiervoor maken we altijd een offerte en tijdpad.