Saltar al contenido principal

Texto

El lenguaje HTML permite definir la función que realiza el texto de una página web.

Encabezados

Los encabezados sirven para identificar las secciones de un documento e indicar su importancia relativa. El texto del encabezado debe ser claro y descriptivo.

Existen seis niveles de encabezado ( h1, h2, h3, h4, h5 y h6 ) y deben anidarse correctamente. Es decir, un h1 irá seguido por un h1 o un h2, y un h2irá seguido por un h2 o h3, etc.

Solo pueden saltarse niveles hacia arriba, cuando por ejemplo, después de un h3 empieza una nueva sección y usamos un h2.

Ejemplo

Título 1

...

Título 2

...

Título 3

...

Título 3

...

Título 2

...
HTML
<h1>Título 1</h1>
...
  <h2>Título 2</h2>
  ...
    <h3>Título 3</h3>
    ...
    <h3>Título 3</h3>
    ...
  <h2>Título 2</h2>
  ...

Párrafos

Los párrafos nos permiten dividir el texto en fragmentos temáticos, facilitando así su lectura.

Los párrafos se marcan con el elemento p.

Es recomendable limitar los párrafos a una única idea principal.

Aviso: Hay que evitar el uso de párrafos vacíos para crear saltos de línea, porque los lectores de pantalla los leen como “en blanco”.

Listas

Las listas se utilizan para mostrar un conjunto de elementos consecutivos.

Listas no ordenadas

Las listas no ordenadas (ul) se utilizan cuando los elementos no tienen un orden específico.

Ejemplo
  • Peras
  • Manzanas
  • Melones
  • Sandías
HTML
<ul>
    <li>Peras</li>
    <li>Manzanas</li>
    <li>Melones</li>
    <li>Sandías</li>
</ul>

Listas ordenadas

Las listas ordenadas (ol) indican que los elementos siguen un orden progresivo o una secuencia.

Ejemplo
  1. Encender el ordenador
  2. Abrir el navegador
  3. Ir a la web de búsqueda
  4. Teclear el término a buscar
HTML
<ol>
    <li>Encender el ordenador</li>
    <li>Abrir el navegador</li>
    <li>Ir a la web de búsqueda</li>
    <li>Teclear el término a buscar</li>
</ol>

Listas de definición

Las listas de definición (dl) sirven para mostrar definiciones de palabras y se estructuran como término (dt) y definición (dd).

Ejemplo
HTML
Lenguaje de marcado para la elaboración de páginas web.
CSS
Lenguaje usado para definir y crear la presentación de páginas web.
YAML
Formato de serialización de datos legible por humanos.
HTML
<dl>
  <dt>HTML</dt>
  <dd>Lenguaje de marcado para la elaboración de páginas web.</dd>

  <dt>CSS</dt>
  <dd>Lenguaje usado para definir y crear la presentación de páginas web.</dd>

  <dt>YAML</dt>
  <dd>Formato de serialización de datos legible por humanos.</dd>
</dl>

Citas

Las citas pueden ser en línea, cuando aparecen dentro de un párrafo, o en bloque, cuando forman un párrafo.

Cita en línea

Ejemplo

El poeta dijo: En muchas ocasiones la lectura de un libro ha hecho la fortuna de un hombre, decidiendo el curso de su vida.

HTML
<p>El poeta dijo: <q>En muchas ocasiones la lectura de un libro ha hecho la fortuna de un hombre, decidiendo el curso de su vida.</q></p>

Cita en bloque

Ejemplo

El cuerpo humano es el carruaje; el yo, el hombre que lo conduce; el pensamiento son las riendas, y los sentimientos los caballos.

HTML
<blockquote><p>El cuerpo humano es el carruaje; el yo, el hombre que lo conduce; el pensamiento son las riendas, y los sentimientos los caballos.</p></blockquote>

Énfasis

Existen dos elementos estructurales para enfatizar las palabras:

  • Cursiva: <em>Texto</em>
  • Negrita: <strong>Texto</strong>

Idioma

Indicar el idioma ayuda a las aplicaciones de síntesis de voz, traducción y corrección de textos a presentar la información de forma correcta.

Identificamos el idioma mediante el atributo lang.

Ejemplo 1: Identifica el idioma de la página añadiendo el atributo lang a la etiqueta html.

HTML
<html lang="es">

Ejemplo 2: Marca los cambios de idioma usando el atributo lang en el elemento que engloba al texto.

HTML
<p>El lenguaje (<abbr lang="en" title="Hypertext Markup Language">HTML</abbr>)...</p>

Nota: Los códigos de los idiomas siguen el estándar ISO 639.