Cuando navegas por Internet, a menudo haces clic en enlaces sin pensarlo mucho. Estos enlaces te llevan a otras páginas web o a diferentes secciones dentro de un mismo documento. En este lección, aprenderás cómo crear enlaces en HTML para que puedas navegar entre páginas web o moverte a diferentes partes de un mismo documento.
Crear un enlace en HTML
Un enlace en HTML se define con la etiqueta <a> y un atributo especial llamado href, que indica la dirección del destino. Observa el siguiente ejemplo:
<a href="https://codica.la">Visitar Códica</a>
En este caso:
<a>abre el enlace.href="https://codica.la"define a dónde llevará el enlace."Visitar Códica"será el texto en el que los usuarios harán clic.</a>cierra la etiqueta.
Al hacer clic en ese enlace, el navegador te llevará al sitio web de Códica.
Tipos de enlaces
Existen diferentes tipos de enlaces según su propósito y la dirección que especifican:
Enlaces absolutos
- Se usan para enlazar a recursos externos (fuera de tu sitio web).
- La dirección incluye el protocolo (
https://).
Ejemplo:
<a href="https://codica.la/">Ir al sitio web de Códica</a>
Enlaces relativos
- Se usan para enlazar a recursos dentro del mismo sitio web.
- La dirección es relativa a la ubicación actual del documento.
Ejemplo:
<a href="/languages/html">Volver a la selección de lecciones</a>
Enlaces internos (anclas)
- Permiten moverse dentro del mismo documento, útil en textos largos.
- Se indica un
iden el destino, y el enlace usa#id_del_elemento.
Ejemplo:
<a href="#capitulo2">Ir al capítulo 2</a>
<!-- Más adelante en el documento -->
<h2 id="capitulo2">Capítulo 2</h2>
En este caso, al hacer clic en "Ir al capítulo 2", la página se desplazará automáticamente hasta donde se encuentra el encabezado del capítulo.
Resumen
- Los enlaces en HTML se crean con la etiqueta
<a>y el atributohref. - Los enlaces absolutos apuntan a sitios externos e incluyen el protocolo (
https://). - Los enlaces relativos apuntan a páginas dentro del mismo sitio.
- Los enlaces internos o de anclaje permiten moverse dentro de un mismo documento usando identificadores (
id). - Un enlace puede contener texto o incluso imágenes, lo que permite múltiples usos en la navegación web.
