Audio / Musik auf Websites: Wie du dich dafür oder dagegen entscheidest & was es zu beachten gibt

11. Februar 2016 von Sebastian Maier

Wie man sich zielorientiert für oder gegen Audio entscheidet, und was es bei der Integration technisch zu beachten gibt.

Audio auf einer Website kann eine wunderbare Ergänzung sein, um das positive Erlebnis für den Betrachter noch zu verstärken. Aber Achtung, nicht jedem Besucher gefällt es, wenn ohne sein Zutun plötzlich ein Ton aus seinem Computer oder Smartphone dringt. Gehe ich hingegen auf eine Website zu einer Kinofilmproduktion, würde es mich schon sehr wundern, dort gar keine Musik zu hören.

Daher ist Audio auf Websites aus meiner Erfahrung heraus ein eher umstrittenes Thema – die einen finden es toll, die anderen schrecklich. Ich gehöre zu denen, die Musik auf einer Website nicht so gut finden, wenn man diese nicht selbst steuern kann und es auch nicht dem Zweck der Website dient. Daher ist es wichtig, schon bei der Konzeption einer Website zu prüfen, ob Audio wirklich Sinn macht – oder eben nicht.

Um euch bei der Entscheidungsfindung zu unterstützen, möchte ich euch in diesem Artikel eine einfache Herangehensweise vorstellen, um sich bei einer Website für oder gegen Ton zu entscheiden. Mit dieser Methodik beraten wir bei smooster auch unsere Kunden. Außerdem beschäftige ich mich mit der technischen Umsetzung und zeige zwei gelungene JavaScript-Beispiele für Website-Audio.


Musik: ja oder nein?

Es genügen im Prinzip zwei einfache Fragen, die bei der Website-Konzeption (nicht nur) in Hinblick auf Audio beantwortet werden sollten:

  • Für wen ist die Website?
  • Was will ich mit der Website erreichen und kann mich Ton dabei unterstützen?


Für wen ist meine Website?
Hier geht es darum, welche Zielgruppe meine Website wahrscheinlich erreichen wird beziehungsweise soll.

Wenn ich davon ausgehen kann, dass meine Besucher hauptsächlich in ihrer Arbeitsumgebung auf meine Website gehen, wird Ton wahrscheinlich als störend wahrgenommen. Besonders wenn er ungefragt losgeht.

Hat meine Website einen Unterhaltungswert für die Besucher, kann passende Musik eine geniale Unterstützung sein. Dies betrifft vor allem Websites aus dem Entertainment-Bereich.


Was will ich mit der Website erreichen und kann mich Audio dabei unterstützen?
Neben der Zielgruppe kommt es natürlich auch auf die Zielsetzung der Website ein.

Besitze ich ein Restaurant oder eine Lounge und möchte mit Ambiente-Musik auf der Website dem Besucher bereits einen Eindruck vermitteln, worauf er sich bei mir freuen kann… super Idee!

Hat mein Produkt oder eine Dienstleistung wenig mit Unterhaltung zu tun, sollte man eher vorsichtig sein.


Was noch bei Audio auf Websites zu beachten ist

Hat man sich nun für Audio auf der Website entschieden, sollte man die folgenden Punkte beachten:

  1. Der Ton muss zum Produkt/der Dienstleistung passen.
    Wie oben beschrieben macht es bei einem Kinofilm oder einem Computerspiel beispielsweise Sinn, Musik einzubinden. Bei Websites mit anderen Inhalten sind andere Töne möglicherweise passender, siehe unsere JavaScript-Beispiele weiter unten.

  2. Seitenabbruch beim Aufruf der Website ist ein großes Risiko.
    Sicherlich ist es euch auch schon so ergangen: Ihr ruft eine Website auf, die Musik fängt direkt an zu spielen und ihr fallt vor Schreck fast vom Stuhl. Oder ihr befindet euch an einem Ort, an dem Lärm vermieden werden sollte. Das Ergebnis wird bei euch wie bei mir das Gleiche sein: Entweder ihr verlasst die Website direkt wieder oder ihr sucht den Aus-Knopf und verlasst die Website, wenn ihr keinen findet.

    Ein gut sichtbarer Aus-Knopf ist hier also unerlässlich, um Seitenabbrüche zu vermeiden – am besten fix (also scroll-unabhängig positioniert), damit man ihn immer einfach und schnell erreichen kann.

    Manche Websitebesucher können sich jedoch nicht konzentrieren, wenn Musik läuft und werden alleine deshalb die Website verlassen, weil sie gar nicht aufnehmen können, was dort geschrieben steht. Dann hilft auch ein Aus-Knopf nicht mehr weiter. Ein Rest-Risiko bleibt bei jedem ungewöhnlichen Website-Effekt wohl immer.

  3. Audio-Ladezeit kann die Performance der Website beeinträchtigen.
    Wer schon an meinen Webtrends-Webinaren teilgenommen hat weiß, dass Performance sehr wichtig ist. Denn wird die Website nicht unter 3 Sekunden geladen, verlässt der Besucher sie in der Regel schnell wieder. Streaming sowie Nachladen der Audio-Daten kann hier helfen.


Die Technik hinter Audio auf Websites

Immer noch nicht abgeschreckt von Audio auf Websites :)? Dann kommen wir nun zu den technischen Details.

Audio kann dank html5 auf vielfältige Weise in eine Website integriert werden. Entweder als Hintergrundmusik, in Form von Videos mit Audio oder als kleine Audioelemente wie beispielsweise ein Musikplayer.


Javascript-Beispiele mit Audio

Zum Abschluss möchte ich euch noch zwei Javascript-Beispiele zeigen, in die aus meiner Sicht Ton wirklich gelungen und innovativ integriert wurde.

Beispiel Aufzugssound bei der “Scroll to Top”-Animation: http://tholman.com/elevator.js/

Beispiel von loudlinks (der Name ist Programm): http://loudlinks.rocks/#examples
Neben der Möglichkeit, einen Button für das Starten und Enden der Musik einzubauen, habe ich mit loudlinks ein JavaScript gefunden, das es ermöglicht, partiell Musik zu starten. Fahrt ihr mit dem Mauszeiger über einen Button oder klickt ihr darauf, dann erklingt ein Ton. Wie ihr in dem Beispiel sehen könnt, funktioniert das auch, wenn man über ein GIF fährt. Ich finde, das ist eine tolle Option, wenn euer Kunde gerne Musik auf seiner Website verwenden möchte.


Fazit

Die Entscheidung für oder gegen Audio auf einer Website hängt von der Zielgruppe und von der Zielsetzung ab. Wenn sich Nutzer die Website eher auf der Arbeit anschauen, können Töne als störend empfunden werden. Daheim zur Unterhaltung gehört Musik aber oftmals einfach dazu.

Generell ist ein gut sichtbar platzierter Aus-Knopf immer sinnvoll und reduziert Seitenabbrüche.



Würdet ihr die Tonelemente unserer Website-Beispiele auch selbst einsetzen? Wie findet ihr sie? Und wie steht ihr zu Musik bei Websites?


(Headerbild: Foto von Alper Çuğun, flickr.com/Creative Common Licence)

zurück
comments powered by Disqus