Waarom HTML-structuur en vormgeving scheiden?

HTML voor structuur

De content van een webpagina bestaat o.a. uit tekst, afbeeldingen en tabeldata. Deze inhoud wordt door middel van HTML gestructureerd. HTML-elementen zoals headers (h1, h2, etc.) worden gebruikt om documentstructuur te schrijven en niet voor hun standaard grootte of het uiterlijk. (Grootte en uiterlijk van deze elementen worden gedefinieerd via het gebruik van CSS.)

CSS voor vormgeving

De vormgeving kan in zijn geheel worden gedefinieerd in een apart CSS-bestand dat aan een HTML-pagina is gekoppeld. CSS beschrijft hoe de inhoud eruit moet komen te zien, denk o.a. aan: kleur, fontgebruik, achtergrondafbeeldingen en de plaatsing van de diverse HTML-elementen. Decoratieve afbeeldingen dienen zoveel mogelijk door CSS geplaatst te worden, dit in tegenstelling tot informatieve afbeeldingen. Deze dienen d.m.v. HTML geplaatst te worden, uiteraard met een "alt-tekst".

Waarom HTML-structuur en vormgeving scheiden?

• Snelheid: het afzonderlijke CSS-bestand kan worden toegepast op één of meerdere pagina's, maar het hoeft slecht één keer geladen te worden door de browser.
  
• Efficiëntie tijdens onderhoud: het toepassen van dit principe betekent kostenbesparingen, efficiëntie in bouw en onderhoud, een betere herkenbaarheid en bruikbaarheid. Wijzigingen binnen van het CSS-bestand worden automatisch doorgevoerd op alle HTML-pagina's die een koppeling hebben naar dit bestand.
  
• Usability: Als de vormgeving/lay-out niet wordt gescheiden van de HTML-structuur, dan betekent dat vaak deze d.m.v. frames of tabellen wordt opgemaakt. Dit kan leiden tot complicaties. Met name voor 1) mensen met een visuele handicap of 2) mensen die een pagina willen printen (vaak passen pagina's niet op het papier als men wil printen in staand formaat). Een tabel dient alleen toegepast te worden voor tabulaire gegevens. Denk aan gegevens die normaliter in een spreadsheet (Excel) verwerkt worden.
• Accessibility : De volgorde van de visuele elementen van de layout hoeft niet hetzelfde te zijn als de volgorde van de HTML-structuur. Het is dus mogelijk om de content in volgorde van belangrijkheid te ordenen. Op deze manier vergroot je de traceerbaarheid, toegankelijkheid en bruikbaarheid van de informatie.
  
• SEO: Ook Google geeft de voorkeur voor helder gestructureerde webpagina's en kan deze ook beter indexeren.

Belangrijk

Pagina's dienen bruikbaar te blijven wanneer CSS door een webbrowser niet ondersteund wordt.

Meer info: www.drempelsvrij.nl