rutas en html
DESCRIPTION
Rutas en HTMLTRANSCRIPT
![Page 1: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/1.jpg)
RUTAS EN HTMLDamián Huerta GarcíaFebrero de 2008
![Page 2: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/2.jpg)
Cada vez que insertamos en una de nuestras páginas un elemento externo a ellas (una imagen, un sonido, un enlace...) tenemos que definir claramente dónde se encuentra (Ubicación o ruta) este, para que el navegador pueda encontrarlo e insertarlo.Ruta: es la ubicación física del recurso a insertar, ejemplo:F:/tareas/html/mi_fondo.gif
¿Que son las rutas?
![Page 3: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/3.jpg)
¿Por que son importantes las rutas? Las rutas son una de las causas más
frecuentes de errores para las personas que comienzan a crear páginas web. Por ello es importante saber manipular las rutas relativas y absolutas para que en la publicación del sitio no existan problemas.
![Page 4: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/4.jpg)
Tipo de rutas
![Page 5: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/5.jpg)
Rutas Absolutas. Las rutas absolutas son el camino que ha de
seguir el navegador para encontrar el archivo, definidas desde el principio, como por ejemplo:
En el dispositivo de almancenamiento: D: :\Conalep\6to semestre\paginas web\
EJEMPLOS En la publicación del sitio:
http://www.midominio.com/carpeta/archivo.ext D
![Page 6: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/6.jpg)
¿ Porque no usarlas? Si guardamos en nuestro disco duro al
quemarlas en cd o pasarlas a usb la unidad cambia de c: a d: o f.
Al publicar el sitio en internet, en nuestro servidor también cambia la ubicación de los recursos.
![Page 7: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/7.jpg)
Rutas Relativas. Las rutas relativas son el camino a
seguir DESDE la página HASTA el archivo. En este caso no hay que escribir http://www.midominio...., sino solo indicar los pasos que hay que dar para llegar desde la página en cuestión, hasta el archivo correspondiente.
![Page 8: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/8.jpg)
La pagina y la imagen en la misma carpeta
![Page 9: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/9.jpg)
Imagen dentro de carpeta
![Page 10: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/10.jpg)
Pagina en carpeta e imagen en otra
![Page 11: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/11.jpg)
Ejemplo con dominios ruta absoluta
Supongamos que queremos insertar la foto del perro en la página index.html. La ruta absoluta de esa foto, es la misma siempre, sea cual sea la página donde vayamos a insertarla, es decir:
http://www.comocreartuweb.com/imagenes/mi-perro-newton.gif
![Page 12: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/12.jpg)
Ejemplo con dominios de Ruta Relativa
En cambio, la ruta relativa de la foto, con respecto a index.html sería esta otra: imagenes/mi-perro-newton.gif¿Por qué? Porque para ir desde index.html hasta la foto, hemos de entrar primero en la carpeta imagenes y dentro de ésta, buscar la imagen mi-perro-newton.gif.
![Page 13: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/13.jpg)
hay tambien una carpeta llamada historias, y que dentro de ésta hay una página llamada historias-de-mi-perro.html. Si quisieramos insertar la imagen mi-perro-newton-gif en ella, la ruta absoluta sería la misma que antes (recuerda que las rutas absolutas no dependen de la página donde se vaya a insertar el elemento), pero la ruta relativa ahora es esta otra:
../imagenes/mi-perro-newton.gif
![Page 14: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/14.jpg)
Conclusión Las rutas absolutas siempre son las
mismas, sin importar donde insertemos los recursos.
Las relativas cambian de acuerdo a donde las queremos insertar y se utilizan lo siguiente: Los dos puntos y la barra ( ../ ) significan un
paso atrás, es decir, salir de una carpeta. La diagonal indica entrar a la carpeta
/carpeta
![Page 15: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/15.jpg)
Ubicación de los recursos
Una carpeta para códigos Una carpeta para imágenes Una carpeta para música Y una carpeta para videos La página de inicio se llamara index.html
![Page 16: Rutas en HTML](https://reader034.vdocumento.com/reader034/viewer/2022051500/568c50c01a28ab4916afd54c/html5/thumbnails/16.jpg)
Bibliografía de apoyo http://www.comocreartuweb.com/
herramientas-utiles/enciclopedia-r-rutas.html