1. Etiquetas para Enlaces

Esta etiqueta se utiliza para crear los llamados enlaces, hipervínculos o link. Lo más importante de los documentos HTML son los enlaces. Ya que mediante los enlaces en HTML podemos comunicar una página con otra, un documento ó ubicación dentro de la misma pagina.

Aprender a colocar enlaces en HTML a nuestras páginas web, es una tarea muy fácil y a la vez muy útil para mejorar el uso de la pagina, tiene la función de dirigir a los usuarios a otras direcciones URL, además de ello conoceremos los atributos que corresponden a enlaces HTML.

Para definir enlaces o hipervínculos utilizaremos la siguiente etiqueta:

Etiqueta	Descripción	Tipo
<a>	crea un enlace a otras páginas de internet, archivos o ubicaciones.	linea

Ejemplo de un enlace:

<a href="destino1">Link1</a>
<a href="destino2">Link2</a>
<a href="destino3">Link3</a>

Esta etiqueta debe tener, como mínimo, el atributo href, ya que es el atributo con el que se especifica la dirección URL al documento que se quiere enlazar.

2. Atributos para enlaces HTML

Existen varios atributos para los enlaces, en esta Guia de aprendizaje los desarrollamos detalladamente cada uno de ellos, pero a continuación veamos un resumen de todos ellos:

Atributo	Valor	Descripción
href	URL	Contiene una URL o un fragmento de URL al cual apunta el enlace
target	_blank	Carga la URL en una nueva pestaña del navegador
rel	sponsored, ugc, nofollow	Sirve para indicar la relación que existe entre la pagina del cual sale el enlace y la pagina que recibe el enlace

Existen muchos más, pero estos son los principales. Ahora vemos como se usan en un ejemplo de cada uno de ellos.

Ejemplo de enlaces con sus atributos:

<!--href esta enlazando esta pagina con Google --> 
<a href="https://www.google.com/">Link1</a> 
<!--href esta enlazada con ADSI  --> 
<!--target _blank abrira a ADSI en una nueva pestaña  --> 
<a href="https://eliseovega.github.io/" target="_blank" >ADSI 2020</a>
<!--Enlace externo a sitios que tratan temas muy diferentes a los nuestros  --> 
<a href="https://www.visa.com.co/" rel="nofollow" >Visa</a>

3. Tipos de Enlaces

Para estudiar en profundidad los enlaces tenemos que clasificarlos por su tipo, porque dependiendo ese tipo algunas cosas cambiarán a la hora de construirlos.

Tipo	Descripción
Enlaces internos	los que se dirigen a otras partes dentro de la misma página.
Enlaces locales	los que se dirigen a otras páginas del mismo sitio web.
Enlaces Externos	los que se dirigen hacia páginas de otros sitios web.
Enlaces con archivos	para que los usuarios puedan hacer descarga de archivo.
Enlaces con email	para crear un mensaje de correo dirigido a una dirección de correo.

Ejemplo de los tipos de enlace:

<!--Enlace que apunte a la section1 de esta misma pagina --> 
<a href="#section1"  >Interno</a> 
<!--Enlace local desde esta pagina hacia etiquetas_texto.html pagina local de nuestro sitio--> 
<a href="etiquetas_texto.html" target="_blank" >Local</a>
<!--Enlace externo a otros sitio, apunta a Google  --> 
<a href="https://www.google.com/" target="_blank" >Externo</a>
<!--Enlace para que el usuario descargue un archivo--> 
<a href="proyecto_1.rar" target="_blank" >Archivos</a>
<!--Enlazar un correo colocamos mailto: en el atributo href del enlace, seguido el correo--> 
<a href="mailto:actividades.clasroom@google.com">Email</a>

Ejemplo Practico: Un Articulo con enlaces

Utilizaremos el ejemplo de etiquetas de texto y le añadimremos los enlaces:

Analisis y Desarrollo de Sistemas de Información

Perfil del aprendiz

Un Analista de Sistemas es responsable del estudio de los problemas y las necesidades presentes en la organización para determinar en qué medida pueden las aplicaciones de software, los servicios tecnologicos web y bases de datos, las redes, las personas y los procedimientos actuar conjuntamente para resolver los problemas del modo más adecuado y mejorar los sistemas de la empresa y de información .

      
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>adsi</title>
</head>
<body>
                           
<h1>Analisis y Desarrollo de Sistemas de Información<h1>
<!--Enlace que apunte a la section1 de esta misma pagina --> 
<a href="#section1"  >Interno</a> 
<!--Enlace local desde esta pagina hacia etiquetas_texto.html pagina local de nuestro sitio--> 
<a href="etiquetas_texto.html" target="_blank" >Local</a>
<!--Enlace externo a otros sitio, apunta a Google  --> 
<a href="https://www.google.com/" target="_blank" >Externo</a>
<!--Enlazar un correo colocamos mailto: en el atributo href del enlace, seguido el correo--> 
<a href="mailto:actividades.clasroom@google.com">Email</a>
<hr>
<h2>Perfil del aprendiz</h2>
<p>
   Un <b>Analista de Sistemas<b> es responsable del <strong>estudio de los problemas<strong> y las necesidades presentes en la <em>organización<em> para determinar en qué medida pueden las <i>aplicaciones de software<i>, los servicios tecnologicos web
   y bases de datos, las <small>redes<small>, las  <big>personas<big>  y los procedimientos actuar conjuntamente para resolver los problemas del modo más adecuado y <mark>mejorar los sistemas de la empresa y de información<mark> .
<p>
                           
</body>
</html>

Actividad #5. HTML5: ETIQUETAS PARA ENLACES

Actividad para el desarrollo de habilidades el el uso del lenguaje HTML5 para crear paginas estaticas.

Te ha resultado util esta guia de aprendizaje ?

Que tal el contenido?