Vidéo: TUTO HTML - #7 Insérer un élément audio ou vidéo sur son site 2025
Les effets sonores ont longtemps été l'une des plus grandes faiblesses du Web en tant que plateforme de jeu HTML. Les navigateurs Web ont des capacités audio très incohérentes et gênantes. Heureusement, HTML5 résout le problème de son (au moins à un certain niveau).
La bibliothèque simpleGame facilite la création de nouveaux sons en ajoutant un objet Sound. Voici un programme très simple qui joue un effet sonore:
son. html var scène; var ribbit; Fonction init () {scene = new Scène (); owMP3 = nouveau son ("ow. mp3"); owOgg = nouveau son ("ow. ogg"); scène. start ();} // fin de la fonction d'initialisation update () {if (keysDown [K_SPACE]) {owMP3. jouer(); owOgg. play ();} // fin si} // fin de la mise à jour NE PAS appuyer sur la barre d'espace! !
Les effets sonores sont faciles à gérer avec la bibliothèque simpleGame:
-
Créez votre effet sonore.
Les meilleurs formats sont mp3 et ogg. Mettez votre fichier audio dans le même répertoire que votre programme.
Pour optimiser la compatibilité du navigateur, passez à l'étape 2.
-
Créez une variable pour conserver votre effet sonore.
Comme pour tous les éléments du jeu, vous aurez une variable contenant votre son. Définissez la variable en dehors de toutes les fonctions.
-
Créez un objet Sound pour initialiser votre effet sonore.
La bibliothèque simpleGame a un objet Sound. Créez une instance de cet objet pour créer votre son. L'objet nécessite un paramètre: le nom du fichier contenant votre effet sonore. Normalement, vous le ferez dans la fonction init () de votre jeu.
-
Lit le son avec la méthode play ().
Une fois que vous avez défini un effet sonore, vous pouvez le lire facilement avec la méthode play () de l'objet audio.
Les effets sonores ajoutent beaucoup à votre jeu. Il était assez difficile de travailler avec des effets sonores dans les pages Web, mais HTML5 a une nouvelle balise merveilleuse qui donne finalement au navigateur l'accès aux effets sonores sans plug-ins tiers. L'objet Sound de la bibliothèque simpleGame est basé sur la balise HTML5.
Aussi génial que soit l'élément sonore, il y a quelques problèmes. Bien que tous les navigateurs compatibles HTML5 lisent des fichiers audio, ils ne lisent pas les mêmes types de fichiers. Le format mp3 est très connu, mais tous les navigateurs ne le supportent pas. De nombreux navigateurs préfèrent le format Ogg plus récent (et open source). Si ce n'est pas assez confus, le support change de version en version du même navigateur.
Ma suggestion est d'utiliser à la fois les formats MP3 et Ogg et de laisser le navigateur jouer comme il le peut. Cela résoudra la plupart des problèmes.
Bien sûr, il n'est pas facile de trouver le même effet sonore dans les deux formats. Pensez à utiliser l'éditeur audio gratuit, Audacity.Cet outil vous permet d'enregistrer et d'éditer des effets sonores dans plusieurs formats. Selon la version d'Audacity que vous obtenez, vous pouvez également avoir besoin du plug-in LAME. Avec ces outils, vous pouvez facilement enregistrer vos propres effets sonores et les enregistrer dans les formats Ogg et MP3.
