Rutas de Archivos HTML
Una "Ruta de Archivo" describe la ubicación de un archivo en la estructura de archivos de un sitio web. Y estas "Rutas de Archivos" son usadas cuando se apunta a un archivo externo (linking) como:
- Páginas Web
- Imagenes
- Hojas de Estilos
- JavaScripts
| Ruta (path) | Descripción |
|---|---|
| <img src="foto.jpg"> | La imagen "foto.jpg" esta ubicado en la carpeta actual desde donde se llama. |
| <img src="imagenes/foto.jpg"> | La imagen "foto.jpg" esta ubicada dentro de la carpeta "imagenes" desde donde se llama. |
| <img src="/imagenes/foto.jpg"> | La imagen "foto.jpg" esta ubicada en la carpeta "imagenes" que esta se encuentra en la raiz de la web. |
| <img src="../foto.jpg"> | La imagen "foto.jpg" esta ubicada en la carpeta anterior (un nivel anterior) desde donde se llama. |
Ruta de Archivos Absolutas
Una "Ruta de Archivo Absoluta" es una URL completa hacia un archivo en Internet:
<img src="http://www.exasoluciones.com/imagenes/foto.jpg" alt="Fotografia"></img>
Ruta de Archivos Relativas
Una "Ruta de Archivo Relativa" apunta a un archivo relativo desde la página actual, es decir, desde donde se esta llamando.
En el siguiente ejemplo la "Ruta del Archivo" apunta a un archivo ubicado en la carpeta "imagenes" que esta ubicada en la raiz del sitio web actual:
<img src="/imagenes/foto.jpg" alt="Fotografia"></img>
En el siguiente ejemplo la "Ruta del Archivo" apunta a un archivo ubicado en la carpeta "imagenes" que está ubicada en la carpeta actual:
<img src="imagenes/foto.jpg" alt="Fotografia"></img>
En el siguiente ejemplo, la "Ruta del Archivo" apunta a un archivo ubicado en la carpeta un nivel anterior de la carpeta actual.
<img src="../imagenes/foto.jpg" alt="Fotografia"></img>
Buenas Prácticas
Una buena practica es usar en la mayor medida posible las rutas relativas. Dado que cuando las usamos las páginas web no quedan ligadas a url actual en donde estas desarrollandolas (tu computadora) sino que tambien funcionarán en tu dominio público y en los futuros que consideres también.