Definición: Las etiquetas HTML son fragmentos de texto rodeados por corchetes angulares < >, que tienen funciones y usos específicos y se utilizan para escribir código HTML.

Las etiquetas o tags son la forma de escribir código HTML.

En HTML existen etiquetas de apertura y etiquetas de cierre, tienen la forma: <etiqueta> </etiqueta>. Donde <etiqueta> es la etiqueta de apertura y </etiqueta> es la etiqueta de cierre indicada por la diagonal. HTML tiene definidas gran variedad de etiquetas para distintos usos.

Aunque la mayoría de las etiquetas tienen su etiqueta de apertura y etiqueta de cierre, es importante aclarar que no todas las etiquetas tienen su correspondiente etiqueta de cierre.

Algunos ejemplos de etiquetas son:

Definición: HTML (HyperText Markup Language) es el lenguaje base que se utiliza para la creación de páginas web.

HTML es un lenguaje de marcado cuyo estándar lo define la W3C (World Wide Web Consortium) y actualmente HTML se encuentra en su versión HTML5.

¿Que significa HTML?

HTML significa "Lenguaje de Marcado de Hypertexto" por sus siglas en ingles "HyperText Markup Language".

Es un lenguaje que pertenece a la familia de los "lenguajes de marcado" y tiene la capacidad de enlazar documentos o páginas entre sí gracias al Hypertexto (mejor conocido como links o enlaces).

Este es el primer post del manual de HTML, trataremos conceptos básicos sobre la importancia del lenguaje HTML en Internet y la diferencia entre una página web y un sitio web, espero les sea de ayuda para aprender el lenguaje HTML.

Internet funciona con HTML

Sin duda alguna Internet es un gran invento, un invento que ha cambiado el estilo de vida de millones de personas alrededor de todo el mundo, un invento que ha revolucionado completamente la forma de comunicarnos, de hacer negocios, de aprender, de divertirnos, en fin la forma de interactuar con el mundo en general, es por eso que Internet es uno de los inventos mas importantes de los últimos tiempos.

Como todo gran invento, detrás de Internet hay un sin fin de tecnologías, en este manual nos centraremos a tratar una en particular llamada HTML, la tecnología que es base de cualquier sitio web.

Si alguien me preguntara de que esta hecha una página web mi respuesta sería: HTML.

Todas las páginas web utilizan HTML es por eso que cualquier persona interesada en la creación de páginas web debería comenzar por aprender el lenguaje HTML, es el primer paso para adentrarse a este interesante mundo.

La etiqueta <area> es un elemento que depende de la etiqueta <map>, con estas dos etiquetas podemos dividir una imagen en secciones o áreas y cada área puede ser un enlace o link.

Con la etiqueta <map> creamos un mapa de imagen y con la etiqueta <area> creamos las divisiones dentro del mapa de imagen.

Las divisiones creadas con la etiqueta <area> pueden tomar forma de figuras geométricas, esto se define a traves del atributo shape y para indicar su posición se utiliza el atributo coords.

El atributo shape puede tener 4 valores:

default: Toda la imagen.

rect: Rectángulo.

circle: Círculo.

poly: Polígono personalizado.

Los valores del atributo coords dependen del shape:

default: No aplica.

rect: Se indican la coordenadas de dos esquinas opuestas.

circle: Se indican la coordenadas del centro y el radio.

poly: Se indican n coordenadas, cada úna haciendo referencia a un vértice el polígono.

Ejemplo de uso:

La siguiente imagen está dividida en 3 áreas, un circulo, un cuadrado y un polígono, si intentas hace clic en las zonas blancas verás que no se puede, pero si das clic en alguna zona de color te enviará a otra página.

Ejemplo etiqueta area

<img src="/imagenes/etiqueta-area/figuras.jpg" usemap="#mapa">
<map name="mapa">
  <area href="/etiqueta-area-circulo.html" shape="circle" coords="50,50,40">
  <area href="/etiqueta-area-cuadrado.html" shape="rect" coords="110,10, 190,90">
  <area href="/etiqueta-area-poligono.html" shape="poly" coords="210,10, 250,10, 250,40, 280,10, 280,90, 240,90, 210,60">
</map>

La primer área (círculo) tiene las siguientes propiedades:

shape="circle" coords="50,50,40"

En el atributo coords los primeros dos números indícan las coordenadas del centro del cículo (x,y) (50,50), el número 40 es el tamaño del radio.

 

La segunda área (cuadrado) tiene las siguientes propiedades:

shape="rect" coords="110,10, 190,90"

En el atributo coords los primeros dos números indícan las coordenadas de la esquina superior izquierda (110,10) y los siguientes 2 (190,90) las coordenadas de la esquina inferior derecha.

 

La tercer área (polígono) tiene las siguientes propiedades:

shape="poly" coords="210,10, 250,10, 250,40, 280,10, 280,90, 240,90, 210,60"

Al igual que el cuadrado, cada par de número representa unas coordenadas, en este caso lass coordenadas de cada uno de los vértices de la figura (210,10) (250,10) (250,40) (280,10) (280,90) (240,90) (210,60)

 

Todas las coordenadas se indican en formato (x,y) es decir el primer número es la posición del eje x y el segúndo el eje y.