En los dos primeros capítulos hemos presentado las herramientas fundamentales para construir un documento HTML. Hemos dejado sin tratar
algunas cuestiones que, aunque para ser exhaustivos deberíamos haber presentado, podían resultar excesivamente dificultosas en las primeras etapas. Por otra parte,
hay varios detalles de relativa importancia, que conviene conocer. Ahora es el momento de presentar toda esta información.
Coloco en este primer apartado, de manera necesariamente desordenada, una serie de detalles de importancia.
1.1. Los caracteres especiales
La codificación que utiliza HTML contiene 255 caracteres. Los 127 primeros coinciden con el código ASCII. Los siguientes, del 128 al 255, se denominan
caracteres extendidos.
Todos estos caracteres pueden indicarse por medio del número de código correspondiente, escrito entre los caracteres &#...;, donde
el número se coloca en los puntos suspensivos.
Bastantes caracteres poseen, además del código numérico, un "alias" o código reducido, que se escribe sin el asterisco (&...;). Los
más utilizados son los siguientes:
Coloco en un anexo la lista completa de los Códigos de HTML.
Por otra parte, en HTML hay cuatro caracteres de control que se utilizan para formar etiquetas, establecer parámetros, etc. Para
emplearlos en el texto de una página, como un carácter cualquiera, deben escribirse los códigos corespondientes (por supuesto, también aparecen en la lista
completa anterior):
Código
Resultado
<
<
>
>
&
&
"
"
1.1. Los comentarios
En ocasiones, conviene dejar escritos en el propio documento determinados comentarios de utilidad para el propio editor, y que no interesa por tanto que se
visualicen con el resto del documento.
Los comentarios habituales se refieren al propio código o a la estructura del documento
La etiqueta que permite esta función es <!...>. Los puntos suspensivos representan el comentario.
Esta etiqueta, como <BR> y <HR>, no es pareada. No obstante, es también común utilizarla como si lo
fuera, de la siguiente manera: <!--comentario//-->.
Un comentario habitual en las páginas web se coloca incluso antes que la propia etiqueta de <HTML> e indica el estándar
HTML1 que sigue la página en cuestión. Por ejemplo, ésta que estás leyendo incluye este comentario:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
1.3. Otras etiquetas de formato de frase
Hay una serie de etiquetas que generan texto con determinados formatos específicos.
No son muy utilizadas porque en realidad, más que imprimir formatos, informan sobre el tipo de información que encierra la etiqueta.
En definitiva, el formato de visualización de estas etiquetas depende en cierta medida de la configuración de los navegadores:
<CITE>...</CITE> se utiliza para las citas.
<CODE>...</CODE> se utiliza prar escribir código fuente.
<KDB>...</KDB> se utiliza para representar texto tecleado por el usuario.
<VAR>...</VAR> se utiliza para representar variables de un código.
<SAMP>...</SAMP> se utiliza para representar textos transcritos literalmente.
<ABBR>...</ABBR> se utiliza para señalar las abreviaturas.
En esta lista se deberían incluir, en rigor, las etiquetas <STRONG>...</STRONG> (texto importante) y
<EM>...</EM> (texto enfatizado), vistas en el primer capítulo.
1.4. Las marquesinas
Una marquesina es una porción de texto (a cualquier otro componente, incluidas las tablas) que se desplaza dentro de la ventana.
La etiqueta básica es <MARQUEE>...</MARQUEE>.
El desplazamiento por defecto es de derecha a izquierda ininterrumpidamente.
Dos atributos de la etiqueta permiten controlar ese movimiento:
Atributo
Resultado
<MARQUEE direction="left">
Desplazamiento de derecha a izquierda
<MARQUEE direction="right">
Desplazamiento de izquierda a derecha
<MARQUEE direction="down">
Desplazamiento de arriba a abajo
<MARQUEE direction="up">
Desplazamiento de abajo a arriba
<MARQUEE behavior="scroll">
Desplazamiento continuo
<MARQUEE behavior="slide">
Desplazamiento único (queda quieto)
<MARQUEE behavior="alternate">
Alterna el desplazamiento (como si rebotara)
Otras dos propiedades muy utilizadas en las marquesinas son la de color de fondo (<MARQUEE bgcolor="¿?">) y tamaño
(<MARQUEE width="n">).
Como siempre, los atributos pueden combinarse. Por ejemplo: <marquee behavior="slide" direction="left" width="75%"
bgcolor="#006699">.
El contenido de la marquesina puede llevar su propio etiquetado.
Las etiquetas pareadas <HEAD>...</HEAD> y <BODY>...</BODY> constituyen el
esqueleto básico de un documento HTML. Fueron presentadas, por tanto, en el Primer Capítulo de esta serie, pero sin ahondar en sus
propiedades. Ahora es el momento de hacerlo.
La cabecera de un documento HTML (<HEAD>...</HEAD>) es el lugar idóneo para colocar toda la información que no afecta al contenido que se presentan en el navegador.
Por eso, en la cabecera se suelen colocar los comentarios generales, así como las hojas de estilo (o su enlace), los scripts (pequeños programas),
etc.
Hay una etiqueta preparada para indicar diversa información general acerca del documento, y que sirve también a los buscadores a la hora de localizar la
página: se trata de la etiqueta <META>.
La etiqueta <META> posee la siguiente sintaxis general: <META name="?" content="?">. El valor del
atributo name indica el tipo de información, cuyo contenido real se especifica en la propiedad name.
Los valores más habituales de la propiedad name son los siguientes:
Parámetro
Información
name="author"
Autor de la página
name="generator"
La herramienta utilizada para crear el documento
name="title"
El título del documento (Cf. <TITLE>)
name="keywords"
Palabras clave del documento
name="description"
Breve descripción del documento
La etiqueta <META> no es pareada, es decir, no necesita cierre.
En lugar del atributo <META name> puede usarse <META http-equiv>. Este atributo, además, puede
utilizarse para indicar al navegador alguna acción que deseamos que realice al entrar en el documento. Veamos, por ejemplo, dos aplicaciones:
La etiqueta <META http-equiv="refresh" content="60"> hará que la página se refresque automáticamente cada 60 segundos.
La etiqueta <META http-equiv="refresh" content="5; URL=http://www.alexiribar.net"> hará que la página se redireccione
automáticamente al de 5 segundos a la dirección indicada.
3. Propiedades del cuerpo (<BODY>) de un documento HTML
A diferencia de la cabecera, el contenido de la etiqueta <BODY>...</BODY> será visualizado por el navegador.
Las propiedades especificadas en esta etiqueta afectarán, lógicamente a todo el documento. Corresponden, en cierto modo, a las propiedades de formato de
página de un procesador de textos.
Los colores de un documento
Como vimos en el Segundo Capítulo de esta serie, las instrucciones para colocar un fondo de pantalla, ya sea un color o una imagen,
se colocan en la etiqueta <BODY>...</BODY>, de esta manera:
Para un color de fondo, <BODY BGCOLOR="código">.
Para una imagen de fondo, <BODY BACKGROUND="dirección">.
Cuando se utiliza una imagen de fondo, suele tratarse simplemente de algún pequeño archivo con algún tipo de textura, que se coloca a modo de mosaico, como si
fuera un papel pintado.
La utilización de fondos puede llegar a dificultar gravemente la lectura de los caracteres. Veámoslo con un doble ejemplo de color de fondo e imagen de
fondo:
Para solucionar este problema, existen etiquetas que permiten especificar el color del texto y de los enlaces:
Etiquetas
Función
<BODY TEXT="#¿?">
Determina el color del texto
<BODY LINK="#¿?">
Determina el color del enlace
<BODY VLINK="#¿?">
Determina el color del enlace visitado
<BODY ALINK="#¿?">
Determina el color del enlace activo
En principio, el color de los caracteres puede variar según los navegadores, puesto que depende de sus opciones por defecto. Estas etiquetas anulan dichas
especificaciones por defecto, asegurando por tanto que todos los caracteres del documento se verán de igual manera en cualquier browser.
Como estas etiquetas se insertan en la etiqueta <BODY>, afectan a todo el documento; son, por tanto, mucho más potentes que la
etiqueta <FONT COLOR>.
Veamos ahora cómo pueden mejorarse con estas nuevas etiquetas los ejemplo anteriores:
Como puede observarse, el Ejemplo 2-b resulta prácticamente imposible de leer con esa definición de color. Podríamos buscar alguna combinación que destacase
más, pero el verdadero problema de ese documento es que la imagen utilizada como fondo es inadecuada. La solución consiste –como mínimo– en tratar
dicha imagen en un programa adecuado, para suavizar sus tonos.
Los márgenes de un documento
Los márgenes del documento web (esto es, la distancia entre el borde de la ventana y el contenido de la página) pueden especificarse por medio de cuatro
propiedades de la etiqueta <BODY>: <BODY leftmargin="n">, <BODY topmargin="n">,
<BODY rightmargin="n"> y <BODY bottommargin="n">.
También existen los atributos <BODY marginheight="n"> y <BODY marginwidth="n">, específicamente
pensados para el navegador Nescape.
Para eliminar los márgenes, los valores de los atributos deben ser cero.
Cuando comenzó el boom de las páginas web, el estándar utilizado era HTML 2.0, establecido en 1995, y que incluía ya el etiquetado básico. Como no había
apenas control sobre el etiquetado, las principales compañías (en especial Netscape, líder indiscutible en ese momento) comenzaron a crear sus propias etiquetas.
En 1997, el IETF (Internet Engineering Task Force, es decir, el Grupo de Trabajo en Ingeniería de
Internet, un organismo de carácter eminentemente técnico) aprobó el estándar HTML 3.0, que no tuvo excesivo seguimiento. Se encomendó entonces la elaboración
de los estándares HTML a otro organismo, el World Wide Web Consortium (W3C), que aprobó sucesivamente las
versiones HTML 3.2, 4.0, 4.01, XHTML 1.0, 1.1, 2.0...
