Wat is een afbeeldingstag in HTML?
Wanneer u een webpagina maakt met HTML, wordt de afbeeldingstag gebruikt om een foto of afbeelding op een bepaalde plaats op de pagina in te voegen. Er zijn veel manieren waarop afbeeldingen op webpagina's kunnen worden gebruikt, van het toevoegen van interesse tot het gebruik als navigatiehulpmiddel of om informatie te verstrekken. Er zijn ook verschillende formaten afbeeldingen die kunnen worden gebruikt. Het maakt niet uit hoe of welke afbeelding wordt toegevoegd aan de webpagina, de afbeeldingstag is altijd vereist.
Om een afbeelding toe te voegen, wordt de afbeeldingstag opgenomen waar u de afbeelding op uw pagina wilt weergeven. Als er bijvoorbeeld een afbeelding zou worden ingevoegd na deze paragraaf, zou de afbeeldingstag of <img> worden toegevoegd aan het HTML-document na deze paragraaf. De tag <img> definieert alle afbeeldingen in HTML. Het wordt een lege tag genoemd, omdat het attributen bevat en geen afsluitende tag heeft. Attributen zijn opties die beschikbaar zijn voor een specifieke HTML-tag.
Als alleen <img> aan een HTML-document zou worden toegevoegd, zou er niets worden weergegeven omdat de kenmerken van de tag niet zijn opgenomen. Het belangrijkste kenmerk voor <img> is "src", wat staat voor bron. Het attribuut src geeft aan waar het afbeeldingsbestand zich daadwerkelijk bevindt, of het is het adres voor het afbeeldingsbestand. Omdat de afbeelding op een webpagina wordt gebruikt, wordt de locatie van de afbeelding als URL weergegeven. In het HTML-document ziet de afbeelding er als volgt uit: <img src = "URL" />.
In het bijzonder verwijst de URL naar waar de afbeelding is opgeslagen. Als een afbeelding van een computer met de bestandsnaam computer.jpg bijvoorbeeld wordt opgeslagen in de map met afbeeldingen op www.wisegeek.com, wordt de URL vervangen door: <img src = "www.wisegeek.com/images/computer. jpg "/>. Wanneer de browser de webpagina opent, wordt de afbeelding weergegeven met de afbeeldingstag.
De afbeeldingstag heeft een aantal andere verschillende attributen. Hiermee kan een gebruiker aanpassen hoe de afbeelding op de pagina eruit ziet. De volgende attributen worden vaak gebruikt voor deze tag: alt, rand, grootte en uitlijnen.
Het kenmerk alt staat voor alternatieve tekst en wordt weergegeven als een browser geen afbeelding kan weergeven. Alternatieve tekst wordt ook gelezen voor gebruikers die visueel worden uitgedaagd en ervoor kiezen om tekst boven afbeeldingen weer te geven. Voor het bovenstaande voorbeeld kan de alternatieve tekst worden opgegeven als alt = "image of a computer".
Het randkenmerk voegt een rand toe aan de afbeelding met de dikte afhankelijk van het aantal aangegeven pixels. Dit kan met name handig zijn als de achtergrond van de afbeelding en de achtergrond van de website vergelijkbaar zijn en een duidelijk onderscheid gewenst is. Border = "10" plaatst bijvoorbeeld een rand van 10 pixels dik rond een afbeelding.
Grootte- attributen zijn ook belangrijk, omdat breedte en hoogte kunnen worden gebruikt om de exacte grootte van een afbeelding op te geven. Deze attributen moeten zeer zorgvuldig worden gebruikt, omdat het wijzigen ervan de verhoudingen of de kwaliteit van de weergegeven afbeelding kan beïnvloeden. Grootte-attributen veranderen het daadwerkelijke bestand niet, alleen hoe de browser het weergeeft.
Het kenmerk uitlijnen geeft aan hoe de afbeelding wordt uitgelijnd in vergelijking met tekst op de pagina. Er zijn verschillende keuzes voor dit kenmerk, waaronder boven, onder, midden, links, rechts, absmiddle, absbottom, basislijn en teksttop. Deze tags helpen ook om te bepalen hoe de tekst op de pagina wordt uitgelijnd met de afbeelding.