Zum Inhalt springen

HTML-Multimedia

Multimedia ist fast alles, was Sie hören oder sehen können (z. B. Ton, Musik, Bilder, Aufnahmen, Videos, Filme, Animationen usw.). Es gibt sie in verschiedenen Formaten. Webseiten können Multimedia-Elemente unterschiedlicher Formate und Typen enthalten.

Multimedia-Tags

HTML ermöglicht das Hinzufügen verschiedener Multimedia-Dateien auf Ihrer Website mithilfe verschiedener Multimedia-Tags. Zu diesen Tags gehören:

  • <audio> zur Anzeige einer Audiodatei auf der Webseite,
  • <video> zur Anzeige einer Videodatei auf der Webseite,
  • <embed> zum Einbetten von Multimedia-Dateien auf der Webseite,
  • <object> zum Einbetten von Multimedia-Dateien auf der Webseite.
  • <iframe> zum Einbetten anderer Webseiten.

Hier ist ein einfaches Beispiel mit dem Attribut controls und den <source>-Tags:

html
<audio controls>
  <source src="audio.mp3" type="audio/mpeg">
  Your browser does not support the audio element.
</audio>

<video controls>
  <source src="video.mp4" type="video/mp4">
  Your browser does not support the video element.
</video>

Multimedia-Formate

Multimedia-Elemente wie Audio oder Video werden in Mediendateien gespeichert. Sie können den Dateityp anhand der Dateierweiterung erkennen.

Multimedia-Dateien haben Formate und verschiedene Erweiterungen: .mp3, .mp4, .mpg, .swf, .wav, .mpg, .wmv und .avi.

Audioformate

Das neueste Format für komprimierte aufgenommene Musik ist MP3. Dieser Begriff ist gleichbedeutend mit digitaler Musik.

MP3 ist eine gute Wahl, wenn Ihre Website sich mit aufgenommener Musik befasst.

FormatDateiBeschreibung
MIDI (Musical Instrument Digital Interface)..mid .midiDies ist das Hauptformat für alle elektronischen Musikgeräte (z. B. Synthesizer und PC-Soundkarten). MIDI-Dateien enthalten digitale Noten, die von Elektronik abgespielt werden können, enthalten jedoch keinen Ton. Es funktioniert gut auf Musik-Hardware und Computern, aber nicht nativ in Webbrowsern. Moderne Browser können MIDI über die Web Audio API verarbeiten.
RealAudio.rm .ramErmöglicht das Streaming von Audio mit geringer Bandbreite. In Webbrowsern wird es nicht abgespielt.
WMA.wmaDieses Format wurde von Microsoft entwickelt und wird normalerweise in Musikplayern verwendet. Es funktioniert gut auf Windows-Computern, aber nicht in Webbrowsern.
AAC.aacDieses Format wurde von Apple als Standardformat für iTunes entwickelt. Rohdateien vom Typ .aac haben nur eingeschränkte Browserunterstützung, aber AAC-Audio wird weithin unterstützt, wenn es in .mp4-Containern verpackt ist.
WAV.wavDieses Format wurde von IBM und Microsoft entwickelt. Es funktioniert gut auf Windows-, Linux- und Macintosh-Betriebssystemen. Unterstützt von HTML5.
Ogg.oggDieses Format wurde von der Xiph.Org Foundation entwickelt. Unterstützt von HTML5.
MP3.mp3Dies ist das beliebteste Format für Musikplayer. Das Format bietet gute Komprimierung (kleine Dateien) und hohe Qualität. Unterstützt von allen Browsern.
MP4.mp4Dies ist ein Videoformat, kann aber auch für Audio verwendet werden. MP4-Video ist das zukünftige Videoformat im Internet, wodurch MP4-Audio von allen Browsern automatisch unterstützt wird.

TIP

HTML5 unterstützt nativ die Audioformate MP3, AAC (in MP4-Containern), WAV und Ogg.

Videoformate

FormatDateiBeschreibung
MPEG.mpg .mpegErstellt von der Moving Pictures Expert Group. Es ist das erste beliebte Videoformat im Web. Nicht in HTML5 unterstützt.
AVI (Audio Video Interleave).aviErstellt von Microsoft. Es wird normalerweise in TV-Hardware und Videokameras verwendet. Es funktioniert gut auf Windows-Computern, aber nicht in Webbrowsern.
WMV (Windows Media Video).wmvErstellt von Microsoft. Es wird normalerweise in TV-Hardware und Videokameras verwendet. Es funktioniert gut auf Windows-Computern, aber nicht in Webbrowsern.
QuickTime.movErstellt von Apple. Es wird normalerweise in TV-Hardware und Videokameras verwendet. Es funktioniert gut auf Apple-Computern, aber nicht in Webbrowsern.
RealVideo.rm .ramErstellt von Real Media und ermöglicht Video-Streaming mit geringer Bandbreite. Es wird immer noch für Internet-TV und Online-Video verwendet, wird jedoch in Webbrowsern nicht abgespielt.
Flash.swf .flvVeraltet. Adobe Flash Player wurde 2020 aus allen modernen Browsern entfernt. Dieses Format gilt inzwischen als Legacy und erfordert Emulatoren von Drittanbietern zur Wiedergabe.
Ogg Theora.oggErstellt von der Xiph.Org Foundation. Unterstützt von HTML5.
WebM.webmErstellt von Mozilla, Opera, Google und Adobe. Unterstützt von HTML5.
MPEG-4 or MP4.mp4Erstellt von der Moving Pictures Expert Group. Es wird allgemein in TV-Hardware und neueren Videokameras verwendet. Von YouTube empfohlen. Unterstützt von allen HTML5-Browsern.

TIP

Nur die Videoformate WebM, MP4 und Ogg werden vom HTML5-Standard unterstützt.

Browser-Unterstützung

Audio, Video und Animation werden von modernen Browsern nativ verarbeitet. Während die Formatunterstützung variiert, hat HTML5 die Wiedergabe standardisiert, ohne dass Plugins von Drittanbietern erforderlich sind.

Practice

What kinds of files can HTML multimedia display?

Finden Sie das nützlich?

Dual-run-Vorschau — vergleichen Sie mit den Symfony-Routen live.