Werken met afbeeldingen.

Bron: http://www.sceneone.nl/afbeeldingen/afb.php

Titel: HTML en CSS tutorials

Auteur: Wybe Weysters

Voor het werken met afbeeldingen geldt dat het de bedoeling is zoveel mogelijk de structuur en presentatie te scheiden.
In het geval van afbeeldingen is het belangrijk jezelf bij iedere afbeelding die je gebruikt de vraag te stellen:
"Hoort deze afbeelding bij de inhoud of bij de presentatie."

Afbeelding als inhoud/structuur

Het beste voorbeeld van afbeeldingen die onderdeel van de inhoud van je website zijn, zijn de plaatjes die je gebruikt als buttons. Je hele navigatiestructuur is opgebouwd uit afbeeldingen. Dat is inhoud.
Een ander voorbeeld kan zijn een grafiekje wat je in Illustrator gemaakt hebt en als gif in je pagina zet om een stuk tekst te ondersteunen met cijfers. Dat gifje voegt iets toe aan je tekst en het heeft inhoud die belangrijk is voor de lezer.

Afbeelding als presentatie/opmaak

Dit zijn eigenlijk alle afbeeldingen die uitsluitend dienen als 'decoratie'. Beetje oneerbiedig gezegd, ik weet het, maar toch. Het zijn de afbeeldingen waar een lezer ook wel zonder zou kunnen, ze dragen inhoudelijk niets bij aan de pagina.

Een goede test

Je kunt zelf testen of een afbeelding inhoudelijk iets bijdraagt aan een pagina of niet.
Firefox heeft hiervoor de mooie optie om je pagina te bekijken zonder de afbeeldingen.
Bekijk zelf je pagina zonder de afbeeldingen en beoordeel dan of er inhoud van je pagina verloren gaat of alleen maar opmaak.

Je begrijpt dat er voor beide soorten van afbeeldingen weer allerlei prachtige mogelijkheden zijn in css. En daar gaan ik het in dit hoofdstuk over hebben.