Wat is een inline afbeelding?
Een inline-afbeelding is een grafische afbeelding die in een webpagina wordt ingevoegd om visueel aantrekkelijker te zijn, informatie te verstrekken of een hyperlink weer te geven. Inline-afbeeldingen hebben meestal de indeling GIF, JPEG of PNG. Ze worden opgenomen in een webpagina met behulp van het data-URI-schema.
Met gegevens-URI's kunnen kleine gegevens worden ingesloten die direct door de browser kunnen worden opgehaald. Inline afbeeldingen worden door de browser samen met de HTML opgehaald en weergegeven als onderdeel van het webdocument. Om de afbeeldingen zonder al te veel tijd en moeite te kunnen ophalen en weergeven, is het raadzaam om kleine inline afbeeldingen te gebruiken.
Grotere afbeeldingen vertragen de laadtijd en het kan lang duren voordat de site op het scherm verschijnt. De meeste webbezoekers hebben niet het geduld om rond te hangen om het te zien gebeuren. Dit zou het siteverkeer nadelig beïnvloeden.
Inline HTML-afbeeldingen zijn afkomstig van de server van de website waarin ze moeten worden weergegeven of opgenomen van andere externe servers. Het gebruik van inline afbeeldingen van externe bronnen is een punt van discussie, omdat dit zonder toestemming kan worden gedaan. De img-tag wordt gebruikt om inline afbeeldingen in alinea's en koppen op de webpagina in te voegen. De img-tag kan niet in een vrij zwevende vorm worden gebruikt. Het moet worden ingesloten in een ander element.
Het vereiste kenmerk van de img-tag is het src-kenmerk. Het kenmerk src geeft het webadres of de URL aan waaruit de browser het afbeeldingsbestand kan ophalen. Afgezien van het src-kenmerk kunnen HTML-inline-afbeeldingen worden gedefinieerd door drie optionele attributen. Dit zijn alt, align en ismap.
Het alt-attribuut biedt een alternatief voor inline afbeeldingstekst. Dus als de browser van de kijker geen afbeeldingen ondersteunt, ziet de kijker de tekst in plaats van de afbeelding. Het gebruik van het alt-kenmerk wordt sterk aanbevolen.
De alt-attribuutwaarde kan een lege string zijn. Als er bijvoorbeeld een decoratieve afbeelding is, is het niet nodig om er alternatieve tekst voor te bieden. Daarom kan de alt-attribuutwaarde leeg worden gelaten.
De inline-afbeeldingsstijl kan worden ingesteld met het kenmerk align. Het align-attribuut vertelt de browser waar de inline afbeelding moet verschijnen ten opzichte van de tekst op de webpagina. De inline afbeelding kan worden uitgelijnd met de boven-, midden- of onderkant van de aangrenzende tekst op de webpagina.
Met het kenmerk ismap kan een inline-afbeelding worden gemarkeerd als een actieve afbeeldingskaart. Dit betekent dat verschillende delen van de afbeelding kunnen worden gemaakt om verschillende acties te produceren wanneer iemand op de verschillende delen klikt. Als er bijvoorbeeld een inline afbeelding is die Earth en Saturn toont, kan klikken op Earth leiden tot informatie over Earth en klikken op Saturn kan leiden tot informatie over Saturn.
In tegenstelling tot de alt- en align-attributen werkt het ismap-attribuut niet alleen door het in de img-tag op te nemen. Het vereist enige configuratie op de server. Enige hoeveelheid programmeerkennis kan ook vereist zijn.