viernes, 22 de julio de 2016

Sonidos y videos en una pagina web



Sonidos en una pagina web

Algunos de los formatos de sonidos de fondo más populares para páginas Web son:


.mid   Archivo de secuencia MIDI
.mp3   Archivo de sonido de formato MP3
.wav   Archivo de sonido WAVE de Microsoft Windows



¿Como insertar sonidos en una pagina web?

  Paso 1: importar el archivo de sonido de fondo

Para importar el archivo a un sitio Web, siga estos pasos:

1.   Abra un sitio Web y, a continuación, cambie a la vista Carpeta.
2.   En el panel Lista de carpetas, haga clic en la carpeta en la que desea importar el archivo de sonido de fondo. Si no desea importar el archivo en una carpeta concreta, haga clic en la carpeta raíz (el primer elemento del panel Lista de carpetas).
3.   En el menú Archivo, haga clic en Importar.
4.   Haga clic en Agregar archivo.
5.   Seleccione el archivo que desee importar y, después, haga clic en Abrir.
6.   Haga clic en Aceptar.


Paso 2: asignar el archivo como sonido de fondo

Método 1: establecer las propiedades de la página

1.   En la vista Normal, haga clic con el botón secundario del mouse en la página y haga clic en Propiedades de página en el menú que aparece.
2.   Haga clic en la ficha General.
3.   En la sección Sonido de fondo, haga clic en el botón Examinar.

NOTA
Algunos formatos de archivos de sonido, como los archivos .mp3, no se muestran en el cuadro de diálogo. Con estos archivos tiene que escribir manualmente la ruta de acceso del archivo de sonido de fondo en el cuadro de diálogo. Por ejemplo, si un archivo que se denomina Song.mp3 se almacena en una carpeta que se denomina Music, la ruta de acceso es así:
Music/Song.mp 3

Si el archivo está en la raíz, la ruta de acceso es así:
Song.mp3


4.   Después de seleccionar un archivo o de escribir su nombre, haga clic en Abrir.
5.   En el cuadro Bucle, escriba o seleccione un número para especificar el número de veces que desea que se reproduzca la canción.
6.   Haga clic en Aceptar.


Método 2: modificar el código HTML

1.   Pase a la vista HTML.

2.   Escriba la etiqueta <BGSOUND> entre las etiquetas <HEAD>. Por ejemplo, si desea utilizar un archivo denominado Song.mp3 como archivo de sonido de fondo y está guardado en una carpeta denominada Music, la etiqueta <BGSOUND> sería similar a la siguiente:


           <HEAD>
                      <bgsound src="music/song.mp3" loop="-1">

                </HEAD>


3.   Si el archivo Song.mp3 se almacena en la raíz en lugar de en una carpeta concreta del sitio Web, la etiqueta <BGSOUND> es similar a la siguiente:



           <HEAD>
                <bgsound src="song.mp3" loop="-1">

           </HEAD>



En la tabla siguiente se explican los valores de Loop que puede establecer para la etiqueta <BGSOUND>:


          Valor de Loop
      Descripción
      1
      El sonido de fondo se reproducirá repetidamente siempre que se abra la página.
      0 ó 1
      El sonido de fondo se reproducirá una vez.
      n    
       El sonido de fondo se reproducirá n veces, donde n es un número mayor que 1.


Paso 3: guardar y obtener una vista previa de la página

1.   En el menú Archivo, haga clic en Guardar para guardar la página Web.
2.   Asegúrese de que los altavoces funcionan y, a continuación, haga clic en Vista previa en el explorador en el menú Archivo.


NOTA
Cuanto mayor es el archivo, más se tarda en cargar la página.




Videos en una pagina web




¿Como insertar videos en una pagina web?

La forma más sencilla:

<video src="videotest.ogv"></video>

poster:

Permite usar una imagen como poster inicial del vídeo


<video src="videotest.ogv" poster="videotest.jpg"></video>


controls:

Muestra los controles nativos del navegador sobre el vídeo (botón play, pause, timeline, etc)


<video src="videotest.ogv" poster="videotest.jpg" controls></video>


width / height:

Permite modificar el ancho y el alto del vídeo original

<video src="videotest.ogv" poster="videotest.jpg" width="400" height="400" controls></video>


loop:

Reproduce el vídeo una y otra vez (en un bucle infinito)

<video src="videotest.ogv" poster="videotest.jpg" width="500" loop controls></video>



autoplay:

Reproduce el vídeo automaticamente al cargar la página

<video src="videotest.ogv" poster="videotest.jpg" width="500" autoplay loop controls></video>


preload:

Carga el vídeo automaticamente al cargar la página pero no lo reproduce

<video src="videotest.ogv" poster="videotest.jpg" width="500" preload loop controls></video>


Insertar más de un archivo source:

Como no todos los navegadores soportan los mismos formatos, en la mayoría de los casos debemos definir por lo menos 2 formatos distintos.

                     <video poster="videotest.jpg" width="500" preload loop controls>
                                 <source src="videotest.ogv" type="video/ogv">
                                 <source src="videotest.mp4" type="video/mp4">

                     </video>





Recuperado de :









No hay comentarios.:

Publicar un comentario