- 2012
- Mai
- 14
Html5 Audio und Surround Sound
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
- 2012
- Apr
- 2
CSS3 Osterei und HTML5 Audio mit Surround-Sound
Malen wir mal ein Ei. Aber ohne eine Grafik zu verwenden.
Demo-Seite: http://www.axel-hahn … -ei-und-html5-audio/
- 2012
- Feb
- 24
Jubiläum: Axel ist nun 15 Jahre im Web!
Ich habe kürzlich mein uralt-ZIP-Drive rausgekramt und ein altes Backup gefunden.
Meine erste Webseite ging vor - sage und schreibe - 15 Jahren online! F… (ferdammt), ich bin mit der Meldung genaugenommen sogar ein paar Tage zu spät ;-)
Zur Technik:
Damals war HTML 3.2 “state of the art”. Das heisst: die Webseite bestand aus Frames - und es gab zusätzlich eine Noframe-Variante. Es gab auch einige dezent animiert GIFs - natürlich alle selbsterstellt ;-)
Linkerhand das Menü enthielt Icons, die im onmouseover-Event Grafiken austauschten. Tja, das CSS-Pseudoelement :hover - geschweige denn CSS gab es ja noch nicht.
Ich habe versucht, den goldenen Regeln für schlechtes HTML möglichst gekonnt auszuweichen (heute gibt es ja zuhauf HTML-Validatoren und SEO-”Zeugs”).
Dies war die Frame-Variante:
Inhalt:
Was stellte ich in meiner ersten Webseite online? Es gab einige meiner damaligen mit Delphi und Turbo Pascal erstellten Programme für Windows und DOS zum Download - ebenso 2 Tracker-Songs.
Meine Webseiten entstanden mit einem DOS-Editor (Teil des hammermässigen Norton Commander Clons namens “DCC”), für den ich auch gleich eine Datei für das Syntax-Highlight von HTML anbot.
Ja, ich weiss, im Screenshot gibt es HTML-Syntax-Fehler - es ist ja meine allererste Seite ;-)
Und auch damals gab es schon unterschiedliche Browser, auf die es Rücksicht zu nehmen galt. Frames und Animationen konnten nicht alle Webbrowser.
Oooh jaaa. Lang-lang ist’s her!
Links:
- 2012
- Jan
- 21
Google+ Button Html5 konform einbetten
Um den G+ Button einzubetten, sieht Google das Laden eines Javascripts vom Google-Server und diesen Tag vor:
<!-- Place this tag where you want the +1 button to render --> <g:plusone annotation="inline"></g:plusone>
Nur ist das nicht konform mit der HTML-Syntax, auch nicht mit HTML5. Macht man einen Testlauf mit einem Validator, so wird diese Zeile angemahnt.
Den ganzen Beitrag lesen »
- 2011
- Aug
- 7
Includes von Javascript und CSS Files minimieren
Im Laufe der Zeit sammeln sich mehr und mehr kleine Skripte und CSS-Dateien an, die um Einbindung in den Header bitten. Bei mir wurde das Arsenal auch immer grösser:
Javascript:
Ich hatte mehrere Dateien mit eigenen Javascript-Funktionen (wobei die ein oder andere nur im Fall der Verwenung nachgeladen wurde). Hinzu kommen ein Javascript Framework (jQuery) und diverse jQuery Plugins und sonstige Javascripts von Fremdanbietern.
CSS:
Ich verwende 2 CSS-Dateien für die Darstellung auf Bildschirmen und eine CSS Datei für Druckausgabe. Weitere Dateien kommen CSS-Dateien von jQuery-Plugins und sonstigen PHP-Skripten.