| afbeeldingen in HTMLElke webpagina bevat wel afbeeldingen; Om de pagina er beter uit te laten zien, om informatie weer te geven of om aandacht te trekken.
|
Er zijn natuurlijk nog veel meer redenen om afbeeldingen te gebruiken.
De image-tag en het src-attribuut
De <img /> tag is een lege tag, wat betekend dat het alleen attributen bevat en geen eind tag.
Om een afbeelding weer te geven op en pagina, moet je het src attribuut gebruiken. src staat voor "source" (Bron). De waarde van het src-attribuut is de URL van de afbeelding die je wilt weergeven.
voorbeeld:<img src="url">
De URL wijst naar de locatie waar de afbeelding is opgeslagen.
De browser zet de afbeelding in het document waar de img tag wordt gebruikt. Als je een img tag tussen twee paragrafen zet, dan zal de browser eerst de eerste paragraaf, dan de afbeelding, en dan de tweede paragraaf laten zien.
Het alt-attribuut
Het alt attribuut wordt gebruikt om een alternatieve tekst voor een afbeelding op te geven. De waarde van het alt-attribuut is een tekst die de afbeelding beschrijft:
voorbeeld:<img src="erik.jpg" alt="Foto van Erik">
Het is een goede gewoonte om het alt attribuut voor elke afbeelding te gebruiken, om de weergave te verbeteren en om ook nuttige pagina´s te kunnen laten zien aan mensen met tekst browsers.
Tips
Als een
HTML bestand tien afbeeldingen bevat, betekend het dat er elf bestanden nodig zijn om de pagina correct weer te geven. Het laden van afbeeldingen kost tijd, dus mijn advies: gebruik afbeeldingen voorzichtig en optimaliseer ze voor het web.
voorbeeld:<!--Achtergrond afbeelding-->
<body background="achtergrond.jpg">
<!--Afbeeldingen uitlijnen-->
<img src="afbeelding.jpg" align="center">
<!--Hyperlink maken van een afbeelding-->
<a href=http ://www.eriksweb.nl>
<img src="afbeelding.jpg" align="center">
</a>
