Texto en HTML (V)
por Luciano Moreno, del departamento de diseño web de BJS Software.

CREACIÓN DE BLOQUES DE TEXTO.-

En este capítulo vamos a estudiar un poco cómo podemos ya formatear y distribuir el texto de nuestra página de una forma efectiva. Para ello disponemos de la ayuda de una serie de etiquetas específicas de HTML, que mas que formatear una palabra o grupo de ellas en alguno de los estilos posibles lo que nos permiten es definir bloques de texto con características definidas, crear espacios en blanco o saltos de línea, introducir cabeceras, etc. Es decir, que van un poco mas alla y nos van a permitir en cierta forma maquetar nuestros textos ademas de aplicarles un estilo definido.

Creación de parrafos.-

Los parrafos en HTML se definen mediante las etiquetas <P>...</P>, que engloban en un nuevo parrafo todo el texto comprendido entre ellas.

No es estríctamente necesaria la etiqueta de cierre </P>, ya que los navegadores asumen que comienza un nuevo parrafo en cuanto se encuentran con una etiqueta <P>, salvo en el caso de que parrafos sucesivos usen una alineación diferente, en cuyo caso sí que es necesaria cada etiqueta de cierre. De todas formas, y como regla general en todo el código HTML, es siempre conveniente poner las etiquetas de cierre, ya que así evitamos posibles errores y obtenemos un código limpio y claro.

Por lo tanto, a la hora de escribir nuestros textos en HTML deberemos estudiar los diferentes bloques que lo componen y distribuir cada uno de ellos dentro de una pareja de etiquetas <P>...</P>. Cada vez que acaba un parrafo se produce un salto de línea con espaciado incluido, por lo que entre dos parrafos habra siempre una línea en blanco. Si te fijas en la distribución del texto en esta página podras apreciar este salto entre parrafos, como ocurre si ir mas lejos con el parrafo que viene a continuación.

La forma primaria de construir bloques de texto en HTML pasa por la utilización de los parrafos.

La etiqueta <P> admite una serie de atributos que la complementan, entre los cuales destacan:

• <P ALIGN="left / center / right / justify">...</P>, que nos permite alinear el texto del parrafo a la izquierda (por defecto), centrado, a la derecha o justificado, en cuyo caso las líneas de texto ocuparan siempre la misma anchura total, encargandose el navegador de crear espaciados entre las palabra de cada linea para conseguir este efecto. Ejemplos:
  
  <P ALIGN="left">parrafo alineado a la izquierda</P>
  <P ALIGN="center">parrafo centrado</P>
  <P ALIGN="right">parrafo alineado a la derecha</P>
  
  que nos da:

  parrafo alineado a la izquierda

  parrafo centrado

  parrafo alineado a la derecha

  
  
  
• <P TITLE="texto">...</P>, que asigna un título determinado al texto contenido en el parrafo y que origina que al situar el cursor sobre cualquier parte de este texto aparezca un "bocadillo" con el texto introducido en el título. Se puede usar para introducir una pequeña explicación sobre el texto contenido en el parrafo. Ejemplo:

  HTMLWeb - Diseño Web

• <P STYLE="atributos de estilo">...</P>, cuya finalidad es la de asignar un estilo definido al texto incluido en el parrafo, y del que haremos un estudio mas amplio en el capítulo de Hojas de Estilo en Cascada (CSS) aplicadas a los textos.
  
  
• <P CLASS="clase">...</P>, analoga a la anterior, pero que ahora hace referencia a una clase de estilo definida bien en la cabecera de la página, bien en un fichero de estilos externo.
  
  
• <P ID="identificador">...</P>, analoga a las anteriores, pero que ahora define una serie de características de estilo y/o posicionamiento exclusivas de ese parrafo en concreto. Estudiremos esto en el tema de CSS.
  

Otros bloques de texto.-

La pareja de etiquetas <P>...</P> es la basica para la creación de bloques de texto con unos atributos de estilo propios, pero también disponemos de otro par de parejas de etiquetas que nos permiten conseguir lo mismo y que son:

• <DIV>...</DIV>, analoga del todo a la anterior y con los mismos atributos, pero que en vez de crear un salto de línea con separación crea un salto de línea simple entre dos bloques. Por ejemplo:
  
  <DIV>esto es un bloque creado con DIV</DIV>
  <DIV>y este es el siguiente, también creado con DIV</DIV>
  
  que nos da:
  
  
  esto es un bloque creado con DIV
  y este es el siguiente, también creado con DIV
  
  
  
• <SPAN>...</SPAN>, también parecida a las anteriores, pero que no posee el atributo ALIGN y que ademas no crea salto de línea, por lo que el contenido de dos bloque SPAN se vera uno a continuación del otro, en la misma línea. Ejemplo:
  
  <SPAN>esto es un bloque creado con SPAN</SPAN>
  <SPAN>y este es el siguiente, también creado con SPAN</SPAN>
  
  que nos da:
  
  esto es un bloque creado con SPAN y este es el siguiente, también creado con SPAN
  
  NOTA.- Estas últimas parejas de etiquetas, DIV y SPAN adquieren todo su significado con la aplicación de Hojas de Estilos, suponiendo un antes y un después en el formateo y posicionamiento de elementos en HTML. Las estudiaremos a fondo en el capítulo correspondiente.