Skip to content

Audio in Webseite einbinden

Kein Hexenwerk.

Man speichert seine Audio-Datei im mp3-Format. Das wird von den meisten Geräten abgespielt. Wenn man zusätzlich eine Version im ogg-Format anfertigt, hat man auch z. B. die Linux-Nutzer ohne mp3-Unterstützung versorgt.

Anschließend die Dateien auf den Server hochladen. Hier im Blog habe ich dafür ein Verzeichnis audio eingerichtet.

Um die Datei direkt online abzuspielen, fügt man den folgenden Code ein:

<audio id="audio_with_controls" controls preload="none">
<source src="/blog/uploads/audio/schiller_der-handschuh_v2.mp3" type="audio/mp3" />
<source src="/blog/uploads/audio/schiller_der-handschuh_v2.ogg" type="audio/ogg" />
Ihr Browser kann dieses Tondokument nicht wiedergeben.
Sie können es unter <a href="/blog/uploads/audio/schiller_der-handschuh_v2.mp3">/blog/uploads/audio/schiller_der-handschuh_v2.mp3</a> abrufen.
</audio>

Damit wird zuerst versucht, die mp3-Datei abzuspielen, falls das nicht klappt, die ogg-Datei. Für Seitenbesucher mit antiken Webbrowsern ist der Teil ab »Ihr Browser kann dieses Tondokument nicht wiedergeben ...« eingefügt. Standardmäßig würde beim Seitenaufruf angefangen, die Audio-Datei herunterzuladen. Um damit erst beim Druck auf den Play-Button zu beginnen, verwende ich immer die Option »preload="none"«

Damit man die Audio-Datei bequem herunterladen kann, füge ich meistens noch den folgenden Code ein:

Herunterladen als <a href="http://u1amo01.de/blog/uploads/audio/schiller_der-handschuh_v2.mp3">mp3-Datei</a> oder im <a href="http://u1amo01.de/blog/uploads/audio/schiller_der-handschuh_v2.ogg">ogg-Format</a>.

Und hier das Ergebnis:


Herunterladen als mp3-Datei oder im ogg-Format.


Weil man sich sowas nicht merken will, habe ich mir einen Musterblogbeitrag angelegt, den ich immer wieder kopiere. Immer wieder lustig, wenn ich vergesse die Dateinamen entsprechend anzupassen :-)

Quelle und alle möglichen Optionen: SelfHTML.org

Tipps: Sicherer surfen

Foto Hatte ich schon geschrieben, dass das Thema Sicherheit im Internet nichts ist, was man einmalig macht und abhakt, sondern ein kontinuierlicher Prozess?

Ich verwende beim Browsen meistens Firefox (das Schweizer Taschenmesser unter den Browsern) mit den Add-Ons https Everywhere, Privacy Badger und uBlock Origin.

Weil es früher beim Webseitenerstellen wichtig war zu prüfen, wie die gebastelte Seite in anderen Browsern angezeigt wird, habe ich auch Opera (den schönste Browser von allen), Chromium (naja) und Google Chrome (Datenkrake – schnell und komfortabel) installiert. Und verwende sie je nach Aufgabenstellung.

Als Lektüre zum Thema kann ich folgende (nicht mehr ganz frischen) Beiträge empfehlen:

via Netzpolitik.org

PS: natürlich gibt es meine 3 Lieblings-Add-Ons auch für andere Browser. Hier die Links: https Everywhere (von der EFF) Privacy Badger (ebenfalls EFF) uBlock Origin

Es gibt sie noch

Die ganzen Internetabfragen laufen über Google. Alle? Zumindest ein paar Personen scheinen nicht aufzuhören Widerstand zu leisten.

Nein, nicht die in dem kleinen gallischen Dorf. Die freiwilligen Editoren des ODPs, auch bekannt als dmoz.org. Alle Seiten des Webs in einem Katalog kategorisiert war die ambitionierte Vision. Vor Jahrzehnten war ich dort sehr rege tätig, es gab mehrere User-Treffen und sogar Editorenhochzeiten ...

Erstaunt habe ich festgestellt, dass die Oberfläche nach 18 Jahren (!?) angepasst wurde. Für mobile und allen Schnickschack. Curiosity killed the cat – also einen Reinstatement-Antrag ausgefüllt und Bauklötze gestaunt, als der innerhalb von Stunden genehmigt wurde.

Kein allzu großes Wunder: Zu guten Zeiten, als das Verzeichnis noch von Google mitverwendet wurde und jeder dort eingetragen werden wollte, gab es Tausende Freiwilliger. In den Foren wurde in den Sprachen aller Herren Länder diskutiert und gewerkelt. Aktuell scheint es nur noch eine kleine Handvoll Mitglieder zu geben. Wer kennt schon noch diesen Dinosaurier.

ABER.

Beim Herumstöbern in meinen alten Lieblingskategorien bin ich über den Eintrag von Kathrin Lemke gestolpert, die im Januar dieses Jahres viel zu jung verstorben ist. Also habe ich traurig den Beschreibungstext »Seite der in Berlin lebenden Saxophonistin« geändert auf »Saxophonistin, die in Berlin lebte«. Ein kurzer Blick zu Tante Google zeigt, das dort beim Suchergebnis von Kathrins Seite der ODP-Text als sogenanntes Snippet gezeigt wird. Mal sehen, ob und wann Google meine Textänderung vom 25.08.2016 übernimmt.

Bild Bild

Nachtrag: am 13.09.2016 war der aktualisierte Text bei Google als Snippet zu sehen.

2FA

Fast wöchentlich liest man Meldungen über gestohlene Passwortdatenbanken oder gehackte Accounts. Nicht so schlimm? Naja, bei den Dutzenden Anwendungen benutzen viele die gleichen Passwörter für mehrere Konten ...

Ein besserer Schutz ist die sogenannte 2-Faktor-Authentifizierung (2FA). Nie gehört? Benutzt aber jeder. Beim Geldautomaten. Man hat seine EC-Karte und dazu einen Zahlencode. Das eine ist ohne das andere nutzlos. Im Internet gibt es verschiedene Möglichkeiten.

Ein Verfahren: Man gibt sein Passwort ein, worauf ein Code generiert wird, der als SMS an das eigene Mobiltelefon geschickt wird. Kennt man als mTan-Verfahren. Auch nicht kugelsicher, wie man bei Wikibanking: mtTAN-Verfahren nachlesen kann. Legt die Messlatte für einen Angreifer aber schon viel höher.

Wie immer erkauft man sich höhere Sicherheit durch weniger Komfort. Aber wer möchte schon, dass irgend ein Hacker über Amazon und die hinterlegte Bankverbindung Großeinkäufe macht?

Amazon bietet seit Monaten 2FA an, allerdings noch nicht in den deutschsprachigen Benutzereinstellungen. Dazu muss man einen Umweg über amazon.com machen und braucht ein Mobiltelefon. Heise Security hat dazu eine Bild-für-Bild-Anleitung.

Eine englischsprachige Übersicht von Online-Diensten und den angebotenen Authentifizierungsmöglichkeiten bietet Two Factor Auth List. Tipp: nicht lange über die Kategorien klicken, gleich die Suchfunktion benuten ;-)

Und ja, Du willst JETZT Deinen Amazon-Zugriff auf 2FA umstellen. Gehe nicht über Los, gehe direkt zur Anleitung bei Heise Security

Firefox Plugin Tile tabs

Hätte ich gewußt, dass es das gibt, hätte ich es schon lange in Gebrauch: das Plugin Tile Tabs für den Firefox-Webbrowser.

Damit kann man den Inhalt mehrerer Tabs gleichzeitig anzeigen lassen. Horizontal geteilte Ansicht, vertikal, oder vier gleichzeitig ... endlose Möglichkeiten. Wobei für mich als altem Fan des Norton Commanders (unter Linux der Midnight Commander) die vertikale Ansicht zweier Fenster das einzig Wahre ist ;-)

Das beste: mit F12 wechselt man zwischen normaler Ansicht und Splitscreen.

Screen Shot