Tutorial HTML

INICIO HTML Introducción HTML Editores HTML HTML básico Elementos HTML Atributos HTML Encabezados HTML Párrafos HTML Estilos HTML Formato HTML Cotizaciones HTML Comentarios HTML Colores HTML CSS HTML Enlaces HTML Imágenes HTML icono de favoritos HTML Tablas HTML Listas HTML Bloque HTML y en línea Clases HTML Identificación HTML Marcos flotantes HTML HTML JavaScript Rutas de archivo HTML Encabezado HTML Diseño HTML Responsivo HTML Código informático HTML Semántica HTML Guía de estilo HTML Entidades HTML Símbolos HTML Emoticonos HTML Juego de caracteres HTML Codificación de URL HTML HTML frente a XHTML

Formularios HTML

Formularios HTML Atributos de formulario HTML Elementos de formulario HTML Tipos de entrada HTML Atributos de entrada HTML Atributos de formulario de entrada HTML

Gráficos HTML

Lienzo HTML HTML SVG

Medios HTML

Medios HTML Vídeo HTML Audio HTML Complementos HTML HTML de YouTube

API de HTML

Geolocalización HTML Arrastrar/soltar HTML Almacenamiento web HTML Trabajadores web HTML SSE HTML

Ejemplos HTML

Ejemplos HTML Cuestionario HTML Ejercicios HTML Certificado HTML Resumen HTML Accesibilidad HTML

Referencias HTML

Lista de etiquetas HTML Atributos HTML Atributos globales HTML Compatibilidad con navegador HTML Eventos HTML Colores HTML Lienzo HTML Audio/vídeo HTML Tipos de documentos HTML Conjuntos de caracteres HTML Codificación de URL HTML Códigos de idioma HTML Mensajes HTTP Métodos HTTP Convertidor PX a EM Atajos de teclado

Rutas de archivo HTML


Una ruta de archivo describe la ubicación de un archivo en la estructura de carpetas de un sitio web.


Ejemplos de ruta de archivo

SenderoDescripción
<img src="imagen.jpg"> El archivo "imagen.jpg" se encuentra en la misma carpeta que la página actual
<img src="imágenes/imagen.jpg"> El archivo "imagen.jpg" se encuentra en la carpeta de imágenes en la carpeta actual
<img src="/imágenes/imagen.jpg"> El archivo "imagen.jpg" se encuentra en la carpeta de imágenes en la raíz de la web actual
<img src="../imagen.jpg"> El archivo "imagen.jpg" se encuentra en la carpeta un nivel por encima de la carpeta actual

Rutas de archivo HTML

Una ruta de archivo describe la ubicación de un archivo en la estructura de carpetas de un sitio web.

Las rutas de archivo se utilizan cuando se vincula a archivos externos, como:

  • páginas web
  • Imágenes
  • hojas de estilo
  • JavaScripts

Rutas de archivo absolutas

Una ruta de archivo absoluta es la URL completa de un archivo:

Ejemplo

<img src="https://www.w3schools.com/images/picture.jpg" alt="Mountain">

La etiqueta <img> se explica en el capítulo: Imágenes HTML .


Rutas de archivo relativas

Una ruta de archivo relativa apunta a un archivo relativo a la página actual.

En el siguiente ejemplo, la ruta del archivo apunta a un archivo en la carpeta de imágenes ubicada en la raíz de la web actual:

Ejemplo

<img src="/images/picture.jpg" alt="Mountain">

En el siguiente ejemplo, la ruta del archivo apunta a un archivo en la carpeta de imágenes ubicada en la carpeta actual:

Ejemplo

<img src="images/picture.jpg" alt="Mountain">

En el siguiente ejemplo, la ruta del archivo apunta a un archivo en la carpeta de imágenes ubicada en la carpeta un nivel por encima de la carpeta actual:

Ejemplo

<img src="../images/picture.jpg" alt="Mountain">


Mejores prácticas

Se recomienda utilizar rutas de archivo relativas (si es posible).

Al usar rutas de archivo relativas, sus páginas web no estarán vinculadas a su URL base actual. Todos los enlaces funcionarán en su propia computadora (localhost), así como en su dominio público actual y en sus futuros dominios públicos.