Ya seas programador, diseñador, redactor, publicista o experto en marketing, en algún momento te las verás con el lenguaje HTML. ¿Conoces sus etiquetas?
En varias ocasiones hemos hablado de cómo se crearon las primeras páginas web. Quedan pocas, la mayoría en Internet Archive como recuerdo. El caso es que en los primeros tiempos, por así decirlo, poner en marcha una página web implicaba escribir en lenguaje HTML puro y duro.
Creabas un archivo en blanco y escribías en HTML. Luego llegaron CSS, PHP y más tarde la cosa se complicó con Java y Flash. Además, llegaron herramientas como DreamWeaver o FrontPage, que permitían trabajar con páginas web igual que creabas un documento de texto o una presentación.
Sea como fuere, el lenguaje HTML sigue siendo un pilar fundamental de Internet, por lo que es inevitable que te encuentres con este lenguaje sea cual sea tu profesión. Así que no está de más aprender las etiquetas básicas e imprescindibles para dar forma a textos, imágenes y, en definitiva, cualquier contenido en HTML.
Etiquetas básicas
Primero hay que recordar que las etiquetas HTML definen el contenido que llevan dentro. Habitualmente, se indica una etiqueta de apertura y otra de cierre. En ocasiones, hay etiquetas dentro de etiquetas.
Las etiquetas de apertura se indican entre símbolos menor que < y mayor que >, y las de cierre, entre menor que <, símbolo / y mayor que >.
HTML Primera y última etiqueta de un documento HTML. El resto de etiquetas van dentro de estas dos.
HEAD Con esta etiqueta se especifican los metadatos del documento.
TITLE Título de la página en cuestión. Se muestra en la barra de título del navegador.
BODY Dentro va todo el contenido que se verá de la página.
META Información adicional sobre la página: autor, fechas varias…
IMG Para insertar imágenes. Dentro de esa etiqueta se concretan atributos varios, como qué imagen publicamos, su nombre y el tamaño en la web. Los atributos de imagen pueden ser la propia imagen src=“enlace”, un título alternativo alt=“texto” o el tamaño de la imagen en la página en píxeles con height=“” y width=“”.
FORM Sirve para insertar un formulario HTML.
Dando formato a un texto
STRONG Aplica negrita al texto etiquetado. Puede sustituirse con la letra B.
EM Aplica cursiva al texto. Puede sustituirse con la letra i.
CITE Nos permite citar el título de un libro, canción u otra obra.
BLOCKQUOTE Sirve para citar una frase o texto.
CODE Sirve para mostrar código.
Estructurando un documento
H1 – H6 Hasta seis niveles de títulos y subtítulos. De más a menos tamaño.
DIV Permite dividir contenido en bloques.
P Para mostrar texto plano.
Listas
OL Para hacer una lista de elementos ordenados.
UL Para hacer una lista de elementos sin ordenar.
LI Para hacer una lista de elementos individuales.
Enlaces
A Para enlazar, la etiqueta es A (apertura) y /A (cierre). El atributo es HREF=“” para indicar el enlace, ya sea interno o externo.
Con el atributo HREF=“mailto:” puedes enlazar a una dirección de correo electrónico.
Tablas
Aunque es más práctico acudir a un generador de tablas HTML, empleando lenguaje HTML podemos crear tablas sencillas para organizar el contenido.
TABLE Define el contenido de la tabla.
CAPTION Describe la tabla.
THEAD El título de cada columna en la tabla.
TR Contenido en una fila.
TD Contenido en una celda.
Obviamente, estas etiquetas son solo los ejemplos más habituales de una larga lista. Encontrarás la lista completa en manuales y guías como la disponible en W3Schools.
