De evolutie van webdesign

Pas toen in 1995 de eerste browsers opdoken die een grafische interface hadden, en dus beelden konden weergeven, was er pas sprake van webdesign. Voordien werd er gewerkt op zwarte schermen en bleef de opmaak beperkt tot het ordenen van de tekens met symbolen en tabulatie. 

Zowat alle basisstructuren van de eerste websites werden gemaakt met tabellen in HTML. Vervolgens gingen webdesigners meerdere tabellen in elkaar inbedden, zodat statische met veranderende cellen gecombineerd konden worden. Hoewel die methode in de beginjaren erg succesvol was, wrong ze tegelijkertijd ook een beetje. Het was namelijk geen sinecure om die vrij fragiele en ingewikkelde structuren intact te houden. Oorspronkelijk waren tabellen dan ook bedoeld om structuur te geven aan een reeks cijfers. Voor webdesigners waren ze interessant om elementen verticaal uit te lijnen en omdat ze zowel in pixels als in percentages gedefinieerd konden worden. Die functionaliteit kwam het dichtst in de buurt van het 'grid' dat webdesigners de dag van vandaag gebruiken voor de opbouw.

HTML bleek op heel wat vlakken te beperkt om tegemoet te komen aan de eisen van webdesigners. Javascript was het antwoord op die leemte. HTML bleek te vaak onvoldoende om content op een dynamische manier aan te passen. Een pop-upscherm bijvoorbeeld, werd mogelijk dankzij Javascript. Het nadeel van Javascript is dat het als een laagje over de andere code komt te liggen en afzonderlijk ingeladen moet worden door een browser. Het werd iets te vaak gebruikt als oplapmiddel om een onderliggend probleem in de HTML-code te omzeilen.  Maar de mogelijkheden die Javascript bood, bovenop HTML, betekenden een belangrijke sprong voorwaarts voor het nog piepjonge World Wide Web.

Webdesigners bleven op technische hindernissen botsen om de ideeën die ze uitgetekend hadden om te zetten in code. Flash was in 1996 de nieuwe technologie die een ongeziene vrijheid beloofde. De webdesigner kon plots elke vorm, lay-out, animatie of interactie combineren in één tool. Het eindresultaat werd verpakt als één bestand en naar de browser gestuurd om weergegeven te worden. Dé voorwaarde was echter dat je browser de laatste Flash-plug-in geïnstalleerd had en vaak duurde het ook enkele momenten voor een Flash-element volledig ingeladen werd. Het gouden tijdperk voor zogenaamde 'splash'-pagina's was aangebroken. Elke surfer herinnert zich nog wel de drukke intro-animaties en allerlei interactieve effecten die vandaag niet meer gebruikt worden. Flash bleek uiteindelijk niet open genoeg en lastig te integreren in zoekmachines. Bovendien gebruikte het heel wat (grafisch) geheugen. Flash verloor geleidelijk aan zijn populariteit en toen Apple bij de lancering van zijn eerste iPhone in 2007 besloot om Flash niet te ondersteunen, betekende dat stilaan het einde van de technologie, tenminste wat webdesign betrof.

Ongeveer gelijktijdig met Flash werd er een andere techniek bedacht om structuur te brengen in webpagina's. Dat waren de Cascading Style Sheets (CSS). Het basisconcept: de inhoud (HTML) scheiden van de grafische presentatie (CSS). De eerste versies van CSS waren niet erg flexibel, maar het grootste probleem was dat browsers CSS maar heel geleidelijk aan gingen ondersteunen. Dat duurde vervolgens nog enkele jaren. Dat was voor webdevelopers een echte nachtmerrie, want zo waren er browsers die de nieuwste functies ondersteunden, terwijl anderen nog op zich lieten wachten. Voor alle duidelijkheid: CSS is geen programmeertaal, maar eerder een beschrijvende, declaratieve taal.

Een noodzakelijke techniek voor de gebruikservaring op smartphones kwam er in 2007, met 'grids'. De hoeveelheid aan schermvormen en resoluties zorgde ervoor dat surfen op een mobiele telefoon een heuse uitdaging was. Ook webdesigners zaten met de handen in het haar. Moet het uiterlijk van de desktop-website behouden blijven of moeten we het noodgedwongen kaal plukken? En wat met advertenties? Data en downloadsnelheid waren in de beginjaren van mobiel internet ook een probleem, want extra datapakketten kopen kostte de gebruiker nog handenvol geld. 

Een eerste stap richting mobielvriendelijk browsen was de grids met kolommen. Uiteindelijk werd een grid met 12 kolommen de standaard waar webdesigners vandaag nog mee werken. Vervolgens werd er een standaard bedacht om formulieren, navigatieknoppen, enz. te verpakken als herbruikbare elementen. Er werd als het ware een bibliotheek aangelegd van visuele elementen met hun code. Bootstrap en Foundation zijn de belangrijkste databanken. 

Ethan Marcotte gaf de oorspronkelijke aanzet tot responsive webdesign. Hij veegde de bestaande aanpak van tafel en ging dezelfde content toepassen op verschillende lay-outs voor één design. Marcotte bedacht in één adem de term 'responsive webdesign'. Hoewel er nog steeds HTML en CSS gebruikt wordt, is het responsive karakter een eerder conceptuele vernieuwing. Toch bestaan er heel wat misverstanden rond.

Voor een webdesigner betekent het de opmaak van verschillende lay-outs, terwijl het voor de gebruiker gewoon aangeeft dat een website zal werken op zijn mobiel toestel. Voor een programmeur betekent het op welke verschillende manieren beelden op de server terechtkomen, welke downloadsnelheid van toepassing is, of mobiel dan wel desktop-versie de voorrang krijgt, enz. Het grote voordeel van responsive webdesign is dat het altijd over dezelfde website gaat die overal, op elk toestel, werkt. 

Meerdere lay-outs ontwerpen neemt nu eenmaal meer tijd in beslag. Gelukkig werd dat proces vergemakkelijkt door zogenaamd 'Flat Design'. Flashy effecten en opvallende schaduwen moesten baan ruimen voor sterke fotografie, typografie, scherpe illustraties en weloverwogen lay-outs. Het grote voordeel is dat goeie copy en sterke teksten belangrijker geworden zijn. Blinkende knoppen werden vervangen door plattere icoontjes en dat laat webdesigners toe vectorafbeeldingen en symboollettertypes te gebruiken.

Langzaamaan evolueren we nu naar systemen waarbij webdesigners almaar flexibeler kunnen werken. Ze hoeven steeds minder hun hoofd te breken over technische problemen rond compatibiliteit, maar kunnen focussen op het effectieve webdesign. Voorbeelden daarvan zijn de nieuwe units in CSS (viewport height en width), die een veel flexibelere positionering van elementen toelaten. Flexbox is eveneens een onderdeel van CSS dat webdesigners toelaat meerdere lay-outs te maken en ze aan te passen met één enkele eigenschap, in plaats van telkens een hele hoop code te moeten schrijven. En dan zijn er ook nog de webcomponenten die gebundeld worden in de vorm van een galerij, inschrijvingsformulier, enz. Vervolgens kunnen die als bouwstenen steeds opnieuw toegepast en eenvoudig geüpdatet worden.

Hypertext Markup Language (HTML) werd in 1991 in het leven geroepen door Sir Tim Berners-Lee. Pas in 1995 werd het officieel gepubliceerd als HTML 2.0. HTML is de standaard-opmaaktaal voor documenten die ontworpen zijn om weer te geven in een webbrowser. Ze kan aangevuld worden door andere technologieën zoals de Cascading Style Sheets (CSS) en JavaScript. 

HTML is een steeds evoluerende opmaaktaal. Elke versie ging een stapje verder en zette almaar mooiere websites met steeds hogere standaarden op het net. Een overzicht.

HTML 1.0  werd gelanceerd in 1993 met de bedoeling om informatie te delen die leesbaar en toegankelijk werd via webbrowsers. Er werden maar weinig ontwikkelaars bij betrokken, met als gevolg dat de opmaaktaal niet meteen evolueerde.

In 1995 volgde HTML 2.0, dat alle features van HTML 1.0 bevatte en daarop voortbouwde. Een aantal belangrijke features werden verder verfijnd. HTML 2.0 bleef de standaard-opmaaktaal voor het opzetten en designen van websites tot januari 1997. 

Webspecialist Dave Raggett deed in een paper een aantal suggesties over HTML, waarmee hij de aanzet gaf tot HTML 3.0. Het kreeg sterkere eigenschappen en webdesigners zagen de mogelijkheden toenemen. Deze krachtige features hadden als nadeel dat browsers trager gingen werken.

HTML 4.01 was een belangrijke stap voorwaarts en deze succesvolle versie van HTML werd jarenlang gebruikt, tot HTML 5 in 2012 de fakkel overnam. Die laatste kan worden beschouwd als een uitgebreide versie van HTML 4.01.

Webdesigners & webdevelopers

Webdesigners en webdevelopers hebben niet dezelfde functie, maar ze werken wel nauw samen. De webdesigner is verantwoordelijk voor de visuele aspecten, zoals de lay-out, de samenstelling van de kleuren en de typografie. Daarbovenop hebben webdesigners een grondige praktijkkennis van HTML en CSS. De taak van een webdeveloper gaat dieper op technisch vlak. De technische kennis van een webdesigner kan wel verschillen. Vooral in kleinere ondernemingen zal de webdesigner ook moeten kunnen programmeren om de website in de lucht te houden. Grotere bedrijven kunnen zich een webdesigner veroorloven die zich uitsluitend met het visuele aspect bezighoudt.

Design van de homepage

Experts als Jakob Nielsen hebben vaak het belang van de homepage of startpagina benadrukt. Volgens hen is het zonder twijfel de belangrijkste pagina van een website. Vanaf de jaren 2000 klonken vanuit de praktijk tegengeluiden. Het aantal bezoekers dat de homepagina leek te omzeilen en rechtstreeks op andere pagina's belandde, via zoekmachines, nieuwsbrieven en RSS-feeds, nam toe. Het tegenovergestelde durfde wel eens beweerd te worden: dat de homepagina de minst belangrijke is van de hele website. Toch mag het duidelijk zijn dat de homepage het uithangbord blijft van een website en in commercieel opzicht ook niet zomaar genegeerd kan worden.



Vanaf 2012 werden de zogenoemde carrousels of 'sliders' populair. In een beperkte ruimte kunnen webdesigners updates en de op dat moment meest relevante content in de kijker zetten. Tegenstanders vinden het geen efficiënt webdesign en zeggen dat het de optimalisatie van een website in zoekmachines schaadt. Tevens blijft het de vraag of een carrousel een goede uitnodiging is tot doorklikken.

Een smart site is een responsive website die hoog scoort in Google en die al uw berichten automatisch doorplaatst naar de belangrijkste sociale media zoals Facebook, Twitter, LinkedIn, Pinterest, Flipboard, Google+ en vervolgens in een geautomatiseerde nieuwsbrief (mailing) uitstuurt naar uw contacten. Zo bent u altijd en overal in één handeling up-to-date. We sommen hier de 12 redenen op waarom een smart site de juiste keuze is voor uw bedrijf.

1 Een smart site heb je voor altijd. Je hoeft slechts 1-malig te investeren

Een website heeft, net als een smartphone of een computer, een bepaalde levensduur. Gemiddeld om de 5 à 6 jaren wordt opnieuw geïnvesteerd in een nieuwe website. En dat wil in de meeste gevallen zeggen dat er vanaf 0 terug aan begonnen moet worden.

Met onze manier van werken hoeft u slechts 1-malig te investeren in de opbouw en het vullen van een website. Die kan dan om de zoveel tijd goedkoop voorzien worden van een nieuwe look en feel en de noodzakelijke nieuwe technieken. Maar het harde werk - namelijk het vullen van de site - hoeft nadien nooit meer opnieuw te gebeuren.

2 Geen onderhoudscontract nodig

Dit is iets wat een bedrijf hoort te verdienen door zich steeds opnieuw in te zetten en te bewijzen. Wij werken niet met onderhoudscontracten of contracten op lange termijn. Wij moeten het hebben van tevreden klanten die graag met ons samenwerken.

• Geen maandelijkse kosten
• Geen vervelende contracten

Als u tevreden bent blijft u bij ons. En als u niet tevreden bent kan u weer gewoon ergens anders naartoe. Alles wat wij voor u maken of ontwerpen is dan ook uw eigendom. Geen addertjes onder het gras, geen wurgcontracten en geen lange termijn gedoe. Als u tevreden bent zijn wij dat ook. Met sommige klanten werken we al meer dan 10 jaar samen.