El HTML es un tipo especial de documento de texto que es usado por los navegadores web para mostrar texto y contenido multimedia. Este documento de texto está formado por etiquetas HTML, que es un código que sirve para definir los distintos elementos de ese documento.
Toda etiqueta se encierra entre los signos < y >. La estructura de una etiqueta puede ser de dos maneras:
<nombre_de_la_etiqueta />
o bien,
<nombre_de_la_etiqueta> Elemento (texto, contenido multimedia, etc.) afectado por la acción de la etiqueta </nombre_de_la_etiqueta>
Debemos observar tres cuestiones en relación con la compatibilidad entre las diferentes versiones de HTML y de XHTML;:
- Las etiquetas pueden escribirse tanto en mayúsculas como en minúsculas en HTML, pero solo se pueden escribir en minúsculas en XHTML. Por ello, se recomienda usar siempre minúsculas dentro de las etiquetas.
- En cuanto a las etiquetas de primer tipo, en HTML podemos escribir
<nombre_de_la_etiqueta>mientras que en XHTML debemos siempre escribir<nombre_de_la_etiqueta/>. Por ello, para una mayor compatibilidad entre ambos, debemos siempre cerrar la etiqueta con el símbolo / dejando un espacio entre éste y el nombre de la etiqueta, tal como aparece en la parte superior. - En cuanto a las etiquetas de segundo tipo, algunas de ellas podían usarse sin usar la pareja en HTML. Por ejemplo, se podía usar la etiqueta
<p>elemento</p>o simplemente usar<p>elemento, y el efecto era el mismo. Pero en XHTML debemos siempre escribir<p>elemento</p>. Por ello, para una mayor compatibilidad entre ambos, se recomienda usar esta última estructura, tal como aparece en la parte superior.
Vamos ahora a ver unos ejemplos de cada. En el bloc de notas u otro editor de textos escribid:
<p>Esto es un párrafo en mi primera página web.</p><p>Y esto es otro párrafo.</p>
<hr />
y guardadlo como un documento con extensión .htm o .html. Importante: aseguraros de que lo guardáis con esa extensión, y no como un documento .txt, que es un error tonto pero muy habitual, especialmente si usáis el Bloc de notas de Windows. Si cerráis vuestro editor de texto y abrís el documento en vuestro explorador web, debería aparecer algo parecido a esto:
Esto es un párrafo en mi primera página web.
Y esto es otro párrafo.
Como podemos deducir, la etiqueta <p> </p> indica el comienzo y final de un párrafo, mientras que la etiqueta <hr /> dibuja una línea.
Cada etiqueta puede tener unos atributos que se pueden modificar. Para darle valor a un atributo, lo indicaremos de la siguiente manera:
<etiqueta atributo1="valor" atributo2="valor">
Se pueden añadir tantos atributos como una etiqueta lo permita y siempre es opcional. Aunque en HTML podíamos poner el valor de un atributo con o sin comillas, por cuestiones de compatibilidad con XHTML, se recomienda usar siempre comillas en los valores.
Vamos a continuar con el ejemplo anterior. Abrimos de nuevo nuestra primera página web con el editor de texto y escribimos al final:
<p style "color:red">Y esto es un tercer párrafo en rojo.</p>
Guardamos correctamente y tras abrir nuestro archivo desde el navegador, deberíamos ver algo así:
Esto es un párrafo en mi primera página web.
Y esto es otro párrafo.
Y esto es un tercer párrafo en rojo.
Bien, espero que estos ejemplos os hayan servido para aclararos un poco qué es una etiqueta, para qué sirve y cómo funciona. Para aprender a hacer una web sólo hace falta ver las diferentes etiquetas que existen, para qué sirven y qué atributos tienen cada una de ellas.
