En este artículos vamos hablar sobre los enlaces o también llamados hipervínculos en un documento HTML, un enlace nos sirve para enlazar o direccionar a otros documentos HTML, o también para navegar dentro de nuestro Sitio Web.

Veamos los atributos comunes para los enlaces.

  • target=[ _self, _blank] : sirve para definir si queremos que un enlace cargue en la misma pagina o en otra ventana/pestaña.
  • title : sirve para mostrar un mensaje al poner el cursor sobre el enlace.

Veamos los tipos de enlaces.

  • Enlaces locales : nos sirve para navegar en cualquier parte de nuestro documento HTML, mediante el símbolo #, veamos un ejemplo.
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>

<h3><a href=”#parte”>Vamos a ir a una parte del documento</a></h3>

Al contrario del pensamiento popular, el texto de Lorem Ipsum no es simplemente texto aleatorio. Tiene sus raices en una pieza cl´sica de la literatura del Latin, que data del año 45 antes de Cristo, haciendo que este adquiera mas de 2000 años de antiguedad. Richard McClintock, un profesor de Latin de la Universidad de Hampden-Sydney en Virginia, encontró una de las palabras más oscuras de la lengua del latín, “consecteur”, en un pasaje de Lorem Ipsum, y al seguir leyendo distintos textos del latín, descubrió la fuente indudable. Lorem Ipsum viene de las secciones 1.10.32 y 1.10.33 de “de Finnibus Bonorum et Malorum” (Los Extremos del Bien y El Mal) por Cicero, escrito en el año 45 antes de Cristo. Este libro es un tratado de teoría de éticas, muy popular durante el Renacimiento. La primera linea del Lorem Ipsum, “Lorem ipsum dolor sit amet..”, viene de una linea en la sección 1.10.32

Al contrario del pensamiento popular, el texto de Lorem Ipsum no es simplemente texto aleatorio. Tiene sus raices en una pieza cl´sica de la literatura del Latin, que data del año 45 antes de Cristo, haciendo que este adquiera mas de 2000 años de antiguedad. Richard McClintock, un profesor de Latin de la Universidad de Hampden-Sydney en Virginia, encontró una de las palabras más oscuras de la lengua del latín, “consecteur”, en un pasaje de Lorem Ipsum, y al seguir leyendo distintos textos del latín, descubrió la fuente indudable. Lorem Ipsum viene de las secciones 1.10.32 y 1.10.33 de “de Finnibus Bonorum et Malorum” (Los Extremos del Bien y El Mal) por Cicero, escrito en el año 45 antes de Cristo. Este libro es un tratado de teoría de éticas, muy popular durante el Renacimiento. La primera linea del Lorem Ipsum, “Lorem ipsum dolor sit amet..”, viene de una linea en la sección 1.10.32

Al contrario del pensamiento popular, el texto de Lorem Ipsum no es simplemente texto aleatorio. Tiene sus raices en una pieza cl´sica de la literatura del Latin, que data del año 45 antes de Cristo, haciendo que este adquiera mas de 2000 años de antiguedad. Richard McClintock, un profesor de Latin de la Universidad de Hampden-Sydney en Virginia, encontró una de las palabras más oscuras de la lengua del latín, “consecteur”, en un pasaje de Lorem Ipsum, y al seguir leyendo distintos textos del latín, descubrió la fuente indudable. Lorem Ipsum viene de las secciones 1.10.32 y 1.10.33 de “de Finnibus Bonorum et Malorum” (Los Extremos del Bien y El Mal) por Cicero, escrito en el año 45 antes de Cristo. Este libro es un tratado de teoría de éticas, muy popular durante el Renacimiento. La primera linea del Lorem Ipsum, “Lorem ipsum dolor sit amet..”, viene de una linea en la sección 1.10.32

<h3>Aqui esta parte<a name=”parte”></a></h3>

<p>Al contrario del pensamiento popular, el texto de Lorem Ipsum no es simplemente texto aleatorio. Tiene sus raices en una pieza cl´sica de la literatura del Latin, que data del año 45 antes de Cristo, haciendo que este adquiera mas de 2000 años de antiguedad. Richard McClintock, un profesor de Latin de la Universidad de Hampden-Sydney en Virginia, encontró una de las palabras más oscuras de la lengua del latín, “consecteur”, en un pasaje de Lorem Ipsum, y al seguir leyendo distintos textos del latín, descubrió la fuente indudable. Lorem Ipsum viene de las secciones 1.10.32 y 1.10.33 de “de Finnibus Bonorum et Malorum” (Los Extremos del Bien y El Mal) por Cicero, escrito en el año 45 antes de Cristo. Este libro es un tratado de teoría de éticas, muy popular durante el Renacimiento. La primera linea del Lorem Ipsum, “Lorem ipsum dolor sit amet..”, viene de una linea en la sección 1.10.32</p>

</body>
</html>
  • Enlaces Externos : este tipo de enlaces nos sirve para enlazarnos o llevarnos a una pagina de diferente servidor con una ruta absoluta que empieza con el HTTP (es un protocolo de transferencia de hipertexto). Veamos un ejemplo.
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
Vamos a ir a la pagina de Peru.com haciendo click <a href="http://peru.com/">aqui</a>
</body>
</html>
  • Enlaces con dirección de correo : estos enlaces nos sirve para de frente abrir un correo cliente y con el campo de correo puesto, también asunto y hasta copia de correo. veamos un ejemplo. 
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
Enviar un correo a Erick, haciendo click <a href="mailto:erick@dominio.com">aquí</a>

<!-- esto es un comentario: si queremos enviar con asunto ponemos lo siguiente -->
Enviar un correo a Erick, haciendo click <a href="mailto:erick@dominio.com?subject=mi asunto">aquí</a>

<!-- si queremos enviar con copia de correo tambien ponemos los siguiente -->
Enviar un correo a Erick, haciendo click <a href="mailto:erick@dominio.com?subject=mi asunto&cc=otrocorreo@dominio.com">aquí</a>

</body>
</html>
  • Enlaces a archivos : son enlaces que apuntan a archivos de cualquier tipo, pueda ser un con extensión zip, rar, exe, pdf, docx y entre otros. Veamos un ejemplo, y tener en cuenta que algunos archivos se pueden visualizar en el navegador como los PDF, y formatos de audio y vídeo, ya los demás se descarga. 
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>

<h3>Listado de archivos para descargar</h3>
<ul>

<li><a href="archivo.rar">descargar un archivo rar</li>
<li><a href="archivo.zip">descargar un archivo zip</li>
<li><a href="archivo.exe">descargar un archivo exe</li>
<li><a href="archivo.pdf">descargar un archivo pdf</li>

</ul>
</body>
</html>

Así de simple es crear enlaces en nuestra Página web

nota