Entendido.

Este sitio utiliza cookies para analizar la navegación. Si continúa navegando se entiende que acepta su uso. Ver más detalles.";

Logo

Aprende Web

Crea y diseña tus sitios en la Web.

Manual de HTML

HTML: lenguaje básico para crear páginas web


Y ahora tambien aprende a programar en C++ con Aprende Web C++

logo rss RSS. Suscribir canal.

Buscar en Aprende Web

Traducir página

Visita nuestro blog:

bolg.aprende-web.net

y entérate de las novedades o deja un comentario.

Dudas y sugerencias:

aprendeweb@aprende-web.net





Sobre ésta página

Ültima modificación: 29-01-2016.

Visitas este mes: 975

Visitas el mes pasado: 1155

logo
WEB-GRAFÍA

Mi agradecimiento a los siguientes sitios en los que me he basado para la elaboración de este manual.:

Desarrollo Web: manual de HTML
Desarrollo Web, por Rubén Álvarez
Cómo crear tu Web: curso de HTML
ComoCrearTuWeb, Por Georgens
Libros Web: introducción a XHTML
Libros web, por Javier Eguíluz Pérez
Curso de HTML: AulaFácil
www.aulafacil.com
Curso de html: Programación Web
www.programacionweb.net
WebEstilo: manual de html
www.webestilo.com
W3 schools; HTML Tutorial
www.w3schools.com
Tutorial html
Juan José López García
Universidad de Murcia
Introducción al lenguaje html
wikilearning

Donativos

Si este sitio te parece interesante puedes contribuir con una pequeña aportación.




3. Enlaces (II)

3.2 Enlaces locales.

html

Sintaxis los enlaces locales.

Los enlaces locales son aquellos que nos llevan a otra página del mismo sitio web que estamos visualizando.

Los enlaces locales tienen la misma sintaxis que los enlaces externos, lo unico que cambia es el valor del atributo href que en lugar de indicarnos una URL o dirección web, debe indicarnos la ruta o camino que debemos seguir para encontrar ese archivo.

La sintaxis de los enlaces locales es la siguiente

<a href="ruta">Texto_del_enlace</a>

Al estar el archivo de partida y el de destino en el mismo sitio Web, no hace falta escribir el protocolo ni el servidor. Basta con escribir la ruta. Esta ruta la podemos escribir de forma absoluta o relativa.


URL relativas:

Las rutas y URLs que hemos visto en los enlaces externos son absolutas. Una URL absoluta indica todas las partes de la URL (protocolo, servidor y ruta completa). La URL relativa tiene en cuenta la ubicación de la página de origen, y prescinde de todas las partes de la URL absoluta que coinciden con la URL del archivo o página de origen.

Es por esto por lo que en los enlaces locales no necesitamos escribir ni el protocolo ni el servidor. Además sólo debemos indicar el camino (carpetas de distancia y nombre de ellas) que hay entre el origen y el destino. Esto es mucho más simple que escribir la URL completa para cada enlace interno (lo cual también funcionaría).

En los enlaces locales los dos archivos están dentro del mismo sitio Web, por tanto dentro de la misma carpeta raíz. En el camino entre el de origen y el de destino se pueden dar varios casos que veremos a continuación.


Los dos archivos están en la misma carpeta

Este es el caso más fácil, ya que al compartir carpeta, la ruta es simplemente el nombre del archivo de destino (en todos los casos debemos escribir el nombre del archivo con su extensión). Ejemplo:

<a href="intro.html">Ver la introducción</a>

Este enlace, escrito en esta misma página que estás leyendo, nos lleva a la introducción del curso HTML, ya que los dos archivos (el de esta página y el de destino) están en la misma carpeta. Su aspecto es el siguiente:

Ver la introducción


El archivo de destino está en una carpeta de nivel inferior al de origen

En este caso deberemos escribir la ruta a partir de la carpeta donde está el archivo de origen. para ello escribiremos el nombre de cada carpeta que bajamos seguido de una barra inclinada ( / ) hasta llegar a la carpeta donde está el archivo, y después escribimos el nombre del archivo (con su extensión). ejemplo:

<a href="ejemplos/ejemplo5.html">Ver ejemplo 5</a>

En la misma carpeta en la que está esta página (la que ahora leemos), hay una carpeta llamada ejemplos, y dentro de esa carpeta está el archivo ejemplo5.html que es el que abriremos con el enlace. El ejemplo anterior queda así:

Ver Ejemplo 5

Si hay que bajar varias subcarpetas para llegar hasta el archivo debemos escribir todas ellas en la ruta, seguidas cada una por una barra inclinada. Un ejemplo de ruta sería:

href="nivel2/sección4/apartado1/página5.html"

En este caso la página de origen está en la misma carpeta que contiene la subcarpeta nivel2, la cual contiene otras subcarpetas en las que se va descendiendo el nivel hasta llegar al archivo que queremos enlazar.


El archivo de destino está en una carpeta de nivel superior al de origen

En este caso debemos indicar que es necesario subir uno o varios niveles en la jerarquía de directorios, hasta llegar al nivel donde está el archivo.

Para indicar que subimos un nivel incluiremos al principio de la ruta dos puntos y una barra (../); si subimos dos niveles, tendremos que incluirlo dos veces (../../) y así hasta llegar al nivel donde esté el archivo. Una vez hallamos llegado a ese nivel escribimos el nombre del archivo. Ejemplo:

<a href="../index.html">Página principal</a>

Este enlace sube un nivel en el directorio, que es donde está la página principal de este sitio Web, para poder enlazarla.

Página principal


El archivo de destino está en un directorio alejado al de origen

En todo caso, como todo sitio web tiene una carpeta raíz desde la que parten todas las subcarpètas, siempre podremos subir en el directorio hasta una carpeta común, desde la cual parten otras subcarpetas que nos llevan a la página indicada. indicaremos que subimos en el directorio mediante ../ hasta ese directorio común, para luego indicar las carpetas que hay que bajar escribiendo su nombre seguido de la barra inclinada, y escribir por último el nombre del archivo. Ejemplo:

<a href="../comple/programas/programas1.html">Navegadores</a>

En este ejemplo subimos un nivel, y alli encontramos la carpeta comple, En esta carpeta encontramos la carpeta programas y dentro de esta última carpeta está el archivo programas1.html con el que queremos enlazar.

Navegadores


Rutas absolutas

En los enlaces locales, es posible también escribir la ruta absoluta en el valor del atributo href, sin necesidad de escribir el protocolo y el servidor, para ello delante de la ruta escribiremos una barra inclinada. Así el enlace anterior lo podemos escribir también:

<a href="/comple/programas/programas1.html">Navegadores</a>

Del mismo modo si en un enlace escribimos simplemente una barra inclinada como ruta, este nos llevará a la página principal del sitio:

<a href="/">Página principal</a>

El problema de la ruta absoluta es que el diseñador no puede comprobar si el enlace está bien hasta que haya subido la página al servidor, ya que mientras tenga la página en su ordenador (en la carpeta local), la ruta indicada no es la misma, ya que la carpeta raiz en cualquier ordenador (con S.O. windows) es el escritorio, y no la carpeta donde tiene ubicado el sitio.

Sin embargo al usar rutas relativas siempre se puede comprobar si los enlaces funcionan antes de subir la página al servidor, ya que los nombres de archivos y ubicaciones de carpetas coinciden en ambos sitios.


Otras aplicaciones de las rutas relativas

El mismo método que hemos empleado para enlazar dos archivos ubicados en el mismo sitio, lo emplearemos para otro tipo de recursos en los que es necesario desde una página llamar a otro archivo.

Usaremos este método para incluir el código CSS en un archivo aparte, el cual llamamos desde la etiqueta <link> que se incluye en la cabecera. Los archivos de imagen que se incluyen en las páginas, los archivos de video, de sonido, archivos de javascript, y en general toda clase de archivos, siguen el mismo sistema para especificar la ruta cuando queremos incluirlos o hacer referencia a ellos en la página. Aunque seguiremos viendo esto en lecciones posteriores, la ruta para llamar a cualquier archivo interno sigue las mismas normas que aquí hemos visto.




En el la siguiente página veremos los enlaces internos que se dan dentro de una misma página.

Enlaces internos.



manual de HTML

Anterior siguiente ... Siguiente siguiente


imprimir esta página

Página creada por ANYELGUTI.

Sugerencias: aprendeweb@aprende-web.net. Envia un manda un correo

Visita nuestro blog par saber en qué estamos trabajando: Aprende Web Blog

Más sobre anyelguti en http://anyelguti.16mb.com