Jak přidat zvuk na webovou stránku HTML5

HTML5 usnadňuje přidávání zvuku a hudby k vašim webovým stránkám pomocí prvku. Ve skutečnosti je nejtěžší, abyste vytvořili více zdrojů, které potřebujete, abyste se ujistili, že vaše zvukové soubory budou přehrávány v nejrůznějších prohlížečích.

Výhodou použití HTML5 je, že můžete vložit zvuk jen pomocí několika značek. Prohlížeče pak přehrají zvuk stejně jako by při zobrazení prvku IMG zobrazovali obrázek.

Jak přidat zvuk na webovou stránku HTML5

Budete potřebovat editor HTML , zvukový soubor (nejlépe ve formátu MP3) a konvertor zvukových souborů.

  1. Nejprve potřebujete zvukový soubor. Nejlepší je nahrát soubor jako MP3 ( .mp3 ), protože má vysokou kvalitu zvuku a podporuje ho většina prohlížečů (Android 2.3, Chrome 6+, IE 9+, iOS 3+ a Safari 5+).
  2. Převést soubor do formátu Vorbis ( .ogg ) a přidat podporu Firefoxu 3.6+ a Opera 10.5+. Můžete použít převodník, jako je ten, který se nachází na stránkách Vorbis.com. Můžete také převést soubory MP3 do formátu WAV ( .wav ), abyste získali podporu pro Firefox a Opera. Doporučuji uveřejnit soubor ve všech třech typech, pouze pro zabezpečení, ale nejvíce je třeba MP3 a jeden jiný typ.
  3. Nahrajte všechny zvukové soubory na váš webový server a poznamenejte si adresář, do kterého jste je uložili. Je vhodné umístit je do podadresáře pouze pro zvukové soubory, jako většina návrhářů ukládá obrázky do adresáře obrázků .
  4. Přidejte prvek AUDIO do souboru HTML, kde chcete zobrazit ovládací prvky zvukových souborů.
  5. Umístěte prvky SOURCE pro každý zvukový soubor, který nahráváte do prvku AUDIO :
  1. Jakýkoli HTML uvnitř prvku AUDIO bude použit jako záložní pro prohlížeče, které nepodporují prvek AUDIO . Takže přidat nějaký HTML. Nejjednodušším způsobem je přidat HTML, abyste je mohli stáhnout, ale pro přehrávání zvuku můžete také použít metody vkládání HTML 4.01. Zde je jednoduchá záloha:

    Váš prohlížeč nepodporuje přehrávání zvuku, stáhněte soubor:

    1. MP3 ,
    2. Vorbis , WAV
  2. Poslední věc, kterou musíte udělat, je zavření prvku AUDIO :
  3. Až skončíte, HTML by měl vypadat takto:
    1. Váš prohlížeč nepodporuje přehrávání zvuku, stáhněte soubor:

    2. MP3 ,
    3. Vorbis ,
    4. WAV

Další tipy

  1. Ujistěte se, že používáte HTML5 doctype () tak, aby váš HTML ověřil
  2. Zkontrolujte atributy dostupné pro daný prvek a zjistěte, jaké další možnosti můžete přidat k prvku.
  3. Všimněte si, že jsme ve výchozím nastavení nastavili kód HTML, který by měl obsahovat ovládací prvky a vypnout automatické přehrávání. Můžete to samozřejmě změnit, ale nezapomeňte, že mnoho lidí najde zvuk, který se spustí automaticky /, že nemohou ovládat, aby byl v nejlepším případě nepříjemný a často se v případě, že se to stane, často opustí stránku.