Dr. Web Team 26. Mai 2010

Frage an die Community: Player in Website integrieren – aber wie?

Man kennt das Problem mit Music-Playern auf Web-Seiten: Falls die Seite nicht in Flash gelöst ist, fängt der Song wegen HTTP-Request immer wieder von vorne an. Lässt sich das intelligenter abschalten als mit den mir bereits bekannten Methoden über PopUps oder iFrames?

Soweit ich weiß, gibt es zwei Möglichkeiten, die meiner Meinung nach aber alle nicht schön sind, entweder das Pop-Up oder iFrame

  • PopUps werden heute viel geblockt,
  • iFames sind meiner Meinung nach veraltet.

Derzeit arbeite ich mit einem Kunden zusammen, der eigene Loops produziert und diese an Firmen verkauft. Der Kunde möchte natürlich, was ich verstehen kann, auf seiner Web-Seite einen Song laufen lassen, was seine Arbeit unterstreichen soll.

Nun zur meiner Frage: Könnt Ihr mir eine Möglichkeit vorschlagen, einen Player in eine Seite zu integrieren? Kann man den HTTP-Request umgehen (was für eine blöde Frage..)?

Auf rettende Antworten und Lösungen in den Kommentaren hofft dennoch ein momentan ratloser Dr.-Web-Leser :-).

(mm),

Dr. Webs exklusiver Newsletter
Hinweise zum Datenschutz, also dem Einsatz von Double-Opt-In, der Protokollierung der Anmeldung, der Erfolgsmessung, dem Einsatz von MailChimp als Versanddienstleister und deinen Widerrufsrechten findest du in unseren Datenschutzhinweisen.

33 Kommentare

  1. …. habe es nicht getestet, ist aber scheinbar eine gute Flash variante.

    http://s3.envato.com/files/56448/index.html

  2. Danke für den Tipp mit Ajax, werde ich gleich mal ausprobieren.

  3. Hallo,

    hatte vor kurzem dasselbe Problem, welches ich folgendermaßen lösen konnte:
    Die Seite bestand bereits, weshalb ich hier nicht alles neu machen wollte. Um jedoch immer die Unterbrechung der Musik bei Seitenwechsel zu vermeiden erweiterte ich die Seite dahingehend, dass die Inhalte in einem verstecktem, mittels JS erstelltem iFrame nachgeladen werden. Sobald die Seite im iFrame geladen ist (dort ohne die Musik), wird der gewünschten Inhalt in den sichtbaren Bereich übernommen. Dies hat den Vorteil, dass die Links für Suchmaschinen oder Browser ohne JS weiterhin funktionieren und dennoch wird die Musik nicht unterbrochen sobald ich eine neue Seite aufrufe. Auch ein Refresh der Seite ist hier kein Problem, da ich auch hier einfach nach ausladen den Inhalt des iFrames übernehme – leider mit einem unschönen „zucken“ der Seite, da natürlich zu Beginn kurz die Startseite erscheint.

    hier das Beispiel: http://www.kinderfestival.it/de/

  4. Ich bin auch kein Freund davon, das eine Seite automatisch Lärm von sich gibt. Gerade wenn man mit mehreren Tabs arbeitet muss man mal den Übeltäter finden (im schlimmsten Fall hat man sogar mehrere davon – klingt dann super).

    Daher würde ich das Problem folgendermassen lösen:
    Auffälliger Link/Button „Play Background Music“ mit Verweis auf eine Playlist (m3u Datei). Diese wird beim Klick darauf automatisch, im vom User bevorzugten Player (VLC, Media Player, …), abgespielt (also ausserhalb des Browsers).
    Weitere HTTP Requests haben damit keinen Einfluss auf die Musik. Der Besucher muss weder Flash noch JavaScript aktiviert haben.
    Ausserdem hat der Besucher, auch nach schliessen der Seite, die Möglichkeit der Musik weiter zu lauschen.

  5. iFrames mögen veraltet sein, aber solange Sie ihren zweck sehr gut erfüllen, sollte es egal sein. Ansonsten sehe ich den „Ajax-Ansatz“ als dann die modernste Lösung.

  6. Wer so viele Tipps gibt, der sollte auch mal fragen stellen dürfen. Ich habe da keine zweifel das dies OK ist. Doch sollten es Fragen wie diese sein, die auch für den Leser interessant sind. In diesem Fall z.B. ein Oft diskutiertes und selten gelöstes Problem.

  7. Wenn ich einmal einen komplett anderen Vorschlag machen darf: Startet einfach keine Musik beim Seitenaufruf. Das ist so benutzerunfreundlich. Der User soll selbst entscheiden, wann er Musik haben möchte.

  8. Wenn dann bitte als Forum. Sonst muss ich den feed hier streichen …

  9. @ 123 wenn der Kunde es Verlangt macht man sich schon mal gedanken..

    Zu deiner Kritik, guter Punkt aber natürlich sollte der Player nicht automatisch anlaufen, sonder man sollte dem User die frei Wahl lassen, das Umgeht dein Problem..

  10. Bei der iFrame-Lösung, die eigentlich die einfachste und „sicherste“ Variante zu sein scheint, müsste der eigentliche Content / Website im iFrame stehen, damit die Musik auch beim Wechsel der Inhalte weiter klingen kann. D.h. nur der „Player“ für die Sounds / Musik müsste in der aufrufende Seite (z.b. index.html) stehen.

    Das hätte als Nachteile kein direktes Bookmarking von Unterseiten, kein optisches Feedback in der Adress-Zeile und evtl. auch SEO-Nachteile…

  11. find solche Frage-Antwort Themen generell gut. aber nur in einem extra Berreich. Umsetzen könnte man es ähnlich wie bei http://www.gutefrage.net

  12. Mit dieser Frage habe ich mich lange beschäftigt, bis ich herausfand, daß es den WordPress-Audio-Player auch in einer Standalone version für HTML – freunde gibt.

    Finde ich persönlich am besten.

    Link und download:

    http://wpaudioplayer.com/standalone

    cheers

    udo

  13. Ajax ist die beste Lösung imo.
    Man könnte auch nen Timer mitlaufen lassen und den Track aber der Stelle weiterlaufen lassen, jedoch erhält man dadurch nen kleinen Cut beim Laden der sehr störend ist.

    Und wie mein Vorredner schon gesagt hat mit Ajax ist es sehr einfach und schafft fast kein Mehraufwand.

  14. Seit wann baut man denn einen Ajax Seitenwechsel so das die Seite mit deaktivierten JS nicht funktioniert? Das so zubauen ist ja sogar noch mehr aufwand als die ordentliche Variante (einfach den Click per JS abfangen und den Request per JS ausführen + return false; sollte ohne zusätzliche Effekte nicht mehr als ne Stunde dauern).

  15. Also wenn sich der Kunde den Luxus gönnen möchte, lieber alles andere in AJAX zu realisieren (und komplett JS-abhängig zu sein), statt eines bestenfalls nahtlos integrierten IFrames, der die Aufgabe in wenigen Codezeilen löst… ob dann der Player in Flash ist oder auf Systemplayer zurückgegriffen wird, ist imho sowieso unabhängig von der Art der Einbindung seines Aufrufs durchzuarbeiten.

    @font-face war auch mal veraltet, bzw. eine IE-Spielerei und nun ist es das neuste von Neuen-Non-Plus-Ultra ;-)

  16. @Georg

    Wo soll denn bei AJAX der Nachteil bezüglich Performance und SEO sein?
    Wenn man es richtig anstellt, ist beides kein Problem.
    Siehe mein Beispiel weiter oben. Schalte das JS ab und klick dann mal auf die Navi(„Tabs“)

  17. … oder einfach ein Dr. Web Forum einrichten ;-)

  18. @Manuela:

    Ich finde das gut, allerdings dann bitte in einer eigenen Sparte und nicht vermischt mit den „normalen“ Beiträgen.

    Man könnte auch darüber nachdenken, das Design etwas anzupassen, da im Gegensatz zu den normalen Artikeln bei den Fragen die Kommentare viel mehr in den Vordergrund rücken.
    z.B. wie bei anderen Frage-Antwort Seiten kann die beste oder nützlichste Antwort vom Fragesteller markiert werden. Alle User können bewerten wie hilfreich eine Antwort war. Die nützlichste Antwort steht dann immer oben… usw.

    Also wenn ihr dieses Feature nach einer Testphase dauerhaft implementiert, dann bitte richtig!

    @Frage:
    bitte keine automatischen Sounds beim Aufruf einer Webseite abspielen…
    Eine schicke und moderne Art bietet z.B. die Mediabox:
    http://iaian7.com/webcode/Mediabox

  19. @123:
    pointiert, aber da ist was dran

    @Manuela Müller:
    ich find´s gut. Nicht immer, aber immer öfter …

    rock on
    ledzep

  20. @0815: Seit gestern sozusagen. War eine spontane Idee der Dr.-Web-Redaktion beziehungsweise von mir. Das soll kein Ersatz für redaktionelle Inhalte sein, sondern eine Möglichkeit, innerhalb der Community zu diskutieren oder auch – nach reichlichem Nachdenken und vorheriger Recherche – Hilfe zu bekommen, wenn man selbst nicht mehr weiter weiß. Warum nicht?

    Frage an alle: Nervt das tatsächlich oder würdet Ihr selbst auch gerne mal Fragen stellen und vom Wissen der anderen profitieren beziehungsweise Euer Wissen mit den anderen teilen? Das soll ja angeblich der vielgelobte Geist der Blogosphäre sein …

  21. Tue ihm einen Gefallen und teile ihm mit, das im Jahr 2010 wirklich niemand eine Website aufruft, die selbstständig Geräusche von sich gibt. Wer seine Lautsprecher aufgedreht hat, wird einen Schock bekommen, wer in einem Großraumbüro sitzt, wird einen Anschiss vom feinsten bekommen und wer weder Lautsprecher noch Kopfhörer aktiv hat kriegt nur schlechte Peformance.

  22. laut.fm macht das beispielsweise auch komplett mit Ajax:
    http://www.laut.fm

    mit den bekannten Problemen wie SEO, Deeplinking usw.

  23. Das Argument „iFrames sind .. veraltet“ würde ich mal dahingehend hinterfragen, ob trotz des Alters der Technik diese das Problem ressourcenschonend löst. Man kann auch in Schönheit sterben..

  24. Seit wann werden persönliche job Probleme hier öffentlich diskutiert? Wenn ich also keine Lust habe über meine Probleme nachzudenken schick ich die euch auch oder wie?

    Mfg

  25. @ Georg: An sich triggern die meisten Popup-Blocker, die ich so kenne, nicht den expliziten Aufruf, sondern den impliziten, d.h. etwa Pop-Unders oder vom onLoad-Event.

    Für Firefox + Chrome ginge natürlich das direkte Abspielen via Ogg Vorbis. Ich würde mal einfach auf diese Flash-Ogg Vorbis-usw. Fallback-Geschichte zurückgreifen. Soweit mir bekannt, werden im Ogg Vorbis vorliegende Musikdateien vom jeweiligen Browser NICHT automatisch wiederholt.

    cu, w0lf.

  26. ich würde das popup bevorzugen weil, wenns eine komplexe Seite ist, die Ajax-Variante ziemlich aufwändig sein kann, insb mit Performance und SEO im Hinterkopf. Popup ist einfach umzusetzen, kann auch direkt verlinkt werden und hat genügend Platz für Playlist, Text und sonstigen Kram. Jeder der Popupblocker einsetzt, weiß auch wie man Ausnahmeregeln definiert, ansonsten kann man noch immer einen Layer mit etwas Hilfetext dazu basteln

  27. Vielen Dank für Eure Antworten!

    Auf die Idee mit Ajax bin ich auch noch nicht gekommen..

    @ Holger: Finde ich eine sehr schöne Lösung!

    Was auch eine Möglichkeit ist, was ich jetzt erst rausgefunden habe, ist es mit
    horizontalem oder vertikalem slider zu lösen. Je nach Seitenaufbau kann so der
    Content „eingeslidet“ werden.

    Siehe als bsp: http://www.edpeixoto.com

  28. Hier ein Beispiel mit Ajax:
    http://sonic-club.de/

    Der Laden hat zwar schon zu, die Seite steht aber noch!:)

  29. Gleiche Frage habe ich mir auch schon öfters gestellt. Ich denke das Ajax die beste Lösung ist. Allerdings so machen das es auch mit ausgeschalteten Ajax noch geht, also unobtrusive vorgehen!

  30. Oder einfach die Seite komplett in Flash machen. Aber AJAX klingt natürlich auch cool. Daran habe ich noch gar nicht gedacht.

  31. Eine halbwegs elegante Lösung findet man z.B. auf http://simfy.de/ .

  32. Seitenwechseln mit Ajax realisieren – dann entfällt das Neuladen. Alternativ bleiben nur Frames und PopUps.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Kennst du schon unseren Newsletter?

Hinweise zum Datenschutz, also dem Einsatz von Double-Opt-In, der Protokollierung der Anmeldung, der Erfolgsmessung, dem Einsatz von MailChimp als Versanddienstleister und deinen Widerrufsrechten findest du in unseren Datenschutzhinweisen.