Aprender HTML

Curso de HTML

¿Alguna vez te has preguntado cómo se crea el contenido de las páginas web? ¿Qué define un texto como título o párrafo? ¿Cómo se da formato al texto? ¿Y cómo funcionan los enlaces? En este curso de HTML se responden todas estas preguntas y se ofrece una visión general. Aprenderás qué es el HTML y cómo utilizarlo.

¿Qué es HTML?

HTML es un lenguaje de marcado de hipertexto y sus siglas son el acrónimo de Hypertext Markup Language. Este lenguaje se utiliza para crear la estructura básica de una página web y añadirle elementos que dan forma al contenido, como texto (títulos y párrafos), imágenes, vídeos, enlaces, tablas, etc. En esencia, el HTML es como la estructura de un edificio a partir del cual se sustenta lo demás.

Tim Berners-Lee desarrolló el HTML en 1991, llamado HTML Tags, pensado para compartir información científica entre científicos de todo el mundo. Desde entonces, este lenguaje ha ido evolucionando con la finalidad de separar el contenido de la apariencia. Así, con la llegada del HTML 4.01 (1999) se recomendó el uso de hojas de estilo CSS. La versión HTML5 fue publicada en 2014, con nuevas etiquetas que añaden significado semántico.

Los navegadores web (Firefox, Chrome, Edge) interpretan el código HTML y muestran el resultado de cada etiqueta al usuario final. Aunque si somos más precisos, no todas las etiquetas HTML son para ofrecer información visual, ya que algunas de ellas permiten proporcionar metadatos: información adicional para otras aplicaciones. Por ejemplo, algunas etiquetas permiten insertar código CSS y JavaScript, o especificar la codificación de caracteres del documento.

¿Por qué aprender HTML?

Cada vez es más habitual publicar contenido en Internet, y a pesar de que existen muchos editores en línea o gestores de contenido (CMS) que facilitan el proceso de creación de las etiquetas HTML, lo cierto es que conocerlas es una gran ventaja. A veces necesitamos hacer algo más preciso o que no puede ser automatizado. Veamos algunas de las ventajas de aprender HTML:

Crear un sitio web. Puedes crear un sitio web desde cero o personalizar una plantilla existente. Conocer bien las etiquetas HTML permite estructurar bien el contenido, adaptar los atributos de las etiquetas o crear una plantilla propia.

Ser un diseñador web. El diseño web se realiza con la mezcla del HTML y las hojas de estilo CSS. Por tanto, para crear estilos es indispensable conocer el HTML como paso previo. Incluso algunas etiquetas tienen estilos por defecto.

Entender mejor la web. Aprender HTML puede ser muy útil a la hora de optimizar una página web, ya sea para obtener las validaciones W3C, para mejorar la velocidad de carga o para presentar contenido en mejores condiciones.

Para aprender otros lenguajes. Teniendo en cuenta que el HTML es la base estructural del contenido web, conocerlo es vital para adentrarse en otras tecnologías, como CSS y JavaScript, o lenguajes del lado del servidor como PHP.

Ejemplos de etiquetas HTML

Para entender mejor la naturaleza del HTML puede ser de ayuda visualizar algunas etiquetas habituales de este lenguaje de marcas. Por ejemplo, si queremos insertar un párrafo lo hacemos con las etiquetas <p> y </p>. De esta manera:

<p>Esto es un párrafo que contiene una frase.</p>

La mayoría de etiquetas HTML tienen una etiqueta de inicio y una etiqueta de cierre que incluye la barra /. Algunas etiquetas permiten dar formato al texto. Por ejemplo, la etiqueta <strong> se usa para escribir en negrita, la etiqueta <i> para escribir en cursiva y la etiqueta <u> para subrayar texto.

<strong>Negrita</strong>, <i>cursiva</i> y <u>subrayado</u>.

El código de arriba se verá así:

Negrita, cursiva y subrayado.

Aplicaciones del HTML

HTML es un lenguaje que se usa para crear páginas web, y es la base principal del desarrollo web. No importa si el código HTML se escribe de forma manual o si se genera de forma dinámica mediante otros lenguajes, como PHP, que el resultado final para el navegador siempre será un listado de etiquetas HTML con su contenido.

Gracias a los enlaces HTML se puede navegar entre distintas páginas de una web, o saltar de una web a otra. Por tanto, la navegación en Internet es posible gracias al lenguaje de marcas HTML. Los enlaces vinculan millones de sitios, los unos con los otros, como si de una gran telaraña se tratase.

El HTML funciona bien en todo tipo de dispositivos, como ordenadores, tablets y móviles. Esto es gracias a que existen navegadores web para todo tipo de sistemas operativos. Gracias a ello y con la ayuda del CSS se puede crear páginas web con diseño adaptable (responsive) que se ajusta a todo tipo de tamaños.

Para visualizar páginas web, en la mayoría de los casos hacemos uso de una conexión a Internet, es decir, mientras estamos en línea. Pero también podemos utilizar el HTML en local y estando offline. Esta particularidad ofrece soluciones de soporte offline para cuando sea necesario; por ejemplo, en guías de ayuda técnica.

HTML5 incorpora muchas novedades que amplían todavía más el abanico de aplicaciones de este lenguaje. Por ejemplo, se puede desarrollar juegos y todo tipo de aplicaciones interactivas. En esencia, HTML5 ha sustituido al antiguo Flash. Ejemplo de ello es Youtube, que pasó a usar HTML5 en 2015.

Audiencia

Este curso está pensado para todas aquellas personas que quieran comprender el funcionamiento de la web en general, o que quieran convertirse en diseñadores web. Los artículos de esta categoría ofrecen todo el conocimiento necesario para desenvolverse con facilidad en la creación y edición del código HTML.

Requisitos previos

No hay requisitos previos para aprender HTML, pero será de gran ayuda tener conocimientos básicos de uso de un sistema operativo, ya sea Linux, Mac o Windows. También será una ventaja tener conocimientos sobre:

  • Crear directorios y trabajar con archivos.
  • Conocer las extensiones de archivos y cómo editarlos.
  • Editores de código o de texto plano.
  • Conocimientos sobre formatos multimedia.

Empieza por el primer artículo: HTML: Introducción

Consulta las referencias: guía de referencias de HTML