Plaatjes op een website plaatsen

Het plaatsen van een plaatje op een website lijkt zo simpel maar bijna iedere website doet het verkeerd. Door verkeerd gebruik van html code vergroot je da laadtijd van de pagina en zo krijgt de gebruiker een slechtere pagina voorgeschoteld dan nodig is. Het goed beschrijven van een plaatje kan ook nog eens de nodige bezoekers opleveren

De basis van een plaatje toevoegen

Om een plaatje toe te voegen gebruik je bovenstaande code. Een plaatje begint met het img elelement. Binnen dit img element vind je de volgende attributen: src, height, width, alt.
img: het basiselement van een plaatje. Omdat ieder element ook afgeloten moet worden sluit het img element zichzelf af
scr: de locatei van het plaatje. Als het plaatje op je eigen website staat is het verstandig om het pad naar het plaatje voluit te schrijven (dus vanaf het begin van je website, bijvoorbeeld /folderx/plaatjes/plaatje.jpg). Begin altijd met een "/" om aan te geven dat het plaatje gezocht moet worden vanaf het begin van e website. Als je een plaatje van een andere website in wilt voegen gebruik dan het volledige pad naar het plaatje (http://www.website.nl/plaatje.jpg).
alt: de beschrijving van het plaatje. Omdat een zoekmachine niet goed overweg kan met plaatjes kun je voor een zoekmachine je plaatje beschrijven. Door goed gebruik te maken van deze tag kun je je pagina extra relevant maken voor sommige zoekwoorden.
width: de hoogte van het plaatje in pixels.
height: de breedte van het plaatje in pixels.

Waarom altijd width en height invullen ?

Als je de width en height niet invult voor een plaatje dan zoekt de browser zelf de breedte en hoogte van dit plaatje op. Dit heeft 2 grote nadelen.
1. De browser moet ieder plaatje analyseren en dat kost relatief veel tijd. 2. De browser moet stoppen met het opbouwen van de pagina omdat de browser niet weet hoeveel ruimte het moet reserveren. Het opbouwen van de pagina kan pas verder gaan nadat het plaatje is ge-analyseerd.

Welk formaat plaatje ?

De meest voorkomende formaten plaatjes zijn jpg,gif en png. Jpg is vooral goed geschikt om foto's of plaatjes met kleurverlopen te tonen. Door het gebruik van compressie wordt een plaatje een stuk kleiner maar ziet er vaak nog prima uit. Gif bestanden zijn geschikt voor plaatjes met weinig kleurverloop zoals iconen en lijntekeningen. Gif kent ook transparante achtergronden zodat een plaatje goed mengt in de browser. Png is een nieuwer formaat en heeft het beste van zowel jpg als gif ingebakken. Png verdient nu vaak de voorkeur boven gif bestanden. Omdat png geen compressie gebruikt zijn de bestanden vaak groter dan jij jpg.

Waar gaat uw website over ?