Adobe Dreamweaver CS6 Elementos multimedia

Transcripción

1 Adobe Dreamweaver CS6 Elementos multimedia Mg. Carlos Antonio Huamán Terrazas. Presentación En pocos años, la web ha dejado de ser una colección de páginas estáticas con imágenes y texto, para transformarse en unas páginas animadas, dinámicas y con muchos que hacen de los Sitios Web muy vistosos y de uso interactivo. Dreamweaver CS6 proporciona diversos objetos para que puedas agregar a tu página Web vídeos, audios, imágenes en sustitución y vídeos flash. Profesor: Mg. Carlos A. Huamán Terrazas 1

2 Elementos multimedia Utilizar combinaciones de texto, imagen, sonido, animación o vídeo en una página web o aplicación es un recurso informático tan poderoso y expresivo que logra captar de forma más efectiva la información que se recibe, estimulando los sentidos y haciendo que el usuario esté más alerta y receptivo. Dreamweaver permite incorporar como archivos de imágenes, archivos flash, archivos de videos, archivos de sonido. A continuación, podrás utilizar los elementos que te ofrece Dreamweaver CS6. Insertar marcador de posición de imagen. Esta herramienta se usa al crear el diseño de una página Web, cuando aún no tienes las imágenes definitivas, pero sabes cuáles serán sus dimensiones y posiciones. Al crear un marcador de posición, creas un gráfico con un color de fondo que sustituye de forma temporal la imagen definitiva y ayuda a construir el diseño de la página Web. Profesor: Mg. Carlos A. Huamán Terrazas 2

3 Insertar películas en flash. En la actualidad, se usan archivos flash para darle interactividad y animación a las páginas web, aunque hay páginas web enteras y aplicaciones creadas y diseñadas en flash. Profesor: Mg. Carlos A. Huamán Terrazas 3

4 Tu vídeo en Flash Insertar vídeos. Muchas páginas Web enriquecen su contenido de información a través de vídeos, pero se debe tener en cuenta su tamaño por el tiempo que demora en descargarse, ya que ocupa un lugar en el hosting donde se almacena la página y los contenidos multimedia. Recuerda tener tu navegador, plugins, reproductor quicktime actualizados Profesor: Mg. Carlos A. Huamán Terrazas 4

5 Inserción de código HTML 5 para insertar vídeo La necesidad que los vídeos insertados en un documento web sean reproducidos en cualquier navegador web hace que el lenguaje HTML 5 se innove y soluciones este problema, ya que Adobe Dreamweaver es compatible con este lenguaje y trae instalado sus características para usar sus código. Inserción de código HTML 5 para insertar vídeo Profesor: Mg. Carlos A. Huamán Terrazas 5

6 Inserción de código HTML 5 para insertar vídeo Atributo Src Controls Poster Loop Autoplay Preload Height Width Descripción Identifica la dirección de un archivo o vídeo. Atributo que activa un conjunto de controles de reproducción integrados. Representa una imagen de marcador de posición y que se muestra en el reproductor de vídeo. La imagen del poster se muestra cuando un vídeo no esta disponible. Atributo que reproduce el vídeo repetidamente. Para iniciar la reproducción del vídeo automáticamente. Atributo booleano que define una clave sobre cuánto almacenamiento de búfer es necesario. Establece el alto del reproductor de vídeo, en píxeles. Establece el ancho del reproductor de vídeo, en píxeles. Inserción de sonidos Muchas páginas web poseen sonido al iniciar o ejecutarse como páginas de aniversario, navidad, día de la madre, colegios o empresas con el rubro de música. Los formatos de sonido más usados en Internet son: mp3, wav, y midi. Profesor: Mg. Carlos A. Huamán Terrazas 6

7 Inserción de vídeo desde Youtube Puedes aprovechar los vídeos que están almacenados en Youtube e insertarlos en la página web y asi ahorrar espacio en el disco duro o en el hosting. Adobe Dreamweaver CS6 facilita la inserción del vídeo a través de la ventana del código. Copia este código Profesor: Mg. Carlos A. Huamán Terrazas 7