Se pueden establecer varias categorías dentro de las etiquetas usadas para formatear el texto. Habitualmente se suelen dividir entre aquellas que sirven para cambiar párrafos enteros y las que son capaces de formatear tiras de caracteres dentro del párrafo.
Formato del párrafo
Estas son las etiquetas más importantes (excluyendo algunas que veremos más adelante):
||
Etiqueta ||
Utilidad ||
Resultado ||
|| <P> || Sirve para delimitar un párrafo. Inserta una línea en blanco antes del texto. || Soy un párrafo ||
|| <CENTER> ... </CENTER> || Permite centrar todo el texto del párrafo. ||
Yo soy normal
Yo estoy centrado
||
|| <PRE WIDTH=x> ... </PRE> || Representa el texto encerrado en ella con un tipo de letra de paso fijo. Muy útil a la hora de representar código fuente. El parámetro WIDTH especifica el número máximo de caracteres en una línea. || Estoy en paso fijo ||
|| <DIV ALIGN=x> ... </DIV> || Permite justificar el texto del párrafo a la izquierda (LEFT) derecha (RIGHT), al centro (CENTER)o a ambos márgenes (JUSTIFY) ||
Yo estoy a la izquierda
Yo al centro
Y yo a la derecha (recuerda al PP) Para justificar la aparición en muchos sitios. ||
|| <ADDRESS>... </ADDRESS> || Para escribir direcciones (donde vive la gente). || Marisol Soto, Calle María Maroto N·5 1º ||
|| <BLOCKQUOTE>... </BLOCKQUOTE> || Para citar un texto ajeno. Se suele implementar dejando márgenes tanto a izquierda como a derecha, razón por la que se usa habitualmente. || Los productos Microsoft son fuente de problemas graves. ||
Las 6 cabeceras
HTML nos ofrece seis etiquetas distintas para mostrar cabeceras. Son éstas:
|| Etiqueta || Resultado ||
|| <H1>... </H1> || Cabecera de nivel 1 ||
|| <H2>... </H2> || Cabecera de nivel 2 ||
|| <H3> ... </H3> || Cabecera de nivel 3 ||
|| <H4>... </H4> || Cabecera de nivel 4 ||
|| <H5> ... </H5> || Cabecera de nivel 5 ||
|| <H6>... </H6> || Cabecera de nivel 6 ||
Estas etiquetas se pueden definir como de formato de párrafo pero por su importancia no resulta recomendable utilizarlas para aumentar o disminuir el tamaño del tipo de letra, ya que cada navegador los muestra de manera diferente. Se usan para dividir correctamente en secciones la página que estamos diseñando, tal y como se hace en un documento de texto normal.
Cambiando el tipo de letra
Todas estas etiquetas nos permiten cambiar de una manera u otra el aspecto del tipo de letra que estemos utilizando y se pueden utilizar con tiras de caracteres dentro de un párrafo.
|| Etiqueta || Utilidad || Resultado ||
|| <B>... </B> || Pone el texto en negrita. || Soy un texto negro como el tizón ||
|| <I>... </I> || Representa el texto en cursiva. || Estoy ladeado ||
|| <U>... </U> || Para subrayar. || Soy importante, estoy subrayado ||
|| <S>... </S> || Para tachar. || ++A mí, en cambio, nadie me quiere++ ||
|| <TT>... </TT> || Permite representar el texto en un tipo de letra de paso fijo. || No soy variable ||
|| <SUP>... </SUP> || Letra superíndice. || E=mc2 ||
|| <SUB>... </SUB> || Letra subíndice. || ai,j=bi,j+1 ||
|| <BIG>... </BIG> || Incrementa el tamaño del tipo de letra. || Soy GRANDE ||
|| <SMALL>... </SMALL> || Disminuye el tamaño del tipo de letra. || Creí ver un lindo gatito ||
|| <BLINK>... </BLINK> || Hace parpadear el texto. Resulta algo irritante. || ¿Molesto? ||
Formato de frase
En estos elementos indicas el tipo de información que encierran las etiquetas, pero no como se representan:
||
Etiqueta ||
Utilidad ||
Resultado ||
|| <CITE>... </CITE> || Para citar un texto ajeno. ||
Esta frase no es mía ||
|| <CODE>... </CODE> || Para escribir código fuente. || ||
|| <STRONG>... </STRONG> || La cosa es importante. || Hay cosas
importantes. ||
|| <EM>... </EM> || Para dar énfasis. || Hay que poner
énfasis en algunas cosas. ||
|| <KBD>... </KBD> || Texto tecleado por el usuario. || El usuario debe teclear Multivac es el mejor. ||
|| <VAR>... </VAR> || Representar variables de un código. || La variable
x, definida anteriormente... ||
|| <SAMP>... </SAMP> || Para representar una serie de caracteres literalmente. || Estoy en un literal> ||
|| <ABBR>... </ABBR> || Abreviaturas. || La WWW usa el protocolo http ||
No son muy utilizados, ya que no permiten tener un control exacto de la manera en que la página se representará finalmente.
Otros elementos
Por último, debemos estudiar algunos entes que no son texto y que podemos incorporar a nuestra página.
|| Etiqueta || Utilidad || Resultado ||
|| <HR> || Inserta una barra horizontal. ||
||
|| <BR> || Salto de línea. || Hay un antes y un
después de saltar a otra línea ||
|| <!--... --> || Comentarios. || Esto se escribe y no se muestra ||
Caracteres especiales
Como se puede observar en los textos de los mismos no hay acentos, ni eñes, ni símbolos de abrir interrogación o exclamación. Esto es debido a los distintos juegos de caracteres que manejan los ordenadores.
Las máquinas manejan la información en formato binario (unos y ceros). Estos, a su vez, forman números, los cuales se traducen en letras. ¿Cómo? Mediante tablas. Podemos asignar el valor 64 a la letra a, el 65 a la b, etc..
El problema sería que cada ordenador de un fabricante distinto podría adoptar una tabla diferente al resto. Para evitarlo existen estándares y el más extendido es el ASCII. De hecho, actualmente todos los ordenadores tienen la misma tabla ASCII para los primeros 127 caracteres. Pero esa tabla no contiene vocales con acento, ni eñes, ni símbolos de abrir interrogación o exclamación...
El HTML 2.0 eligió como tabla estndar la ISO-Latin-1, que comparte con la ASCII los 127 caracteres e incluye unos cuantos más hasta el número 255.
Caracteres extendidos en HTML
La manera de incluir los caracteres extendidos (cuyo número está más allá del 127) consiste en encerrar el código entre los caracteres &#y ;. Así pues, lo siguiente: ½ nos debería dar un medio (½). También existe una serie de sinónimos para poder recordar con más facilidad estos caracteres. Así, por ejemplo, ½ también se puede escribir como ½. Vamos a ver algunos de estos códigos, los más útiles a la hora de escribir en español:
|| Código || Resultado ||
|| á,Á, é, É,... || á, á, é, É, í, í, ó, Ó,ú y Ú ||
|| ñ y ñ || ñ y ñ ||
|| ¿ || ¿ ||
|| ¡ || ¡ ||
|| º || º ||
|| ª || ª ||
|| ™ o ™ || ™ o ™ ||
|| © || © ||
|| ® || ® ||
|| || (espacio en blanco que no puede ser usado para saltar de línea) ||
Caracteres de control
En el HTML existen cuatro caracteres de control, que se usan para formar etiquetas, establecer parámetros, etc.. Para poder emplearlos sin riesgo deberemos escribir los siguiente códigos:
|| Código || Resultado ||
|| < || < ||
|| > || > ||
|| & || & ||
|| " || " ||
