Saltar al contenido principal

Ejercicio práctico 18: Enlaces Absolutos y Relativos

Descubre la diferencia entre enlaces absolutos y relativos en HTML con este ejercicio práctico. Aprende cuándo y cómo usar cada tipo de enlace para construir sitios web bien estructurados y fáciles de navegar.

Actividad​

Crea un documento HTML que contenga enlaces absolutos y relativos. Para este ejercicio vas a necesitar crear dos archivos HTML diferentes. Puedes nombrarlos como index.html y page.html.

Solución interactiva​

Solución con el código HTML completo​

Crea un archivo index.html con el siguiente código.

index.html
<!DOCTYPE html>
<html lang="es">
  <head>
    <meta charset="UTF-8" />
    <title>Enlaces Absolutos y Relativos</title>
  </head>
  <body>
    <h1>Enlace Absoluto</h1>
    <a href="https://div.zone" target="_blank">Ir a DivZone</a>

    <h2>Enlace Relativo</h2>
    <a href="page.html">Ir a Página Interna</a>
  </body>
</html>

Dentro de la misma carpeta, crea otro archivo llamado page.html para utilizar como página interna.

page.html
<!DOCTYPE html>
<html lang="es">
  <head>
    <meta charset="UTF-8" />
    <title>Enlaces Absolutos y Relativos - Página interna</title>
  </head>
  <body>
    <h1>Mi página interna de ejemplo.</h1>
  </body>
</html>