Párrafos en HTML

Ha llegado el momento de aprender a introducir un texto en una página web, pero antes es necesario comprender cómo será interpretado este texto. Cuando un navegador lee el código HTML de una página y lo interpreta para mostrar la página, todos los espaciados múltiples, tabulados o saltos de línea que se haya incluido en los textos serán interpretados como un único espacio. Esta característica suele sorprender (e incluso molestar) al principio, pero es innegable que esta forma de actuar es necesaria y concuerda con el carácter descriptivo de HTML.
La mejor manera de habituarse es probar, para ello proponemos los siguientes ejemplos de código que serán mostrados de la misma forma por el navegador aunque algunos contengan saltos de línea, otros tabulados entre las palabras, etc.

Conclusión

Ya sabemos mucho sobre la programación de páginas. Conocemos las principales características del lenguaje HTML y qué es necesario para crear un Web. Hemos aprendido además las bases del lenguaje y hemos creado nuestra primera página de ejemplo, con texto y encabezados, y la hemos puesto un título.
En la siguiente entrega realizaremos la primera página web completa, con párrafos, imágenes e hiperenlaces.
Aprenderemos también a alinear el texto a los dos lados de la página y a combinar esta alineación con la inclusión de imagenes. Igualmente veremos cómo es posible crear enlaces a distintos puntos de una página así como a otras páginas o puntos concretos de estas.

El ejemplo mejorado

Ahora que sabemos usar encabezados los utilizaremos para mejorar ligeramente nuestra página. En la figura podemos ver cómo se muestran las modificaciones.

Ejemplo de páginaWeb con dos tipos de encabezados y dos párrafos.

Los encabezados

Usualmente un documento tiene, además de texto llano, una serie de encabezados o titulares. Para ello el lenguaje HTML posee una serie de etiquetas que permiten disponer de titulares de hasta 6 niveles de importancia. Estas etiquetas son: <h1>, <h2>, <h3>, <h4>, <h5> y <h6>. La letra "h" al principio del nombre de estas etiquetas provienen de la abreviatura de la palabra inglesa heading que significa encabezado. Siguiendo a la hache hay un número del uno al seis que indica la importancia del titular siendo el más importante el uno y el menos importante el seis. En la figura se puede ver un ejemplo de cómo muestra las cabeceras del navegador.

Distintos tipos de encabezados vistos con el navegador.

El código usado en este ejemplo es el siguiente:

<h1>Encabezado 1</h1>

<h2>Encabezado 2</h2>

<h3>Encabezado 3</h3>

<h4>Encabezado 4</h4>

<h5>Encabezado 5</h5>

<h6>Encabezado 6</h6>

NOTA: Los encabezados empiezan siempre en una línea nueva y el texto que les sigue comenzará en la línea siguiente. Además el navegador podrá mostrar un espacio vertical adicional entre el encabezado y el texto anterior y posterior.

En él observamos que todos los titulares están en negrita y el tamaño de la fuente usada para cada encabezado va decreciendo conforme decrece la importancia del titular. Pero hay que tener en cuenta, tal y como comentábamos en la introducción, que este es sólo un ejemplo y que otros navegadores pueden mostrar estos encabezados de manera diferente.

En la figura siguiente podemos apreciar como se muestra los encabezados de una manera prácticamente idéntica. Por esta razón podemos estar casi seguros de que los usuarios verán los encabezados de la forma mostrada en ambas figuras.

Distintos tipos de encabezados vistos con el navegador

Hay que destacar que los encabezados de h1 a h4 pueden ser usados como títulos ya que los navegadores suelen usar un tamaño de letra mayor que el habitual para mostrarlos. Sin embargo los encabezados h5 y h6 suelen ser mostrados con letra más pequeña aún que el texto y por esta razón se usan como notas a pie de página o comentarios de poca importancia.