Texto multimedia

Un texto es un documento formado por un conjunto de escritos: alegaciones, calificaciones, descripciones, conclusiones, composiciones científicas, etc.

El documento puede estar almacenado en un fichero de texto o en un fichero binario.

En ambos casos, para que el documento sea multimedia deberá permitir que se pueda incluir (embeber o incrustar) otros objetos informativos.

Si utiliza editores de texto que generen ficheros binarios observará que existen opciones, de entre el conjunto de menús, para la inclusión de gráficos, música y/o vídeo. Con este tipo de herramientas la inclusión de los objetos es transparente para usted: selecciona la opción, seleccionar el objeto y lo ajusta a sus gustos. En la imagen puede ver la opción de Impress, editor de presentaciones de OpenOffice.org, para la inclusión de imágenes, audio, vídeo y otros objetos.

Pero si va a generar ficheros de texto, deberá de recurrir a un lenguaje de marcas (Markup Language) y un visualizador para ficheros escritos en ese lenguaje. El lenguaje de marcas más utilizado es el HTML (HyperText Markup Language), bien conocido por ser el más utilizado para las páginas web, y el visualizador cualquier navegador que utilice para conectarse a internet.

Conviene indicar que la información textual en la pantalla del ordenador no suele ser tan cómoda como la impresa, donde las lecturas se suelen hacer con bastante mayor y rapidez. Es por ello que en el contexto multimedia el texto suele estar muy relegado, reservándose para títulos, menús, sistemas de navegación y poco más. Así, si optara por preparar texto multimedia, no-diseñado para impresión, debe optimizar los contenidos que desee mostrar, ponga a la vista sólo unos pocos párrafos por “página” (virtual) para no cansar o agobiar al lector con un continuo scroll interminable.

El Lenguaje HTML

En el lenguaje HTML, una marca o etiqueta es una secuencia de palabras que se escriben entre corchetes angulares (<,>). Toda la información del documento se encuentra, al menos, entre dos de estas marcas: 

<marca> información </marca>

Existen varios tipos de marcas en HTML:

  • Marcas para la estructura del documento. Se utilizan para indicar el propósito del texto: título, cabecera, secciones, subsecciones, párrafos, etc
  • Marcas para la presentación del texto. Se usan para especificar la apariencia del texto: en negrita, cursiva, etc
  • Marcas para objetos. Indican qué tipo de objeto es el que incluye: enlaces externos, gráficos, sonido, video, programas Java, etc.

Como ejemplo, el siguiente código le muestra la estructura básica de un documento HTML: 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
 <html lang="es">

   <head>
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
     <title>Título del documento</title>

   </head>
   <body>
     <p>Un párrafo con texto en <b>negrita</b></p>
   </body>

 </html>

El fichero HTML empieza indicado cuales es la definición de tipo de documento (DTD) que sirve para describir la sintaxis para la estructura y formato del documento. A continuación, con la marcas <html></html> indicamos que empieza el documento HTML. Observar que el documento consta de dos partes: la cabecera, incluida entre las marcas <head></head>, y el su contenido, entre las marcas <body></body>. En la cabecera se especifica meta-información referente al tipo de codificación del fichero, en este caso UTF-8. Si observa que los caracteres acentuados se muestran con símbolos extraños, modifique UTF-8 por iso-8859-1 o iso-8859-15. También en la cabecera se indica el título del documento y que aparecerá en el borde superior de la ventana. En este ejemplo, el texto está formado por sólo un párrafo (marcas <p></p>) con una palabra en negrita (marcas <b></b>)

A continuación se comentan las marcas para incluir otros tipos de información.

  • Los gráficos, imágenes y animaciones en formato gif pueden incluirse con la marca IMG. Un ejemplo es el siguiente:
<img src="./img/sol.jpg" width=140 height=210 align="right" border=0 alt="Puesta de sol" >

Incluirá el fichero sol.jpg que se encuentra en el directorio img, con dimensiones 140×210, justificado a la derecha, sin borde y con el texto alternativo “Puesta de sol”.

  • La inclusión de animaciones en otros formatos, vídeos y sonidos pueden incluirse con la marca EMBED. Por ejemplo,
<embed src="video.avi" align="right" width="200" height="200" autostart="false" hidden="false" controls="console"></embed>

Incluye el fichero video.avi que se encuentra en el mismo directorio que el fichero HTML, con dimensiones 200×200, justificado a la derecha, sin inicio automático, sin ocultar y con los controles típicos de reproducción y parada.

Para finalizar este apartado, realice el curso Manual de HTML. Tutorial de HTML salvo el apartado referente a formularios y vuelva a este punto.

Ejercicios

  1. Realice su página web siguiendo los siguientes pasos (Solución)
    • Construya el documento básico.
    • Añade una sección, referente a su información personal, que incluya una foto y una lista no ordenada con sus datos. Cada campo deberá aparecer en negrita y el dato en cursiva.
    • Añade una sección, referente a su información profesional, que incluya un enlace a su página web y un enlace a su dirección de correo electrónico.
    • Añada una nueva sección, referente a la docencia que imparte, clasificada por titulación y curso.
    • Separa cada sección por una línea horizontal e incluya un índice que enlace a las tres secciones que ha creado anteriormente.
    • Enlace una de las asignaturas con una nueva página HTML con información referente a esa materia: características de la asignatura, metodología, temario, evaluación y bibliografía. Intente utilizar tablas.

Evaluación

Recursos

Todas las Secciones