Forum digitalis

1.6 Medien

Medien

Mit HTML können verschiedene Medien eingebunden werden. Bilder werden mit dem <img>-Tag eingefügt, Audio mit <audio> und Videos mit <video>. Für Barrierefreiheit und Suchmaschinen ist es wichtig, jedem Medium einen beschreibenden alt-Text zu geben.

Bilder

Mit <img> werden Bilder eingebunden. Attribute wie src geben den Pfad an, alt beschreibt das Bild für Screenreader oder bei fehlender Darstellung.

Audio & Video

<audio> und <video> ermöglichen das Einbetten von Multimedia-Dateien direkt auf der Seite. Attribute wie controls zeigen Wiedergabesteuerungen an.

Beispiel

Im folgenden Beispiel werden Bild, Audio und Video eingebunden.

<!DOCTYPE html> <html lang="de"> <head> <meta charset="UTF-8"> <title>Medien</title> </head> <body> <h2>Bild</h2> <img src="bild.jpg" alt="Beschreibung des Bildes"> <h2>Audio</h2> <audio controls> <source src="audio.mp3" type="audio/mpeg"> Ihr Browser unterstützt kein Audio. </audio> <h2>Video</h2> <video width="320" height="240" controls> <source src="video.mp4" type="video/mp4"> Ihr Browser unterstützt kein Video. </video> </body> </html>