Trabajar con gráficos, sonidos y vídeos al crear un sitio web

Este artículo presenta las técnicas para añadir gráficos, sonidos y elementos de vídeo a sus páginas Web. Averiguar cómo añadir imágenes y mapas de imágenes a sus páginas web, enlaces y sonido integrar y archivos de vídeo, y el uso de un sonido de fondo que se reproducirá cuando muestra su página Web.

Formatos de archivo de imagen, sonido y vídeo

Usted puede elegir entre muchos diferentes formatos de archivo para las imágenes, sonidos y vídeos. Afortunadamente, usted puede construir la mayoría de las páginas web utilizando únicamente los formatos que se describen en las secciones siguientes.

Formatos de archivo de imagen

Aunque docenas de diferentes formatos de archivo de imagen existen, sólo dos son ampliamente utilizados para imágenes de página Web: GIF y JPEG. GIF: GIF, que se encuentra de Graphics Interchange Format, fue originalmente utilizado en la red en línea CompuServe y ahora es ampliamente utilizado en toda la Internet. Archivos de imágenes GIF tienen las siguientes características:

- Imágenes GIF puede tener un máximo de 256 colores diferentes.

- Los archivos GIF se comprimen para reducir su tamaño. El método de compresión GIF utiliza no reduce la calidad de imagen.

- Una imagen GIF puede incluir un color transparente, que, cuando se muestra en un explorador Web, permite que el fondo de la página Web para mostrar a través de.

- Imágenes GIF puede ser entrelazado, que permite que el navegador Web para mostrar rápidamente una versión de crudo de la imagen y luego mostrar versiones cada vez mejor de la imagen.

- GIF soporta una técnica de animación simple que le permite almacenar varias imágenes distintas en el mismo archivo. El navegador Web muestra la animación que muestra la imagen después de la otra en secuencia. El formato GIF es la mejor opción para la mayoría de gráficos Web creados con programas de dibujo o pintura y que no contienen un gran número de diferentes colores. Es ideal para los iconos, botones, texturas de fondo, las balas, las reglas y el arte en línea. Un formato llamado PNG (Portable Network Graphics) fue desarrollado en 1995 como sucesor del formato GIF. PNG (que se pronuncia Ping) Soporta todas las características de GIF y algunos más, y es compatible con más colores que GIF. PNG no ha capturado a, aunque, por lo GIF sigue siendo el formato de imagen más utilizados.

Imágenes JPEG: JPEG, un formato desarrollado por el Joint Photographic Experts Group, está diseñado para obtener imágenes de calidad fotográfica. Tiene las siguientes características:

- Imágenes JPEG puede tener 16,7 millones o 2 millones de colores. La mayoría de las imágenes JPEG utilizar 16,7 millones de colores, que ofrecen excelente representación de imágenes fotográficas.

- Para reducir el tamaño de la imagen, JPEG utiliza una técnica de compresión especial que reduce ligeramente la calidad de la imagen, mientras que reduce en gran medida de su tamaño. En la mayoría de los casos, usted tiene que comparar cuidadosamente la imagen original sin comprimir con la imagen comprimida para ver la diferencia.

- Soporta imágenes JPEG progresivo que son similares a las imágenes GIF entrelazado.

- JPEG no es compatible con los colores de fondo transparentes como el GIF no.

- JPEG no soporta animación.

Otros formatos de archivo de imagen: Muchos otros formatos de archivo de imagen existe. Éstos son sólo algunos:

--BMP: Mapa de bits de Windows

--PCX: Otro formato de mapa de bits

--TIF: Tagged Image File

--PIC: Foto de archivo de Macintosh

Formatos de archivo de sonido

Los siguientes son los más comunes formatos de archivo de sonido:

--WAV: El estándar de Windows para grabaciones de sonido. WAV significa Wave.

--SND: El estándar de Macintosh para grabaciones de sonido. SND significa sonido.

--AU: El estándar de Unix para grabaciones de sonido. AU viene de Audio.

--MID: Archivos MIDI, que no son en realidad grabaciones de sonido. Los archivos MIDI son de música almacenados en una forma que sintetizador de una tarjeta de sonido puede jugar. MIDI son las siglas de Musical Instrument Digital Interface. No hay que confundir los archivos de sonido con sonido se puede escuchar en tiempo real a través de Internet, conocido como streaming de audio. El formato más popular para el streaming de audio es de RealAudio. RealAudio le permite escuchar un sonido a medida que se descargan en su computadora, así que no tienes que esperar a que todo el archivo para ser descargado para poder escucharlo. Para escuchar el sonido RealAudio, primero debe instalar un reproductor de RealAudio en su navegador Web. (Se puede descargar desde www.real.com).

Formatos de archivo de vídeo

Tres formatos populares de video clips se utilizan en la Web:

--AVI: El estándar de vídeo de Windows. AVI significa Audio Video Interleaved.

--QuickTime: El estándar de vídeo de Macintosh. QuickTime archivos suelen tener la extensión MOV.

--MPEG o MP3: Una norma independiente. MPEG son las siglas de Motion Picture Experts Group. MP3 es una abreviatura de MPEG nivel 3, una adaptación de MPEG utiliza para enviar archivos de música en la red. A pesar de AVI es conocido como un formato de vídeo de Windows y QuickTime es un formato de Macintosh, tanto en formatos como MPEG y MP3 se han convertido en multiplataforma normas. Tanto Netscape Navigator y Microsoft Internet Explorer puede reproducir AVI, QuickTime, y vídeos MPEG.

Trabajar con gráficos

Usted ha decidido que los gráficos a incluir en sus páginas Web, de modo que ¿qué sigue? Esta sección le muestra cómo insertar sus archivos de gráficos y cómo utilizar los mapas de imagen. En primer lugar, aquí hay algunas directrices para el uso de las imágenes:

- No agregar muchas imágenes o imágenes tan grandes que la página tarda mucho en descargar.

- Utilice el atributo ALT con la etiqueta para proporcionar un texto para los usuarios que ven en su página con las imágenes inhabilitadas. Por ejemplo:

- Parten de la altura y la anchura con los atributos de la etiqueta para preformatear sus páginas para las dimensiones de la imagen correcta.

- Uso BORDER = "0" en la tag para eliminar el borde que aparece alrededor de las imágenes (a menos que quieras que aparezca de las fronteras), así:

- Utilizar GIF transparentes para crear imágenes que se mezclan a la perfección con su fondo de página. (Ver el recuadro, "Uso de imágenes GIF transparentes", más adelante en este artículo.) - Si usted desea hacer grandes archivos de imágenes disponibles para descargar en su sitio Web, proporcionar a las pequeñas, las versiones en miniatura de las imágenes que la gente puede previsualizar antes de decidir si para descargar la imagen en tamaño completo. - Tenga en cuenta que muchas de las imágenes que se muestren en la web son propiedad de los materiales que no se puede simplemente copiar y utilizar en tu propio sitio web sin permiso del titular de los derechos de autor. Del mismo modo, las fotografías, ilustraciones y otras imágenes que aparecen en las revistas y los libros tienen derechos de autor. Por ley no puede escanear imágenes con derechos de autor y publicarlos en su sitio Web sin el permiso del dueño del copyright.

Inserción de un gráfico de

Para insertar una imagen en una página Web, siga estos pasos:

1. Obtener un archivo de imagen que desea incluir en tu página.Si es necesario, utilice un programa de gráficos para convertir el archivo al formato que desea utilizar (probablemente GIF o JPEG). Guarde el archivo de imagen en el mismo directorio que el documento HTML que muestra la imagen. Alternativamente, es posible que prefiera para almacenar todas las imágenes de su sitio Web juntos en una carpeta de imágenes separadas.

2. En el archivo HTML, añada el etiqueta en el punto en el documento en la que desea que aparezca la imagen. Utilice el SRC (fuente) atribuyen aproporcionar el nombre del archivo de imagen. Por ejemplo:

3. (Opcional) Para quitar el borde alrededor de la imagen, añadir una FRONTERAatributo, como sigue:

4. (Opcional) para proporcionar un texto que se mostrará a los usuarios que handesactivado gráficos en sus navegadores Web, utilice un ALT atributo:

5. (Opcional) Para preformatear la página Web con las dimensiones correctas de la la imagen, utilice la ALTURA y ANCHO atributos, como sigue:

Usando mapas de imagen

Un mapa de imagen es un gráfico en el que determinadas regiones de la imagen que sirven como enlaces a otras páginas Web. Por ejemplo, si estás creando un sitio Web sobre El mago de Oz, puede utilizar una imagen de mapa de los caracteres que tienen enlaces a páginas sobre estos personajes. Para crear un mapa de imagen, debe usar varias etiquetas HTML: y su compañera , , Y . Para crear un mapa de imagen, siga estos pasos:

1. Encontrar o crear un gráfico que puede servir como un mapa de imagen.La imagen debe tener las distintas regiones que servirán como enlaces del mapa.

2. Use un programa de gráficos para mostrar la imagen, a continuación, determinar la forma rectangular límites.

3. Tipo de un conjunto de y etiquetas. En el etiqueta, utilice el NOMBREatribuir a proporcionar un nombre para el mapa de imagen, así:

4. Entre los y etiquetas, escriba un etiqueta para cada uno rectangular área de la imagen que servirá como un enlace. En el etiqueta,los siguientes atributos:

= "RECT FORMA" COORDS = "Iniciar la izquierda, iniciar superior, extremo x de la izquierda, de arriba extremo x" HREF url = "" Por ejemplo:

5. Escriba un etiqueta. Utilice el SRC atribuyen el nombre del archivo de imagen y de el USEMAP atribuir a proporcionar el nombre del mapa de imagen que figuran en el el atributo, como este:

Asegúrese de escribir un signo de número (#) antes del nombre del mapa de imagen en el El atributo de etiqueta de USEMAP. Pero no use el símbolo # al crear el nombre en el El atributo NAME etiqueta. Todo junto, aquí está un documento HTML para crear un mapa de imagen:

 ¿Qué fue primero?

Utilice el atributo TITLE en el etiquetas para crear información sobre herramientas que se muestran cuando el usuario se detiene brevemente el puntero del ratón sobre un área del mapa de imagen. Por ejemplo:

Recuerde que algunas personas que configurar su navegador para que no descargar y mostrar imágenes. Siempre que utilice un mapa de imagen, asegúrese de que también proporcionan enlaces de texto como una alternativa a la hoja de la imagen. De lo contrario, los usuarios que visitan su página con las imágenes inhabilitadas no podrá navegar por su sitio.

Adición de sonidos

Puede insertar un archivo de sonido en una página Web como un enlace, como un sonido incorporado, o como parte de los antecedentes de la página (para que el sonido se reproducirá automáticamente cuando se muestra la página). Las secciones siguientes muestran cómo utilizar las etiquetas HTML necesario para cada método.

Inserción de un vínculo a un archivo de sonido

La ventaja de vincular a un archivo de sonido es que el archivo de sonido no se descarga en el ordenador del usuario hasta que el usuario hace clic en el vínculo a un archivo de sonido. Para insertar un enlace a un archivo de sonido, siga estos pasos:

1. Obtener un archivo de sonido que desea vincular a su sitio Web y el lugar el archivo de sonido en el mismo directorio que el documento HTML que se contiene el enlace.Alternativamente, usted puede preferir para almacenar todos los archivos de sonido para su sitio Web en su propia carpeta.

2. Añadir un etiqueta, un texto descriptivo, y un etiqueta en el código HTML archivo de la siguiente manera:

Haga clic aquí para reproducir el sonido.

Asegúrese de escribir el nombre de su archivo de sonido en el atributo href.

La incorporación de un archivo de sonido

Puedes integrar un sonido en una página Web utilizando una tag:

El atributo SRC provee el nombre del archivo de sonido. El navegador Web muestra el sonido de los controles necesarios para que el usuario pueda reproducir el sonido.

Uso de sonidos de fondo

Un sonido de fondo se reproduce automáticamente cada vez que un usuario visualiza la página Web. Para añadir un sonido de fondo a una página, siga estos pasos:

1. Obtener un archivo de sonido que desea utilizar como sonido de fondo y de Coloque el archivo de sonido en el mismo directorio que el archivo HTML.

2. Añadir una atributo siguiente a la etiqueta. Utilice el SRC atributoal nombre del archivo de sonido que desea ser jugados:

3. Si desea que el sonido se repite varias veces, añadir el LOOP atributocomo esta:

Puede escribir cualquier número en el LOOP atributo para indicar cuántas veces el sonido se debe repetir. O puede escribir LOOP = "INFINITE" para reproducir el sonido en varias ocasiones mientras se muestra la página. Alguna gente prefiere escuchar las uñas arrastrado por una pizarra de molestos ruidos de fondo que se puede escuchar una y otra vez. Si quieres que la gente visite su sitio más de una vez, evitar el uso de LOOP = "infinita".

Trabajo con videos

Puede insertar un archivo de vídeo en una página Web como un enlace o como un objeto incrustado. Las secciones siguientes muestran cada método.

Inserción de un vínculo a un archivo de vídeo

Para insertar un enlace a un archivo de vídeo, siga estos pasos:

1. Busque un archivo de vídeo que desea añadir un enlace a su página Web.

2. Añadir un etiqueta, un texto descriptivo, y un etiqueta en el código HTML archivo de la siguiente manera:

Haga clic aquí para descargar una película.

Proporcionar el nombre del archivo de vídeo en el atributo HREF de la etiqueta. Cuando el usuario hace clic en el enlace, se descarga el navegador de Internet el archivo y reproduce el vídeo.

La incorporación de un vídeo

Utilice el etiqueta para incrustar un vídeo en una página Web. Siga estos pasos:

1. Busque un archivo de vídeo que desea incrustar en una página Web.

2. En el documento HTML de la página Web, agregue una etiqueta especificandoel nombre del archivo de vídeo en la SRC atributo, como este:

3. Si desea cambiar el tamaño de la superficie utilizada para mostrar el vídeo,agregar la ALTURA y ANCHO atributos, como este:

4. Si desea que el vídeo se reproduzca automáticamente tan pronto como acabe el descargar, añadir AUTOSTART = "TRUE" a la tag:

un artículo presentado por Justine Mccain

Descargo de responsabilidad:Nuestro sitio web no es responsable por el contenido de este artículo. Webarticles es un recurso de información gratuito.
Importante: Este artículo "Trabajar con gráficos, sonidos y vídeos al crear un sitio web", fue traducida por un software automático. Sentimos pena por los errores de ortografía que pueda haber ocurrido. Gracias por su comprensión.