26.12.11

HTML5: insertar un video

Para publicar un video con HTML5, deberemos usar el tag <video>, acá les dejo un ejemplo

<video width="320" height="240" controls poster="/Videos/photo.jpg">
  <source src="/Videos/skate.mp4" type="video/mp4" />
  <source src="/Videos/skate.ogg" type="video/ogg" />
  Su browser no soporta HTML5
</video>


Le podemos agregar más de una fuente por si nuestro browser no lo soporta En algunos casos, deberemos crear la pagina web.config con los siguientes tags para que el servidor pueda reconocer las extensiones de los archivos

    <system.webServer>
        <staticContent>
            <mimeMap fileExtension=".mp4" mimeType="video/mp4" />
            <mimeMap fileExtension=".m4v" mimeType="video/m4v" />
            <mimeMap fileExtension=".ogg" mimeType="video/ogg" />
            <mimeMap fileExtension=".ogv" mimeType="video/ogg" />
            <mimeMap fileExtension=".webm" mimeType="video/webm" />
            <mimeMap fileExtension=".oga" mimeType="audio/ogg" />
            <mimeMap fileExtension=".spx" mimeType="audio/ogg" />
            <mimeMap fileExtension=".svg" mimeType="images/svg+xml" />
            <mimeMap fileExtension=".svgz" mimeType="images/svg+xml" />
            <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
            <mimeMap fileExtension=".otf" mimeType="font/otf" />
            <mimeMap fileExtension=".woff" mimeType="font/x-woff" />
        </staticContent>
    </system.webServer>

23.12.11

HTML5 - reproducir audio

Para insertar un archivo de audio en nuestra pagina con HTML5, simplemente deberemos utilizar el tag audio, en el cual le podremos agregar mas de un source alternativo (mp3, ogg, etc.) en caso de que nuestro browser no sea compatible con dicho formato, acá les dejo un ejemplo simple:

    <audio controls>
        <source src="/Audio/Toxicity.mp3" type="audio/mp3" />
        <source src="/Audio/Toxicity.ogg" type="audio/ogg" />
    </audio>