{"id":401,"date":"2026-10-23T01:27:00","date_gmt":"2026-10-22T23:27:00","guid":{"rendered":"https:\/\/0o5.de\/magazin\/glossar\/web-audio\/"},"modified":"2026-10-23T18:52:35","modified_gmt":"2026-10-23T16:52:35","slug":"web-audio","status":"publish","type":"page","link":"https:\/\/0o5.de\/magazin\/glossar\/web-audio\/","title":{"rendered":"Web Audio: So entstehen Musik und Kl\u00e4nge im Browserspiel"},"content":{"rendered":"\n<div id=\"definition\" class=\"wp-block-group gl-def is-layout-flow wp-block-group-is-layout-flow\">\n<p class=\"gl-def__label wp-block-paragraph\">Kurz erkl\u00e4rt <span>\u00b7 Technik &amp; Plattform<\/span><\/p>\n\n\n\n<p class=\"gl-def__text wp-block-paragraph\">Web Audio ist eine Programmierschnittstelle im Webbrowser (Web Audio API), mit der Webseiten Kl\u00e4nge erzeugen, abspielen und bearbeiten \u2013 aus Bausteinen wie Tongenerator, Filter und Lautst\u00e4rke, die zu einer Signalkette verbunden werden.<\/p>\n\n\n\n<p class=\"gl-def__alt wp-block-paragraph\">Auch: Web Audio API, WebAudio, AudioContext, Web-Audio-Schnittstelle<\/p>\n<\/div>\n\n\n\n<figure class=\"gl-anim\" id=\"animation\"><input type=\"checkbox\" class=\"gl-anim__pause\" id=\"gl-pause-web-audio\"><label for=\"gl-pause-web-audio\" class=\"gl-anim__btn\"><span class=\"gl-anim__p\">Animation anhalten<\/span><span class=\"gl-anim__r\">Animation fortsetzen<\/span><\/label><div class=\"gl-anim__stage\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"g-web-audio\" viewBox=\"0 0 640 360\" role=\"img\" aria-labelledby=\"g-web-audio-t g-web-audio-d\">\n<title id=\"g-web-audio-t\">Web Audio einfach erkl\u00e4rt: Klang aus Bausteinen<\/title>\n<desc id=\"g-web-audio-d\">Ein Spiel-Ereignis \u201eSprung\u201c l\u00f6st einen Klang aus. Das Signal l\u00e4uft durch vier verbundene Bausteine: Der Oszillator erzeugt eine eckige Schwingung, der Filter rundet sie ab, die Lautst\u00e4rke macht sie kleiner, und die Ausgabe schickt sie an den Lautsprecher, der Schallwellen abgibt.<\/desc>\n<style>\n.g-web-audio{font-family:\"Space Grotesk\",system-ui,sans-serif}\n.g-web-audio .bg{fill:#131823}\n.g-web-audio .node{fill:#1d2433;stroke:#3a4458;stroke-width:2}\n.g-web-audio .on{fill:none;stroke:#ffd700;stroke-width:3}\n.g-web-audio .h{fill:#e8ebf2;font-size:18px;font-weight:700}\n.g-web-audio .t{fill:#e8ebf2;font-size:16px;font-weight:700}\n.g-web-audio .lbl{fill:#aab3c5;font-size:15px}\n.g-web-audio .cab{stroke:#a78bfa;stroke-width:3}\n.g-web-audio .ah{fill:#a78bfa}\n.g-web-audio .scope{fill:#1d2433}\n.g-web-audio .mid{stroke:#aab3c5;stroke-opacity:.25;stroke-dasharray:4 6}\n.g-web-audio .w{fill:none;stroke:#4ade80;stroke-width:3;stroke-linejoin:round}\n.g-web-audio .spk{fill:#e8ebf2}\n.g-web-audio .arc{fill:none;stroke:#4ade80;stroke-width:4;stroke-linecap:round}\n.g-web-audio .ev{fill:#ffd700}\n.g-web-audio .evt{fill:#131823;font-size:15px;font-weight:700}\n.g-web-audio .evg{animation:g-web-audio-ev 6s linear infinite}\n.g-web-audio .o1,.g-web-audio .w1{animation:g-web-audio-s1 6s linear infinite}\n.g-web-audio .o2,.g-web-audio .w2{animation:g-web-audio-s2 6s linear infinite}\n.g-web-audio .o3{animation:g-web-audio-s3 6s linear infinite}\n.g-web-audio .o4{animation:g-web-audio-s4 6s linear infinite}\n.g-web-audio .w3{animation:g-web-audio-w3 6s linear infinite}\n.g-web-audio .a1{animation:g-web-audio-a1 6s linear infinite}\n.g-web-audio .a2{animation:g-web-audio-a2 6s linear infinite}\n@keyframes g-web-audio-ev{0%{opacity:.35}3%,9%{opacity:1}14%,100%{opacity:.35}}\n@keyframes g-web-audio-s1{0%,6%{opacity:0}9%,29%{opacity:1}32%,100%{opacity:0}}\n@keyframes g-web-audio-s2{0%,29%{opacity:0}32%,54%{opacity:1}57%,100%{opacity:0}}\n@keyframes g-web-audio-s3{0%,54%{opacity:0}57%,74%{opacity:1}77%,100%{opacity:0}}\n@keyframes g-web-audio-s4{0%,74%{opacity:0}77%,95%{opacity:1}98%,100%{opacity:0}}\n@keyframes g-web-audio-w3{0%,54%{opacity:0}57%,95%{opacity:1}98%,100%{opacity:0}}\n@keyframes g-web-audio-a1{0%,76%{opacity:0}80%{opacity:1}85%{opacity:.2}89%{opacity:1}94%{opacity:.2}97%,100%{opacity:0}}\n@keyframes g-web-audio-a2{0%,78%{opacity:0}82%{opacity:1}87%{opacity:.2}91%{opacity:1}95%{opacity:.2}98%,100%{opacity:0}}\n@media (prefers-reduced-motion:reduce){.g-web-audio *{animation:none!important}.g-web-audio .w1,.g-web-audio .w3{opacity:0}.g-web-audio .on,.g-web-audio .w2,.g-web-audio .arc,.g-web-audio .evg{opacity:1}}\n<\/style>\n<rect class=\"bg\" width=\"640\" height=\"360\" rx=\"18\"\/>\n<text class=\"h\" x=\"40\" y=\"44\">Klang aus Bausteinen<\/text>\n<g class=\"evg\"><path d=\"M520 56V86H90V108\" fill=\"none\" stroke=\"#ffd700\" stroke-width=\"2\" stroke-dasharray=\"6 5\"\/><path class=\"ev\" d=\"M90 116l-6-10h12z\"\/><text class=\"lbl\" x=\"306\" y=\"80\" text-anchor=\"middle\">l\u00f6st aus<\/text><rect class=\"ev\" x=\"430\" y=\"24\" width=\"180\" height=\"32\" rx=\"16\"\/><text class=\"evt\" x=\"520\" y=\"45\" text-anchor=\"middle\">Spiel: \u201eSprung!\u201c<\/text><\/g>\n<path class=\"cab\" d=\"M150 155H172M300 155H322M450 155H472\"\/>\n<path class=\"ah\" d=\"M180 155l-10-6v12zM330 155l-10-6v12zM480 155l-10-6v12z\"\/>\n<rect class=\"node\" x=\"30\" y=\"118\" width=\"120\" height=\"74\" rx=\"12\"\/>\n<text class=\"t\" x=\"90\" y=\"150\" text-anchor=\"middle\">Oszillator<\/text><text class=\"lbl\" x=\"90\" y=\"174\" text-anchor=\"middle\">erzeugt Ton<\/text>\n<rect class=\"node\" x=\"180\" y=\"118\" width=\"120\" height=\"74\" rx=\"12\"\/>\n<text class=\"t\" x=\"240\" y=\"150\" text-anchor=\"middle\">Filter<\/text><text class=\"lbl\" x=\"240\" y=\"174\" text-anchor=\"middle\">formt Klang<\/text>\n<rect class=\"node\" x=\"330\" y=\"118\" width=\"120\" height=\"74\" rx=\"12\"\/>\n<text class=\"t\" x=\"390\" y=\"150\" text-anchor=\"middle\">Lautst\u00e4rke<\/text><text class=\"lbl\" x=\"390\" y=\"174\" text-anchor=\"middle\">leiser, lauter<\/text>\n<rect class=\"node\" x=\"480\" y=\"118\" width=\"130\" height=\"74\" rx=\"12\"\/>\n<text class=\"t\" x=\"545\" y=\"150\" text-anchor=\"middle\">Ausgabe<\/text><text class=\"lbl\" x=\"545\" y=\"174\" text-anchor=\"middle\">Lautsprecher<\/text>\n<rect class=\"on o1\" x=\"30\" y=\"118\" width=\"120\" height=\"74\" rx=\"12\"\/>\n<rect class=\"on o2\" x=\"180\" y=\"118\" width=\"120\" height=\"74\" rx=\"12\"\/>\n<rect class=\"on o3\" x=\"330\" y=\"118\" width=\"120\" height=\"74\" rx=\"12\"\/>\n<rect class=\"on o4\" x=\"480\" y=\"118\" width=\"130\" height=\"74\" rx=\"12\"\/>\n<rect class=\"scope\" x=\"30\" y=\"212\" width=\"450\" height=\"118\" rx=\"12\"\/>\n<text class=\"lbl\" x=\"46\" y=\"236\">Signal<\/text>\n<line class=\"mid\" x1=\"50\" y1=\"282\" x2=\"460\" y2=\"282\"\/>\n<path class=\"w w1\" d=\"M50 252h41v60h41v-60h41v60h41v-60h41v60h41v-60h41v60h41v-60h41v60h41\"\/>\n<path class=\"w w2\" d=\"M50 282q20.5-60 41 0t41 0t41 0t41 0t41 0t41 0t41 0t41 0t41 0t41 0\"\/>\n<path class=\"w w3\" d=\"M50 282q20.5-28 41 0t41 0t41 0t41 0t41 0t41 0t41 0t41 0t41 0t41 0\"\/>\n<path class=\"spk\" d=\"M508 264h14l20-18v72l-20-18h-14z\"\/>\n<path class=\"arc a1\" d=\"M556 266a24 24 0 0 1 0 32\"\/>\n<path class=\"arc a2\" d=\"M570 254a40 40 0 0 1 0 56\"\/>\n<\/svg><\/div><figcaption><b>So funktioniert\u2019s:<\/b> Ein Spiel-Ereignis l\u00f6st einen Ton aus: Oszillator, Filter und Lautst\u00e4rke formen das Signal, bevor es aus dem Lautsprecher kommt.<\/figcaption><\/figure>\n\n\n\n<nav class=\"mag-toc\" aria-label=\"Inhalt\"><details><summary>Inhalt<\/summary><ol><li><a href=\"#bedeutung\">Was ist Web Audio?<\/a><\/li><li><a href=\"#funktion\">Wie funktioniert Web Audio?<\/a><\/li><li><a href=\"#kein-ton\">Warum hat ein Browserspiel manchmal keinen Ton?<\/a><\/li><li><a href=\"#unterschied\">Web Audio oder Audio-Element: der Unterschied<\/a><\/li><li><a href=\"#beispiele\">Web Audio in Spielen auf Player 0o5<\/a><\/li><li><a href=\"#faq\">H\u00e4ufige Fragen<\/a><\/li><li><a href=\"#verwandte-begriffe\">Verwandte Begriffe<\/a><\/li><\/ol><\/details><\/nav>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"bedeutung\">Was ist Web Audio?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Die <strong>Web Audio API<\/strong> ist ein Web-Standard des W3C, des Gremiums f\u00fcr Web-Standards, und seit 2021 eine offizielle Empfehlung. Sie gibt Webseiten ein kleines Tonstudio an die Hand: Kl\u00e4nge laden oder selbst erzeugen, mischen, filtern, im Raum verteilen und auf die Millisekunde genau starten.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">F\u00fcr Spiele ist das wichtig, weil jede Aktion sofort h\u00f6rbar sein muss \u2013 ein Sprung, ein Treffer, ein M\u00fcnzklang. Mehrere Ger\u00e4usche laufen gleichzeitig, ohne sich gegenseitig abzuschneiden. Manche Spiele erzeugen sogar ihre ganze Musik live im Browser, \u00e4hnlich wie die Soundchips der <a href=\"https:\/\/0o5.de\/magazin\/glossar\/8-bit\/\">8-Bit<\/a>-Zeit.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"funktion\">Wie funktioniert Web Audio?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Herzst\u00fcck ist der <code>AudioContext<\/code>, eine Art Mischpult. Darin verbindet ein Spiel Bausteine, sogenannte <em>Nodes<\/em>, zu einer Signalkette:<\/p>\n\n\n\n<figure class=\"wp-block-table mag-table\"><table><thead><tr><th>Baustein<\/th><th>Aufgabe<\/th><th>Beispiel im Spiel<\/th><\/tr><\/thead><tbody><tr><td>Oszillator<\/td><td>Erzeugt einen Ton in einer Grundform: Sinus, Rechteck, Dreieck oder S\u00e4gezahn<\/td><td>Piepsen, Laser, Bass einer Chiptune-Melodie<\/td><\/tr><tr><td>Audiopuffer<\/td><td>Spielt eine geladene Aufnahme ab<\/td><td>Stimme, Explosion, Applaus<\/td><\/tr><tr><td>Filter<\/td><td>Nimmt H\u00f6hen oder Tiefen weg und formt den Klang<\/td><td>Dumpfer Klang unter Wasser<\/td><\/tr><tr><td>Lautst\u00e4rke (Gain)<\/td><td>Macht leiser oder lauter, blendet ein und aus<\/td><td>Musik leiser, wenn das Men\u00fc offen ist<\/td><\/tr><tr><td>Panner<\/td><td>Verteilt den Klang nach links, rechts oder in den Raum<\/td><td>Gegner kommt von rechts<\/td><\/tr><tr><td>Ausgabe<\/td><td>Schickt das Ergebnis an Lautsprecher oder Kopfh\u00f6rer<\/td><td>Alles, was du h\u00f6rst<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Web Audio hat eine eigene, sehr genaue Uhr. Ein Spiel kann T\u00f6ne deshalb exakt im Takt einplanen, statt sie nur \u201eungef\u00e4hr jetzt\u201c abzuspielen. Das ist die Grundlage f\u00fcr Rhythmus-Mechaniken und f\u00fcr <a href=\"https:\/\/0o5.de\/magazin\/glossar\/chiptune\/\">Chiptune<\/a>-Musik, die Note f\u00fcr Note im Code entsteht.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"kein-ton\">Warum hat ein Browserspiel manchmal keinen Ton?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Browser spielen Ton erst ab, wenn du mit der Seite etwas gemacht hast \u2013 getippt, geklickt oder eine Taste gedr\u00fcckt. Diese Regel sch\u00fctzt vor Webseiten, die ungefragt losdr\u00f6hnen. Viele Spiele starten deshalb mit einem Knopf wie \u201eLos\u201c oder \u201eTon an\u201c.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Einmal ins Spiel tippen oder klicken.<\/li>\n\n<li>Lautst\u00e4rke des Ger\u00e4ts und einen Stummschalter pr\u00fcfen.<\/li>\n\n<li>Ton- und Musikregler in den Optionen des Spiels pr\u00fcfen.<\/li>\n\n<li>Ist das Handy lautlos gestellt, bleiben manche Browser auch im Spiel stumm.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"unterschied\">Web Audio oder Audio-Element: der Unterschied<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">F\u00fcr einfache F\u00e4lle gibt es in HTML das <code>&lt;audio&gt;<\/code>-Element: Datei abspielen, anhalten, fertig. Das reicht f\u00fcr Hintergrundmusik oder einen Podcast. F\u00fcr Spiele ist es zu grob, denn es startet nicht millisekundengenau und kann Kl\u00e4nge kaum ver\u00e4ndern.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Web Audio erzeugt T\u00f6ne dagegen auch ohne Datei, mischt viele Quellen und reagiert sofort. Das spart Ladezeit: Ein Spiel, das seine Musik im Code erzeugt, muss keine gro\u00dfen Musikdateien herunterladen. Das Gegenst\u00fcck f\u00fcr die Grafik ist das <a href=\"https:\/\/0o5.de\/magazin\/glossar\/html5-canvas\/\">HTML5-Canvas<\/a>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"beispiele\">Web Audio in Spielen auf Player 0o5<\/h2>\n\n\n\n<ul class=\"gl-games\"><li class=\"gl-game\"><a class=\"gl-game__img\" href=\"https:\/\/0o5.de\/magazin\/horde-horden-shooter-210\/\" tabindex=\"-1\" aria-hidden=\"true\"><img src=\"https:\/\/0o5.de\/magazin\/wp-content\/uploads\/2026\/10\/horde-horden-shooter-1-768x480.jpg\" alt=\"\" width=\"768\" height=\"480\" loading=\"lazy\" decoding=\"async\"><\/a><div class=\"gl-game__body\"><h3 class=\"gl-game__name\"><a href=\"https:\/\/0o5.de\/magazin\/horde-horden-shooter-210\/\">Horde<\/a><\/h3><p>In <a href=\"https:\/\/0o5.de\/magazin\/horde-horden-shooter-210\/\">Horde<\/a> werden Musik, Grafik und Ger\u00e4usche live erzeugt, das Spiel ist deshalb nur rund 0,3 MB gro\u00df. Ein Ring um deine Figur schrumpft genau auf den n\u00e4chsten Schlag zu; tippst du im Takt, gibt es Groove und mehr Schaden.<\/p><p class=\"gl-game__links\"><a class=\"gl-game__play\" href=\"https:\/\/0o5.de\/games\/action\/horde\/\" data-s05-cat=\"Glossar\" data-s05-ev=\"Spiel \u00f6ffnen|Horde\"><svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M7 5l12 7-12 7z\" fill=\"currentColor\"\/><\/svg><span>Horde spielen<\/span><\/a><a class=\"gl-game__guide\" href=\"https:\/\/0o5.de\/magazin\/horde-horden-shooter-210\/\">Zum Guide<\/a><\/p><\/div><\/li><li class=\"gl-game\"><a class=\"gl-game__img\" href=\"https:\/\/0o5.de\/magazin\/kernsturm-212\/\" tabindex=\"-1\" aria-hidden=\"true\"><img src=\"https:\/\/0o5.de\/magazin\/wp-content\/uploads\/2026\/10\/kernsturm-1-768x480.jpg\" alt=\"\" width=\"768\" height=\"480\" loading=\"lazy\" decoding=\"async\"><\/a><div class=\"gl-game__body\"><h3 class=\"gl-game__name\"><a href=\"https:\/\/0o5.de\/magazin\/kernsturm-212\/\">Kernsturm<\/a><\/h3><p><a href=\"https:\/\/0o5.de\/magazin\/kernsturm-212\/\">Kernsturm<\/a> erzeugt Grafik, Musik und Kl\u00e4nge im Code. Das ganze <a href=\"https:\/\/0o5.de\/magazin\/glossar\/run-and-gun\/\">Run &#038; Gun<\/a> mit sechs Welten ist dadurch nur rund 0,8 MB gro\u00df.<\/p><p class=\"gl-game__links\"><a class=\"gl-game__play\" href=\"https:\/\/0o5.de\/games\/action\/kernsturm\/\" data-s05-cat=\"Glossar\" data-s05-ev=\"Spiel \u00f6ffnen|Kernsturm\"><svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M7 5l12 7-12 7z\" fill=\"currentColor\"\/><\/svg><span>Kernsturm spielen<\/span><\/a><a class=\"gl-game__guide\" href=\"https:\/\/0o5.de\/magazin\/kernsturm-212\/\">Zum Guide<\/a><\/p><\/div><\/li><li class=\"gl-game\"><a class=\"gl-game__img\" href=\"https:\/\/0o5.de\/magazin\/turmwacht-tower-defense-119\/\" tabindex=\"-1\" aria-hidden=\"true\"><img src=\"https:\/\/0o5.de\/magazin\/wp-content\/uploads\/2026\/10\/turmwacht-tower-defense-1-768x480.jpg\" alt=\"\" width=\"768\" height=\"480\" loading=\"lazy\" decoding=\"async\"><\/a><div class=\"gl-game__body\"><h3 class=\"gl-game__name\"><a href=\"https:\/\/0o5.de\/magazin\/turmwacht-tower-defense-119\/\">Turmwacht<\/a><\/h3><p><a href=\"https:\/\/0o5.de\/magazin\/turmwacht-tower-defense-119\/\">Turmwacht<\/a> erzeugt Grafik, Musik und Kl\u00e4nge im Spiel selbst und kommt so auf nur rund 0,2 MB. Musik und Ger\u00e4usche regelst du in den Optionen.<\/p><p class=\"gl-game__links\"><a class=\"gl-game__play\" href=\"https:\/\/0o5.de\/games\/strategie\/turmwacht\/\" data-s05-cat=\"Glossar\" data-s05-ev=\"Spiel \u00f6ffnen|Turmwacht\"><svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M7 5l12 7-12 7z\" fill=\"currentColor\"\/><\/svg><span>Turmwacht spielen<\/span><\/a><a class=\"gl-game__guide\" href=\"https:\/\/0o5.de\/magazin\/turmwacht-tower-defense-119\/\">Zum Guide<\/a><\/p><\/div><\/li><li class=\"gl-game\"><a class=\"gl-game__img\" href=\"https:\/\/0o5.de\/magazin\/keks-imperium-171\/\" tabindex=\"-1\" aria-hidden=\"true\"><img src=\"https:\/\/0o5.de\/magazin\/wp-content\/uploads\/2026\/10\/keks-imperium-1-768x480.jpg\" alt=\"\" width=\"768\" height=\"480\" loading=\"lazy\" decoding=\"async\"><\/a><div class=\"gl-game__body\"><h3 class=\"gl-game__name\"><a href=\"https:\/\/0o5.de\/magazin\/keks-imperium-171\/\">Keks-Imperium<\/a><\/h3><p>Auch bei <a href=\"https:\/\/0o5.de\/magazin\/keks-imperium-171\/\">Keks-Imperium<\/a> entstehen Grafik und Musik im Spiel selbst; in den Optionen stellst du Musik und Lautst\u00e4rke ein.<\/p><p class=\"gl-game__links\"><a class=\"gl-game__play\" href=\"https:\/\/0o5.de\/games\/strategie\/keksimperium\/\" data-s05-cat=\"Glossar\" data-s05-ev=\"Spiel \u00f6ffnen|Keks-Imperium\"><svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M7 5l12 7-12 7z\" fill=\"currentColor\"\/><\/svg><span>Keks-Imperium spielen<\/span><\/a><a class=\"gl-game__guide\" href=\"https:\/\/0o5.de\/magazin\/keks-imperium-171\/\">Zum Guide<\/a><\/p><\/div><\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"faq\">H\u00e4ufige Fragen zu Web Audio<\/h2>\n\n\n\n<details class=\"wp-block-details mag-faq is-layout-flow wp-block-details-is-layout-flow\"><summary>Was ist die Web Audio API?<\/summary>\n<p class=\"wp-block-paragraph\">Die Web Audio API ist eine Schnittstelle im Browser, mit der Webseiten Kl\u00e4nge erzeugen und bearbeiten. Sie verbindet Bausteine wie Tongenerator, Filter und Lautst\u00e4rkeregler zu einer Signalkette.<\/p>\n<\/details>\n\n\n\n<details class=\"wp-block-details mag-faq is-layout-flow wp-block-details-is-layout-flow\"><summary>Warum startet der Ton erst nach dem ersten Tippen?<\/summary>\n<p class=\"wp-block-paragraph\">Browser erlauben Ton erst nach einer Aktion von dir, etwa einem Tippen oder Klick. So spielt keine Seite ungefragt Ger\u00e4usche ab.<\/p>\n<\/details>\n\n\n\n<details class=\"wp-block-details mag-faq is-layout-flow wp-block-details-is-layout-flow\"><summary>Braucht Web Audio Sounddateien?<\/summary>\n<p class=\"wp-block-paragraph\">Nicht unbedingt. Ein Oszillator erzeugt T\u00f6ne direkt im Code. Viele Spiele mischen beides: erzeugte Effekte und geladene Aufnahmen.<\/p>\n<\/details>\n\n\n\n<details class=\"wp-block-details mag-faq is-layout-flow wp-block-details-is-layout-flow\"><summary>Funktioniert Web Audio auf dem Handy?<\/summary>\n<p class=\"wp-block-paragraph\">Ja, aktuelle Browser auf Handy, Tablet und PC unterst\u00fctzen Web Audio. Ist das Ger\u00e4t lautlos gestellt, bleibt der Ton je nach Browser trotzdem aus.<\/p>\n<\/details>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"verwandte-begriffe\">Verwandte Begriffe<\/h2>\n\n\n\n<ul class=\"gl-rel\"><li><a href=\"https:\/\/0o5.de\/magazin\/glossar\/chiptune\/\"><small>Grafik &amp; Sound<\/small><b>Chiptune<\/b><span>Rechteck, Dreieck, Rauschen: Wie Chiptunes aus wenigen Klangwellen ganze Songs bauen \u2013 und welche Spiele auf 0o5.de ihre Musik live erzeugen.<\/span><\/a><\/li><li><a href=\"https:\/\/0o5.de\/magazin\/glossar\/8-bit\/\"><small>Retro &amp; DDR-Heimcomputer<\/small><b>8-Bit<\/b><span>Was bedeutet 8-Bit? Bits und Bytes einfach erkl\u00e4rt, warum 255 die gr\u00f6\u00dfte Zahl ist und was 8-Bit-Grafik und -Sound mit alten Prozessoren zu tun haben.<\/span><\/a><\/li><li><a href=\"https:\/\/0o5.de\/magazin\/glossar\/html5-canvas\/\"><small>Technik &amp; Plattform<\/small><b>HTML5-Canvas<\/b><span>Die Leinwand im Browser: Auf dem Canvas malen Spiele ihr Bild Pixel f\u00fcr Pixel \u2013 meist 60-mal pro Sekunde neu.<\/span><\/a><\/li><li><a href=\"https:\/\/0o5.de\/magazin\/glossar\/browserspiel\/\"><small>Genres &amp; Spielarten<\/small><b>Browserspiel<\/b><span>Adresse \u00f6ffnen und losspielen: Was ein Browserspiel ist, welche Webtechnik dahintersteckt und was es von Apps und Progressive Web Apps unterscheidet.<\/span><\/a><\/li><li><a href=\"https:\/\/0o5.de\/magazin\/glossar\/webgl\/\"><small>Technik &amp; Plattform<\/small><b>WebGL<\/b><span>Wie kommt 3D in den Browser? WebGL l\u00e4sst die Grafikkarte rechnen \u2013 aus Eckpunkten werden Dreiecke, aus Dreiecken Pixel.<\/span><\/a><\/li><\/ul>\n\n\n\n<p class=\"gl-back\"><a class=\"mag-btn mag-btn--ghost\" href=\"https:\/\/0o5.de\/magazin\/glossar\/\">\u2190 Alle 199 Begriffe im Spiele-Glossar<\/a><a class=\"mag-btn mag-btn--play\" href=\"https:\/\/0o5.de\/\" data-s05-cat=\"Glossar\" data-s05-ev=\"Zur Spieleseite|Web Audio\"><svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" aria-hidden=\"true\"><path d=\"M7 5l12 7-12 7z\" fill=\"currentColor\"\/><\/svg><span>Zu den Spielen<\/span><\/a><\/p>\n\n\n\n<script type=\"application\/ld+json\">{\"@context\": \"https:\/\/schema.org\", \"@graph\": [{\"@type\": \"DefinedTerm\", \"@id\": \"https:\/\/0o5.de\/magazin\/glossar\/web-audio\/#begriff\", \"name\": \"Web Audio\", \"description\": \"Web Audio ist eine Programmierschnittstelle im Webbrowser (Web Audio API), mit der Webseiten Kl\u00e4nge erzeugen, abspielen und bearbeiten \u2013 aus Bausteinen wie Tongenerator, Filter und Lautst\u00e4rke, die zu einer Signalkette verbunden werden.\", \"url\": \"https:\/\/0o5.de\/magazin\/glossar\/web-audio\/\", \"inLanguage\": \"de\", \"inDefinedTermSet\": {\"@id\": \"https:\/\/0o5.de\/magazin\/glossar\/#glossar\"}, \"subjectOf\": {\"@id\": \"https:\/\/0o5.de\/magazin\/glossar\/web-audio\/#richSnippet\"}, \"alternateName\": [\"Web Audio API\", \"WebAudio\", \"AudioContext\", \"Web-Audio-Schnittstelle\"], \"sameAs\": [\"https:\/\/de.wikipedia.org\/wiki\/Web_Audio_API\", \"https:\/\/www.wikidata.org\/wiki\/Q26806589\"], \"image\": \"https:\/\/0o5.de\/magazin\/wp-content\/uploads\/2026\/10\/glossar-web-audio-1.jpg\"}, {\"@type\": \"DefinedTermSet\", \"@id\": \"https:\/\/0o5.de\/magazin\/glossar\/#glossar\", \"name\": \"Spiele-Glossar von Player 0o5\", \"url\": \"https:\/\/0o5.de\/magazin\/glossar\/\", \"inLanguage\": \"de\", \"publisher\": {\"@id\": \"https:\/\/0o5.de\/magazin\/#organization\"}}, {\"@type\": \"WebPage\", \"@id\": \"https:\/\/0o5.de\/magazin\/glossar\/web-audio\/#webpage\", \"about\": {\"@id\": \"https:\/\/0o5.de\/magazin\/glossar\/web-audio\/#begriff\"}, \"mainEntity\": {\"@id\": \"https:\/\/0o5.de\/magazin\/glossar\/web-audio\/#begriff\"}, \"isPartOf\": {\"@id\": \"https:\/\/0o5.de\/magazin\/#website\"}, \"speakable\": {\"@type\": \"SpeakableSpecification\", \"cssSelector\": [\".gl-def__text\"]}, \"keywords\": \"web audio, sound im browser, browserspiel kein ton, audiocontext, musik live erzeugen, chiptune im browser\", \"mentions\": [{\"@id\": \"https:\/\/0o5.de\/games\/action\/horde\/#spiel\"}, {\"@id\": \"https:\/\/0o5.de\/games\/action\/kernsturm\/#spiel\"}, {\"@id\": \"https:\/\/0o5.de\/games\/strategie\/turmwacht\/#spiel\"}, {\"@id\": \"https:\/\/0o5.de\/games\/strategie\/keksimperium\/#spiel\"}], \"relatedLink\": [\"https:\/\/0o5.de\/magazin\/glossar\/chiptune\/\", \"https:\/\/0o5.de\/magazin\/glossar\/8-bit\/\", \"https:\/\/0o5.de\/magazin\/glossar\/html5-canvas\/\", \"https:\/\/0o5.de\/magazin\/glossar\/browserspiel\/\", \"https:\/\/0o5.de\/magazin\/glossar\/webgl\/\"]}, {\"@type\": \"FAQPage\", \"@id\": \"https:\/\/0o5.de\/magazin\/glossar\/web-audio\/#faq\", \"inLanguage\": \"de\", \"mainEntity\": [{\"@type\": \"Question\", \"name\": \"Was ist die Web Audio API?\", \"acceptedAnswer\": {\"@type\": \"Answer\", \"text\": \"Die Web Audio API ist eine Schnittstelle im Browser, mit der Webseiten Kl\u00e4nge erzeugen und bearbeiten. Sie verbindet Bausteine wie Tongenerator, Filter und Lautst\u00e4rkeregler zu einer Signalkette.\"}}, {\"@type\": \"Question\", \"name\": \"Warum startet der Ton erst nach dem ersten Tippen?\", \"acceptedAnswer\": {\"@type\": \"Answer\", \"text\": \"Browser erlauben Ton erst nach einer Aktion von dir, etwa einem Tippen oder Klick. So spielt keine Seite ungefragt Ger\u00e4usche ab.\"}}, {\"@type\": \"Question\", \"name\": \"Braucht Web Audio Sounddateien?\", \"acceptedAnswer\": {\"@type\": \"Answer\", \"text\": \"Nicht unbedingt. Ein Oszillator erzeugt T\u00f6ne direkt im Code. Viele Spiele mischen beides: erzeugte Effekte und geladene Aufnahmen.\"}}, {\"@type\": \"Question\", \"name\": \"Funktioniert Web Audio auf dem Handy?\", \"acceptedAnswer\": {\"@type\": \"Answer\", \"text\": \"Ja, aktuelle Browser auf Handy, Tablet und PC unterst\u00fctzen Web Audio. Ist das Ger\u00e4t lautlos gestellt, bleibt der Ton je nach Browser trotzdem aus.\"}}]}]}<\/script>\n","protected":false},"excerpt":{"rendered":"<p>Klang aus Bausteinen: Mit Web Audio erzeugen Browserspiele Effekte und Musik live \u2013 ohne gro\u00dfe Sounddateien.<\/p>\n","protected":false},"author":1,"featured_media":235,"parent":42,"menu_order":186,"comment_status":"closed","ping_status":"closed","template":"glossar-begriff","meta":{"footnotes":""},"class_list":["post-401","page","type-page","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/0o5.de\/magazin\/wp-json\/wp\/v2\/pages\/401","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/0o5.de\/magazin\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/0o5.de\/magazin\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/0o5.de\/magazin\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/0o5.de\/magazin\/wp-json\/wp\/v2\/comments?post=401"}],"version-history":[{"count":2,"href":"https:\/\/0o5.de\/magazin\/wp-json\/wp\/v2\/pages\/401\/revisions"}],"predecessor-version":[{"id":892,"href":"https:\/\/0o5.de\/magazin\/wp-json\/wp\/v2\/pages\/401\/revisions\/892"}],"up":[{"embeddable":true,"href":"https:\/\/0o5.de\/magazin\/wp-json\/wp\/v2\/pages\/42"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/0o5.de\/magazin\/wp-json\/wp\/v2\/media\/235"}],"wp:attachment":[{"href":"https:\/\/0o5.de\/magazin\/wp-json\/wp\/v2\/media?parent=401"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}