---
Página principal

CAPITULO 14
(Applets y objets)

Indice del curso
---

Posiblemente, al ver el título de este capítulo, hayas comenzado a dudar de mi buén estado mental.

¿Que demonios significa eslo de Applets y Objets? ¿Ha olvidado Allan Psicobyte su idioma? ¿Se trata de algún código secreto?

Nada de eso.

En este capítulo (¡El 14!) vamos a ver algunas de las tecnologías más modernas para insertar información en tus páginas web.

A estas alturas del curso ya sabes cómo insertar texto, estructurarlo en tablas o listas, darle formato, decidir el color de los elementos de tu página, incluir imágenes...

¿Qué nos falta?

¿Qué te parecería algo de video? ¿Y sonido? ¿Quizás algún programa totalmente autónomo?

Todo esto (y mucho, mucho más) es lo que te permiten esas extrañas palabras Applet y Objet.

---

Applets

Empezaremos con los applets.

Un applet es, a grandes rasgos, un programa escrito en un lenguaje de programación llamado JAVA (no lo confundas con JavaScript, no tienen nada que ver salvo el nombre. Son lenguajes totalmente distintos.) que ocupa un espacio rectangular en una página.

La labor concreta de este programa variará tremendamente de un applet a otro. Puede ser presentar una imagen, una animación, un formulario, un texto animado o estático, un programa que represente gráficas científicas, un juego...

Casi cualquier cosa que puedas imaginar puede hacerse con un applet de JAVA.

Lo malo es que, para diseñar tus propios applets, tienes que aprender todo un lenguaje de programación realmente complejo.

De modo que lo más facil es buscar en la red alguno de los muchos applets gratuitos que existen, y adaptarlo a tus necesidades.

Así que supongamos que has estado buscando por la Web y has encontrado un applet de java que quieres poner en tu página, y que se llama elapplet.class (Los applets usan generalmente la extensión .class). ¿Qué hay que hacer para situarlo en una página web?

Nada más fácil que usar la etiqueta <APPLET>...</APPLET> que HTML tiene previsto para ello:

<APPLET CODE="elapplet.class" WIDTH="200" HEIGHT="100">
(Contenido alternativo)
</APPLET>

Veamos esto un poco más despacio:

CODE indica, como te estarás imaginando, el nombre del fichero del applet.

Existe un raro tipo de applets, llamados aplets seriados o serializados que usan, en lugar del atributo CODE, uno llamado OBJECT. La verdad es que no son nda usuales, solo te lo comento aquí por si te encuentras uno algún día, para que no te asustes.

WIDTH es donde indicamos el ancho (en pixels) que ocupará el applet.

HEIGHT es donde hacemos lo mismo con la altura del applet.

Y donde pone (Contenido alternativo) puedes poner lo que quieras que aparezca cuando el navegador de tu visitante no soporte applets, como un texto de aviso, una imagen, etc. Este contenido no se mostrará si el navegador tiene soporte para applets.

Esto es lo mínimo que debe tener un applet para que funcione. Pero hay algunas cosas más que pueden usarse por aquí:

Si el applet está en un directorio que no sea el mismo de la página que lo contiene, puedes indicar la ruta de ese directorio con el parámetro CODEBASE="url", donde url es la ruta al directorio donde se encuentra el applet.

También puedes ajustar la alineación del applet en la línea donde se encuentra, exactamente igual que hacíamos con las imágenes, con el atributo ALIGN="modo", donde modo puede adoptar los valores BOTTON (abajo), MIDDLE (centrado horizontalmente), TOP (arriba), LEFT (izquierda) o RIGHT (derecha).

El atributo ALT="Texto alternativo" permite indicar un texto que se mostrará si el applet no puede verse (de identico modo que el atributo ALT de las imágenes), pero no está muy soportado por los navegadores y es más recomendable poner ese texto entre las etiquetas de apertura y cierre del applet como hemos visto antes.

También tienes los atributos HSPACE=número y VSPACE=número, donde "número" es el espacio horizontal o vertical respectivamente, en pixels, que quieres dejar como margen en torno al applet.

Algunos applets, en lugar de estar disponibles como uno o más archivos class, vienen empaquetados en archivos comprimidos que usan la extensión .jar. En esos casos hay que usar, en lugar del parámetro CODE que vimos antes, este otro: ARCHIVE="archivo.jar", donde "archivo.jar" es el nombre del archivo en cuestión. En caso de que el applet necesite más de un archivo, se pondrán separados por comas.

Los archivos jar son, en realidad, conjuntos de varios archivos comprimidos en formato ZIP. Se usa ARCHIVE en lugar de CODE con ellos porque existen algunas versiones de navegadores que reconocen los archivos class, pero no los jar, que son más modernos. De este modo se evitan errores.

Con esto que hemos visto, ya podemos usar algunos applets muy básicos. Pero necesitamos algo más antes de poder aplicar cualquier applet a nuestras maravillosas creaciones web.

A la grán mayoría de los applets se les puede asignar parámetros que modifiquen su comportamiento. Por ejemplo, un applet que haga aparecer un texto debe tener alguna forma de decirle cuál será ese texto. O quizás para definir el color de ese texto, o cualquier cosa que el programador del applet en cuestión haya decidido que se pueda configurar.

Esto se hace por medio de la etiqueta <PARAM>, que se situa entre la apertura y el cierre de la etiqueta <APPLET>, y se usa del siguiente modo:

<APPLET CODE="elapplet.class" WIDTH="200" HEIGHT="100">
<PARAM NAME="nombre" VALUE="contenido">
</APPLET>

NAME contiene el nombre del parámetro, que variará de un applet a otro, y VALUE es donde asignas el valor concreto de ese parámetro.

La decisión de qué parámetros acepta un applet y cuales son los posibles valores de esos parámetros corresponde solo al programador del applet. Los applets, generalmente, suelen ir acompañados de un documento de ayuda donde se describen.

Parece que ya es hora de poner un ejemplo, para ver si está claro el tema este. He buscado un pequeño applet en la web, y he encontrado uno bastante simple llamado NervousText.class que pongo en este ejemplo:

<HTML>
<HEAD><TITLE>NervousText.class</TITLE>
</HEAD>
<BODY>
 
<H1>Applet: NervousText.class</H1>
<P>Muestra un <I>insoportable</I> texto bailando como un hist&eacute;rico.</P>
<P>Este applet solo tiene un par&aacute;metro, llamado <B>text</B>, que sirve para especificar el texto que quieres que aparezca en el applet.</P>
<APPLET CODE="NervousText.class" WIDTH="250" HEIGHT="100" ALIGN=right ALT="Allan Psicobyte">
<PARAM NAME=text VALUE="Allan Psicobyte">
<P>Tu navegador no soporta Applets, de modo que has tenido la suerte de librarte de ver la soberana estupidez de un texto que pone <B>Allan Psicobyte</B> con cada una de sus letras moviendose como una loca.</P>
</APPLET>
 
</BODY>
</HTML>

EjemploPulsa aquí para ver el ejemplo anterior.

---

Objets

Como hemos visto, los applets son un elemento novedoso y práctico que puede serte muy útil en algunas circunstancias.

Pero hay multitud de tecnologías nuevas que pueden incluirse en una página y que no están basadas en Java, y cada día nacen nuevas posibilidades. Algunos ejemplos son el sonido en todos sus formatos (como MID o MP3), el vídeo (como MPEG o Quik Time), animaciones (Flash, por ejemplo), imágenes en formatos no usuales (BMP o formatos vectoriales), etc.

Una posible solución sería ir creando nuevas etiquetas para cada una de las posibilidades que fueran surgiendo pero eso, además de ser técnicamente imposible, sería bastante poco eficaz y habría que aprender continuamente montañas de etiquetas con sus opciones.

De modo que los tipos del World Wide Web Consortium, que son muy listos, decidieron crear una sola etiqueta con la que poder incluir cualquier cosa que alguien pudiera imaginar. Y para ello crearon la etiqueta OBJECT.

Pero antes de menternos en faena, veamos cómo funciona este elemento:

Una etiqueta OBJET indica siempre una URL del elemento a insertar en nuestra página y una indicación del tipo de archivo de que se trata (más tarde veremos cómo se hace eso exactamente). Si el navegador es capaz de trabajar con ese tipo de archivo, él mismo se ocupará de presentarlo. Pero si, como es habitual, no es capaz de manejar ese tipo de archivo, recurrirá a lo que se conoce como un Plug-In.

Un Plug-In es un programa externo al navegador, amenudo creado por un fabricante ajeno a este, que está especialmente diseñado para poder trabajar con uno o más tipos de archivo bajo el control del navegador. Por ejemplo, Netscape Navigator es, por sí solo, incapaz de reconocer el formato de vídeo AVI, de modo que, al encontrarse un OBJECT con este formato, hace una llamada a un Plug-In llamado NPAVI32 Dynamic Link Library (en el caso de Netscape Navigator para Windows 95/98), que es el que se ocupa de reproducirlo.

Esto nos lleva a un punto importante:

Normalmente, un navegador (Aunque sea capaz de reconocer la etiqueta OBJET) no podrá mostrar el contenido de un OBJECT a menos que tenga el correspondiente Plug-In instalado.

¿Y qué hace el navegador si no tiene el respectivo Plug-In? Normalmente, mostrará una ventana de advertencia y le dará al navegante la opción a descargar el Plug-In de la red. Pero esto no es necesariamente así y, además, descargar un Plug-In es una tarea normalmente lenta y tediosa, de modo que no hay que confiar nunca en que el navegante se quiera dar el trabajo de bajarse un Plug-In a menos que lo que ofrezcamos sea realmente MUY interesante.

Además, aunque en el futuro probablemente sea una de las etiquetas más usuales, hoy día no todos los navegadores pueden reconocerla, y los que sí la reconocen lo suelen hacer de forma incorrecta. De modo que debes tener mucha prudencia en su uso.

Y una vez vista la teoría de este elemento, vamos a ver inmediatamente cómo se usa:

<OBJECT DATA="archivo" TYPE="tipo mime">
Contenido alternativo
</OBJECT>

Bueno, esto no parce muy dificil. De hecho es muy parecido a todo lo que hemos visto antes. usamos DATA para poner el nombre (y la URL si es necesaria) del archivo que vamos a usar, y TYPE para decirle al navegador, por medio de la clasificación MIME, qué clase de recurso es.

Sobre los tipos MIME ya hemos visto algo en capítulos anteriores, pero existe una infinidad de ellos. Por ejemplo, para escuchar un sonodo al cargarse la página deberíamos usar, en principio, el siguiente código:

<HTML>
<HEAD>
<TITLE>Una primera aproximaci&oacute;n al sonido con OBJECT</TITLE>
</HEAD>
<BODY>

<H1>Ejemplo no muy bueno</H1>

<OBJECT DATA="t-rex.wav" TYPE="sound/wav">
(Sonido de un Tiranosaurio enfadado)
</OBJECT>

</BODY>
</HTML>

EjemploAquí tienes el ejemplo anterior.

Si usas Internet Explorer, habrás visto (o escuchado) que el rugido del tiranosaurio furioso se escucha al cargar la página. Sin embargo, en Netscape Navigator aparece una imagen no muy clara que es parte de un cuadro de mando para una consola de sonido, sobre la que hay que pulsar para que se escuche al bicho rugir (Todo esto, claro, suponiendo que tengas los plug-ins usuales). Mosaic te dá la opción de descargar el archivo o asignar un programa con el que abrirlo (suponiendo que no lo tengas ya asignado), y otros navegadores pueden hacer cosas totalmente distintas.

Esto es una constante que te vas a encontrar al usar el elemento OBJECT. No puedes saber cómo se comportará exactamente en cada navegador.

Para poder solucionar este problema con Netscape podemos ayudarnos de dos atributosde OBJECT: WIDTH y HEIGHT, que sirven, como te estás imaginando, para definir el ancho y el alto, respectivamnente, de un OBJECT.

Estos atributos son necesarios, evidentemente, en las imágenes, videos, y otros elementos que ocupen un espacio en pantalla, pero también pueden ayudarnos en este caso:

<HTML>
<HEAD>
<TITLE>Una aproximaci&oacute;n algo mejor al sonido con OBJECT</TITLE>
</HEAD>
<BODY>

<H1>Ejemplo aceptable</H1>

<OBJECT DATA="t-rex.wav" TYPE="sound/wav" HEIGHT="60" WIDTH="144">
(Sonido de un Tiranosaurio enfadado)
</OBJECT>

</BODY>
</HTML>

EjemploAquí tienes el ejemplo.

Ahora aparece, tanto en Internet Explorer como en Netscape Navigator, una pequeña consola de sonido. Las proporciones que he puesto (60x124) son las que recomienda Netscape, pero puedes experimentar tú mismo (La consola de Explorer parece demasiado pequeña).

El que la consola aparezca también en Explorer tiene otra ventaja: A mucha gente (a mí, por ejemplo) le molesta la música que suelen poner en las páginas web, y con la consola puede pararse.

El darle unas dimensiones determinadas al object tiene pleno sentido en el caso de las imágenes y las películas. Veamos un ejemplo con una ridícula animación en formato flash:

<HTML>
<HEAD>
<TITLE>Flash por medio de OBJECT</TITLE>
</HEAD>
<BODY>

<P>Ejemplo del uso de Object para una animaci&oacute;n en formato Flash (Flash es un formato para im&aacute;genes, animaciones y construcciones interactivas propiedad de la empresa Macromedia)</P>

<CENTER><OBJECT DATA="cartel.swf" WIDTH=200 HEIGHT=100 TYPE="application/x-shockwave-flash">
Edico&oacute;n Extremadamente Simple de HTML
</OBJECT></CENTER>

</BODY>
</HTML>

EjemploAquí puedes ver este estúpido ejemplo.

Si tu navegador tiene instalado el plug-in adecuado, habrás visto un pequeño cartel animado. En caso de que no lo tengas, deberías haber podido leer el texto "Edición Extremadamente Simple de HTML" (que es, precisamente, lo que decía el cartel animado).

A los OBJECTs también pueden asignarseles parámetros, igual que hemos visto con los APPLETs. En este caso los parámetros se asignan al plug-in, y nos permiten controlar algunas de sus propiedades o del objeto que representemos. El problema consiste en que no sbemos qué plug.in va a tener instalado nuestro visitante ni qué parámetros aceptará, de modo que depender de ellos es algo parecido a una lotería, de modo que, hoy por hoy, no te los recomiendo para nada.

De todas formas, por si prefieres ignorar mis sabios consejos, te informaré de que los parámetros se aplican con la siguiente etiqueta:

<PARAM NAME="nombre" VALUE="contenido">

Es decir: Exactamente igual que para APPLET. Solo que, en este caso, se sitúa entre <OBJECT> y </OBJECT> (parece obvio ¿No?).

OBJECT acepta algunos atributos:

ALIGN, que se usa exactamente igual que en las imágenes.

HSPACE, que se usa exactamente igual que en las imágenes.

VSPACE, que se usa exactamente igual que en las imágenes.

Y BORDER, que se usa (¿Lo has adivinado?) exactamente igual que en las imágenes.

Si no te acuerdas de cómo funcionan estos atributos, puedes ir al Capítulo 4 de este curso para recordarlo, porque yo no pienso repetirlo otra vez.

Algo interesante de OBJET es que también puede utilizarse para insertar APPLETs. De hecho, en el futuro, la etiqueta APPLET será eliminada para dejar paso a esta. De todos modos aún es una poción demasiado arriesgada, porque los navegadores suelen dar demasiados problemas con ella.

Y con esto acabamos este capítulo de nuestro curso de HTML. Seguro que te ha sabido a poco, pero esta es la sensación que suelen dejarle a todo el mundo estas nuevas ténicas: Podrán tener muchísimas utilidades, pero solo cuando estén lo suficientemente asentadas.

Y todavía es pronto para eso.

---

Capitulo anteriorPrincipio de este capituloIndice del cursoCapitulo siguiente

---

HTML 4.0 VálidoCSS Válido