Html5 Audio und Surround Sound

Montag, 14. Mai, 2012

Wie man stereo-Audiodateien in eine Webseite einbindet und möglichst viele Webbrowser dies abspielen lässt, ist in etlichen Seiten/ Blogs beschrieben.
Alle bekannten, neueren Webbrowser unterstützen zumindest das Format MP3 oder aber OGG.

<audio 
  loop="loop" 
  controls="controls"
  >
  <source src="demosong_2.0_.ogg" type="audio/ogg" />
  <source src="demosong_2.0_.mp3" type="audio/mp3" />

  <!-- Flash-Fallback kommt hierher -->

</audio>

Und wer noch Wert auf Abwärtskompatibiltät legt (IE 8 und älter), der setzt noch einen Flashplayer ein und lässt die MP3 Datei abspielen.

Soweit so gut.

Und wie sieht es mit surround-Audiodateien aus? Schliesslich wird seit 1 Jahrzehnt jeder Billigst-PC mit einer 5.1 Soundkarte (oder besser) ausgeliefert…

Meine ersten Experimente habe ich bereits im Oster-Demo gemacht (s. Link [01] unten am Ende des Beitrags). Nachfolgend gibt es nun nachträglich etwas ausführlichere Informationen.

Bekannte Audioformate mit surround-Unterstützung sind

  • AAC (Mpeg-4-Audio)
  • AC3 (Dolby)
  • OGG (Ogg Vorbis)
  • WAV (unkomprimierte Audio-Daten)

[Weiterlesen…]

Google Web Fonts einbinden

Mittwoch, 9. Mai, 2012

Per CSS 3 lassen sich mit Webfonts andere Schriftarten als die Systemschriften einbinden. Bis dato musste man bei der Wahl der Schriftart darauf achten, dass dies Systemschriften von Windows / Mac / Linux sind. Auch all diese Tricks mit Image-Replacements (Fahrner Image Replacement [FIR]; Scalable Inman Flash Replacement [sIFR], Malarkey Image Replacement [MIR] oder Definitive Solution to Image Replacement [DIR]) - kann man in Zukunft vergessen.

Eine Quelle für Webfonts sind die Google Web Fonts .. s. Link [01] .. (es gibt ganz sicher weitere Quellen - bitte immer auf die zur Schriftart angegebene Lizenz achten).

Zwar gibt Google unter “Quick-use” einen funktionierenden Code für Copy & Paste vor, um die Schrift auf seiner Webseite einzubinden … aber es gibt bei dann jedem Seitenaufruf der eigenen Webseite immer einen dynamischen Request zu Google.
Um dies zu vermeiden und Daten nur vom eigenen Server zu holen und nicht zuletzt auch, um Daten effektiv cachen zu können, kann man die Schriftart auch auf seinen Webserver kopieren und von dort einbinden.

[Weiterlesen…]