Wat zijn HTML-afbeeldingen?
In de HyperText Markup Language (HTML) zijn er een aantal manieren om afbeeldingen in een HTML-document weer te geven en te maken. Het meest gebruikte type HTML-afbeeldingen zijn afbeeldingen die rechtstreeks op de HTML-pagina worden geplaatst, inline-afbeeldingen genoemd, hoewel er andere methoden zijn, zoals het gebruik van een scripttaal of een gecompileerde webtoepassing, die kunnen worden gebruikt om dezelfde resultaten te bereiken. Voor dynamisch gegenereerde afbeeldingen voor grafieken of grafieken kan schaalbare vectorafbeeldingen (SVG) worden gebruikt. Er zijn ook enkele eenvoudige HTML-afbeeldingen die worden ondersteund door de taalspecificatie en waarvoor geen externe bestanden zoals horizontale lijnen en opsommingstekens in een lijst nodig zijn. Complexere HTML-afbeeldingen kunnen worden bereikt door het gebruik van een scripttaal, cascading style sheets (CSS) en het HTML canvas-element, waardoor een native optie wordt gegeven voor sommige effecten die voorheen alleen mogelijk waren via externe objecten en plug-ins.
Veruit HTML-afbeeldingen zijn de meest gebruikte en de eenvoudigste manier om een afbeelding in een HTML-document te plaatsen. Dit houdt in feite het maken van een afbeelding in een afbeeldingseditor in, opslaan in een veelgebruikte bestandsindeling en vervolgens de naam en locatie van het afbeeldingsbestand in het HTML-document opgeven met de IMG-tag. Afgezien van de eenvoud van het opnemen van een inline-afbeelding in een document, kan de rendering-engine in de meeste webbrowsers de afbeelding eenvoudig in complexere paginalay-outs plaatsen zonder opmaakartefacten. Een complicatie die kan optreden bij een inline afbeelding is dat de afbeelding mogelijk moet worden geschaald om te passen op uitzonderlijk grote of kleine schermen wanneer deze wordt bekeken, waardoor de kwaliteit van de afbeelding mogelijk wordt verminderd.
Schaalbare vectorafbeeldingen zijn een meer complexe stijl van HTML-afbeeldingen. Een SVG-afbeelding wordt getekend door vormen, paden en lijngewichten te definiëren en wordt ter plekke getekend terwijl de gebruiker het document bekijkt. Dit maakt SVG een goede keuze voor het weergeven van dynamische gegevens zoals grafieken of grafieken, maar het maakt ze erg onpraktisch om te gebruiken voor andere soorten afbeeldingen, zoals het construeren van fotorealistische afbeeldingen. Voor eenvoudige HTML-afbeeldingen en in situaties waarin een extern afbeeldingsbestand niet kan worden geladen, kan SVG een haalbare optie zijn.
Met de ontwikkeling van de HTML-versie 5 taalstandaard (HTML5), kunnen dynamische HTML-afbeeldingen worden gemaakt binnen de standaard HTML-taal. Dit wordt gedaan door rechtstreeks naar een speciaal oppervlak te tekenen dat bekend staat als het canvas in een HTML-document. Door JavaScript® en CSS te gebruiken, kan deze methode animaties of games maken die kunnen reageren op gebruikersinvoer of afbeeldingen aanpassen, afhankelijk van de instellingen van de webbrowser of andere gegevens. Het maken van een HTML5-afbeelding kan echter een complexe procedure zijn die kan leiden tot lange blokken scriptcode die op sommige computers of apparaten heel langzaam kunnen worden uitgevoerd.