logo 3con14 html cod
html5
  • HTML
  • Introducción
  • Elementos
  • Textos
  • Enlaces
  • Listas
  • Imágenes
  • Tablas
  • Formularios
  • TAREAS
 
 
icon html5
icon css3
mlogo 3con14 html cod

  • Inicio
  • Enlaces
  • Enlaces internos

Enlaces internos

Como hemos visto, además de enlaces internos o externos, otra característica que diferencia a los enlaces es si el enlace es absoluto o relativo.

  • Las URL absolutas incluyen todas las partes de la URL (protocolo, servidor (dominio), ruta y página) por lo que no se necesita más información para llegar al lugar enlazado.
  • En los enlaces internos relativos sólo es necesario escribir la ruta y la página a la que apunta el enlace, omitiendose todo lo demás.

url

Ejemplo 1:
 

arbol

Cuando bajamos una carpeta respecto al origen debemos escribir dos puntos y barra ../ tantas veces como carpetas bajamos
En los servidores de internet, el texto correspondiente al dominio puede sustituirse simplemente por la barra inclinada /

Por ejemplo, un enlace en el archivo pagina_1a_01.html que apunte a index.html sería así:

<a href="/../../../index.html">Ir al índice raíz></a>

Por ejemplo, un enlace en el archivo pagina_1a.html que apunte a pagina_1b.html sería así:

<a href="/../carpeta_1b/pagina_1b.html">Ir al índice raíz></a>

Por ejemplo, un enlace en el archivo pagina_1a.html que apunte a pagina_2.html sería así:

<a href="/../../carpeta_2/pagina_2.html">Ir al índice raíz></a>

Observa las secuencias ../ para subir de niveles

Un ejemplo de enlace absoluto es cuando aparece primero el protocolo http:// y luego el dominio, mientras que un enlace relativo NO comienza así sino directamente por la ruta de un determinado directorio, esto lo observamos porque el enlace empieza con barra inclinada / o directamente el nombre del recurso, como en el ejemplo anterior.

Las URL relativas prescinden de algunas partes de las URL para hacerlas más breves.

Hay que indicar que crear enlaces absolutos (escribiendo la dirección completa) también funcionará, pero tiene el enorme inconveniente de que si necesitamos trasladar nuestro sitio o otro servidor nos veremos obligados a cambiar todos y cada uno los enlaces que aparezcan en todas las páginas de nuestro website, labor sumamente tediosa.

Describir el enlace

Para añadir una breve descripción a un enlace utilizamos el atributo title.

Abrir enlace en nueva ventana

Otro atributo frecuentemente utilizado es el destino en enlaces externos, llamado target con el valor _blank (abrir en nueva ventana), al utilizarlo nos aseguramos que no se pierde la página de nuestro sitio web. Hoy en dia, los navegadores modernos abren una nueva solapa y no una ventana nueva.

Ejemplo 2:
 

enlaces1

  • Anterior
  • Siguiente

Enlaces

  • Tipos de enlaces
  • Enlaces internos
  • Enlaces de posición

Recursos

  • Visual Studio code
  • Sublime Text
  • Prepros

codepen

uniwebsidad

overapi

w3schools

mdn

Teoría ...

🟢 Guías

🟢 Guías

  • LibrosWeb HTML
  • HTML CheatSheet
  • Vocabulario HTML
  • Guía HTML5 y HTML
  • Chuleta HTML5
  • OverApi
  • Emmet
🟢 Tarjetas

🟢 Tarjetas

  • HTML5 (Veign)
  • XHTML (Schmitz)
  • CSS3 (Veign)
  • CSS3 (GoSquared)
  • CSS2 (Veign)
  • CSS (GoSquared)
  • CSS (Pxleyes)
  • Color (Veign)
  • Color

Licencias ...

3con14─LAB 1998 - 2021
www.3con14.biz
(cc) Jesús Plaza M.
─ Otros Reconocimientos ─

Visitas ...

Hoy ... 10

Ayer ... 18

Week 66

Mes ... 250

TOTAL ... 91943

  • HTML
  • Introducción
  • Elementos
  • Textos
  • Enlaces
  • Listas
  • Imágenes
  • Tablas
  • Formularios
  • TAREAS