Saltar la navegación

Sintaxis

HTML es un lenguaje de etiquetas.

A través de las etiquetas vamos definiendo los elementos del documento (enlaces, párrafos, imágenes...)

  • Una etiqueta se abre: <ejemplo>
  • Y se cierra: </ejemplo>

Por ejemplo: la etiqueta para un párrafo es "p".

Si quiero escribir un párrafo en HTML, abro la etiqueta, introduzco el texto del párrafo y cierro la etiqueta:

<p>Soy un párrafo.</p>

Partes de un documento HTML

Las más importantes son:

  • Cabecera (HEAD)
  • Cuerpo (BODY)

Un documento HTML contiene ambas, de manera que su estructura más básica sería:

<html>
	<head></head>
	<body></body>
</html>

En la etiqueta HEAD se incluirán los encabezados (título de la página -etiqueta “title”-, metainformación y otros elementos que veremos más adelante, como la llamada a las hojas de estilo CSS).

En la etiqueta BODY irá, como su propio nombre indica, el cuerpo de la página (los párrafos, las imágenes, las listas, etc.)

Es decir:

Tatuaje HTML
webmove. HTML tatoo (CC BY)

Y tanto el HEAD como el BODY formarán parte del HTML. Están dentro de la etiqueta HTML.

Creación de una página HTML

Ya estamos en condiciones de entender este código:

<html>
    <head>
        <title>Ejemplo 1</title>
    </head>
    <body>
        <h1>Un ejemplo sencillo de HTML</h1>
        <p>Hola.</p>
        <p>Te doy la bienvenida al maravilloso mundo del HTML.</p>
    </body>
</html>

Cópialo, pégalo en un documento en blanco del bloc de notas, guárdalo con extensión .html (ejemplo: ejemplo_1.html) y ábrelo con un navegador (Firefox, Safari, Opera, Google Chrome, Internet Explorer...)

Eso es una página web. Como veréis, lo que habéis escrito en el “title” se ve en la parte superior del navegador (acordaos: se volverá a hablar de esto cuando hablemos de accesibilidad).

En una sola clase no vamos a convertirnos en expertos en HTML, pero sí podemos aprender lo suficiente para comprender el lenguaje y no encontrar dificultades a la hora de crear un documento sintáctica y semánticamente correcto.

Sin embargo, saber algo más de HTML es muy recomendable.

A mayor conocimiento, mayor control de nuestras páginas, de su apariencia y de su nivel de accesibilidad.