Skip to main content

Com afegir so a una pàgina web HTML5

Anonim

HTML5 us permet afegir sons i música a les vostres pàgines web amb l'element. De fet, el més difícil és crear les múltiples fonts que necessiteu per assegurar-vos que els vostres fitxers de so funcionin en la més àmplia varietat de navegadors.

El benefici d'utilitzar HTML5 és que podeu incrustar el so només amb un parell d'etiquetes. Els navegadors, aleshores, reprodueixen el so com si mostressin una imatge quan utilitzeu un

IMG element.

Com afegir so a una pàgina web HTML5

Necessiteu un Editor HTML, un fitxer de so (preferiblement en format MP3) i un convertidor de fitxers de so.

  1. En primer lloc, necessiteu un fitxer de so. És millor gravar el fitxer com a MP3 (

    .mp3) ja que té una alta qualitat de so i és compatible amb la majoria de navegadors (Android 2.3+, Chrome 6+, IE 9+, iOS 3+ i Safari 5+).

  2. Converteix el fitxer en format Vorbis (

    .ogg) per afegir Firefox 3.6 + i Opera 10.5+. Podeu utilitzar un convertidor com el que es troba a Vorbis.com. També podeu convertir el vostre MP3 a un format de fitxer WAV (

    .wav) per obtenir el suport de Firefox i Opera. Recomano publicar el fitxer en els tres tipus, només per a la seguretat, però el que més necessites són MP3 i un altre tipus.

  3. Carregueu tots els fitxers d'àudio al vostre servidor web i anoteu el directori al qual els heu emmagatzemat. És una bona idea col·locar-los en un subdirectori només per a fitxers d'àudio, com la majoria dels dissenyadors estalvien imatges en un

    imatges directori.

  4. Afegiu el

    AUDIO element al vostre fitxer HTML on voleu que es mostrin els controls de fitxers de so.

  5. Lloc

    SOURCE elements per a cada fitxer d'àudio que carregueu a l'interior

    AUDIO element:

    1. Qualsevol HTML dins de la

      AUDIO L'element s'utilitzarà com a alternativa per als navegadors que no admetin la

      AUDIO element. Així que afegiu un codi HTML. La forma més senzilla és afegir HTML per permetre que descarregueu el fitxer, però també podeu utilitzar mètodes d'incrustació d'HTML 4.01 per reproduir el so. Aquí teniu un simple retrocés:

      El vostre navegador no és compatible amb la reproducció d'àudio, descarregueu el fitxer: MP3,

    2. Vorbis, WAV

  6. L'últim que heu de fer és tancar l'element AUDIO:

    1. Quan hàgiu acabat, el vostre HTML hauria de ser així:

    2. El vostre navegador no és compatible amb la reproducció d'àudio, descarregueu el fitxer:

    3. MP3,

    4. Vorbis,

    5. WAV

Consells addicionals

  • Assegureu-vos d'utilitzar el doctype HTML5 () perquè el vostre HTML validés
  • Reviseu els atributs disponibles per a l'element per veure quines opcions podeu afegir al vostre element.
  • Tingueu en compte que configurem el codi HTML per incloure controls de manera predeterminada i que la reproducció automàtica està desactivada. Podeu, per descomptat, canviar-ho, però recordeu que molta gent troba un so que comença automàticament o que no pot controlar-ho per ser molest en el millor dels casos, i sovint només sortirà de la pàgina quan això passi.