Tables of Divisions?

Geplaatst op 24 november 2008 14:09 door Theo in Webstandaarden

Een aantal jaar geleden was het nog gebruikelijk om websites te ontwerpen met behulp van tabellen. Tegenwoordig is het gebruik van CSS in combinatie met divisions in opkomst. In deze blog worden de verschillen en overeenkomsten tussen beiden besproken.

Op het moment dat de eerste websites gebouwd werden (enkele tientallen jaren geleden) was er nog weinig tot geen sprake van verschillende besturingssystemen en browsers. Dit is vandaag de dag echter niet meer het geval. Er zijn namelijk een groot aantal verschillende besturingssystemen (bijv. Windows, MacOS, Linux) en minstens zo veel verschillende webbrowsers (bijv. Internet Explorer, Firefox, Opera, Safari, Chrome). Om er voor te zorgen dat er niet voor iedere browser een aparte versie ontwikkeld hoeft te worden, zijn er standaarden nodig en moet er goed nagedacht worden over de gebruikte technieken om de website op te bouwen. Eén van deze keuzes is het ontwikkelen met behulp van tables of met divisions in combinatie met Cascading Style Sheets (CSS).

Tables
De eerste websites die op het internet verschenen werden vooral gebruikt door onderzoekers en het leger om informatie uit te wisselen. Er was bij deze websites nog geen sprake van een grafisch ontwerp. In die tijd bestond een website grofweg uit een afbeelding, een rijtje links en een stukje tekst, welke zonder enige opmaak onder elkaar werden weergegeven. Het duurde echter niet lang voordat bedrijven en organisaties er achter kwamen dat het internet een uitstekend medium was om hun producten of diensten te verkopen. Websites werden nu bezocht door potentiële klanten en moesten hierom een verzorgde en professionele vormgeving hebben. Dit vormgeven gebeurde in eerste instantie met behulp van tables (tabellen). Door deze tables in elkaar te plaatsen, konden op relatief simpele wijze items naast elkaar geplaatst worden op het scherm. Zo was het nu bijvoorbeeld mogelijk om de menu-items naast de tekst te plaatsen. Hoewel deze methode een grote verbetering was ten opzichte van de ongestijlde websites van voor deze tijd, liepen ontwikkelaars al snel tegen de beperkingen van het gebruik van tabellen aan. De tables waren immers - zoals de naam als impliceert - bedoelt om tabellen op websites weer te geven en niet om de websites hiermee te ontwerpen. De grootste beperking van het opmaken met behulp van tables is dat deze opmaak niet flexibel is. Wanneer de posities van de verschillende onderdelen van de website vast liggen, is het ingewikkeld om deze later te veranderen. Een andere beperking ontstond door de ontwikkelaars zelf. Het was gebruikelijk om zaken als kleuren, afmetingen en tussenruimtes te definiëren in de tabel zelf, wat als resultaat had dat wijzigingen ook per tabel diende te gebeuren. Ook dit kwam de flexibiliteit en snelheid van ontwikkelen niet ten goede. Een oplossing waarbij er op één centrale plaats wijzigingen konden worden doorgevoerd aan een website waarvan ook de posities zijn aan te passen leek optimaal. Deze oplossing werd gevonden in het gebruikt van divisions in combinatie met Cascading Style Sheets (CSS).

Divisions in combinatie met CSS
Websites die opgemaakt worden met CSS maken normaal gesproken gebruik van een los bestand waarin alle opmaak en posities voor de website gedefinieerd zijn. In tegenstelling tot bij het gebruik van tables, liggen deze posities nu veel minder vast. De verschillende items worden nu namelijk gepositioneerd met behulp van zogenaamde divisions. Deze divisions kunnen gezien worden als gekleurde post-it notes die over een leeg blad (de website) versleept kunnen worden. Zo kan het menu eenvoudig aan de andere kant naast de tekst geplaatst worden door de post-it te verplaatsen. Ook de kleur van de division, het gebruikte lettertype en de eventuele randen of tussenruimtes kunnen eenvoudig en snel aangepast worden in het CSS-bestand. Ontwikkelaars begonnen de waarde van deze nieuwe methode in te zien. Zij zagen in dat de tijd die besteed diende te worden aan het leren van CSS zich in tienvoud terugbetaalde wanneer er nieuwe websites ontworpen of bijgehouden diende te worden. Ten slotte was het nu mogelijk om de website (bijvoorbeeld bij belangrijke feestdagen) op eenvoudige wijze een geheel andere uitstraling te geven. Dit kan gebeuren door slechts één bestand te vervangen. Zoals zichtbaar op de website CSS Zen Garden kunnen hiermee een enorm aantal verschillende ontwerpen gemaakt worden.

Conclusie
Uit bovenstaande tekst blijkt dat het ontwikkelen met behulp van tables zijn beste tijd gehad heeft. De flexibiliteit en het overzicht die CSS biedt, maakt het tot de overduidelijk beste keus voor het opmaken van een professionele website.

Wil jij een website laten maken die is opgebouwd met CSS die voldoet aan de strengste webstandaarden? Klik dan hier om contact met ons op te nemen.

Reageren op deze blog