Enlaces en HTML

La propiedad más importante de Internet, es la posibilidad de conectarse los unos con los otros.

http://www.comocreartuweb.com/ejemplo-con-divs/la-plantilla/estilos-para-enlaces.html

Los Enlaces o Links

Los enlaces o links(en Inglés) nos permiten conectarnos con otros documentos:

una imagen
un video
un archivo de sonido
sitios en la web(otra página web)
mandar un email

Para ello debemos usar la etiqueta <a> que proviene de la primera letra de la palabra anchor(ancla).

La etiqueta <a> tiene como cierre </a>.

Sintaxis

<a atributo="valor">Texto del enlace</a>

Ejemplo
Vamos a crear un enlace hacia la home de Virtualnauta.com
Código <body> <a href="/http://www.virtualnauta.com/">La home de Virtualnauta</a> </body>
Resultado La home de Virtualnauta

EL atributo target

Se utiliza para definir donde queremos que se abra el documento al presionar sobre el enlace.

Ejemplo
Vamos a abrir el documento en una nueva página del navegador.
Código <body> <a href="http://www.vitualnauta.com/" target="_blank">La home de Virtualnauta</a> </body>
Resultado La home de Virtualnauta http://es.tldp.org/Manuales-LuCAS/doc-curso-html/doc-curso-html.pdf

EL atributo name

Este atributo se usa para definir una determinada ubicación dentro de la página.
Supongamos que definimos un destino de vínculo llamado "destino-uno" en el archivo "uno.html".

Sintaxis

...texto antes del destino de vínculo...
<a name="destino-uno">Capítulo 1</a> 
...texto después del destino de vínculo...

Y en otra parte de la página, del mismo sitio o de otro sitio, creamos un enlace a Capítulo 1. Para ello utilizamos el signo # seguido del nombre del enlace.

<a href="http://www.misitio.com/uno.html#destino-uno">Ir al Capítulo 1</a>

O en caso que el enlace esté definido en el mismo documento:

<a href="/#destino-uno">Ir al Capítulo 1</a>

Creando un enlace a un email

Se utiliza en caso que queramos que un enlace mande un email.
En el momento que presionamos dicho link se abrirá automaticamente el programa de email que tenemos definido por defecto.

Ejemplo
Código <body> <a href="/mailto: alguien@gmail.com">Mandar email</a> </body>
Resultado Mandar email

mailto: nos indica la dirección email a la que va dirigida, en este ejemplo: alguien@gmail.com.

Un enlace a partir de una imagen

Muchas veces queremos usar una imagen como enlace a otro documento. Para ello debemos colocar la etiqueta <img> entre las etiquetas <a> y </a> en lugar del texto.

Ejemplo
Código <body> <a href="http://www.google.com/"><img src="/../graficos/google.gif"></a> </body>
Resultado

Etiquetas y atributos de los enlaces

Etiquetas	Atributos	Valor	Descripción
<a>			Define un vínculo
	href	URL	Dirección URL a conectar.
	hreflang	código de lenguaje	Especifica el lenguaje de la URL.
	name	nombre de sección	Para crear un marcapáginas dentro de un documento.
	rel	alternate	Especifica la relación entre el documento actual y el destino del vínculo.
		designates
		stylesheet
		start
		next
		prev
		contents
		index
		glossary
		copyright
		chapter
		section
		subsection
		apendix
		help
		bookmark
		nofollow
	rev	alternate	Especifica la relación entre el destino del vínculo y el documento actual(vínculo inverso).
		designates
		stylesheet
		start
		next
		prev
		contents
		index
		glossary
		copyright
		chapter
		section
		subsection
		apendix
		help
		bookmark
	coords	coordenadas	Especifica las coordenadas de la superficie que contiene el enlace.
	shape		Define la forma del área.
		rect	Usamos coords="izquierda, arriba, derecha, abajo"
		rectangle	Usamos coords="izquierda, arriba, derecha, abajo"
		circ	Usamos coords="centro x, centro y, radio"
		circle	Usamos coords="centro x, centro y, radio"
		poly	Usamos coords="x1, y1, x2, y2, .., xn, yn"
		polygon	Usamos coords="x1, y1, x2, y2, .., xn, yn"
	target		Indica donde abrir el URL.
		_blank	El URL se abrirá en una nueva ventana.
		_parent	El URL se abrirá en el frameset padre.
		_self	El URL se abrirá en el mismo frame donde fue apretado.
		_top	El URL se abriró en una ventana de tamaño completo.
	type	tipo de contenido	Especifica el tipo de contenido a conectar.

Atributos estándard

id, class, title, style, dir, lang, tabindex, accesskey

Si desea una descripción completa, diríjase a: atributos estándard.

Eventos intrínsecos

onfocus, onblur, onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup

Si desea una descripción completa, diríjase a: eventos intrínsecos .

http://www.virtualnauta.com/html-enlaces

Caracteres especiales

Muchas veces necesitamos incluir en nuestros textos, signos que tienen un significado especial en HTML
(por ej. "<" - menor que).
Para poder mostrarlos, debemos usar su nombre en código.

Los nombres de las entidades están compuestos por el signo(&), luego el nombre de la entidad y al final (";" - punto y coma).
Los números de estos caracteres están compuestos por (&), luego (# - numeral), el número de la entidad y al final (";" - punto y coma).

Por ejemplo para mostrar el signo "<" debemos escribir < o <.

El uso más común de los caracteres especiales es el espacio en blanco. Si en un texto figuran 5 espacios en blanco seguidos, HTML automaticamente borra 4.
Para ingresar espacios en blanco usamos " " y HTML los dejará en su lugar.

Otro uso muy frecuente es el de insertar acentos en el código html por medio de los números de las entidades

Caracteres especiales de uso frecuente