Error Image Visual code PNG (HTML)

[Bet05054]

Hola! Chicos,

alguno tuvo problemas con las imagenes, me manda error en la ruta para mi logo. ya intente de varias formas pero es al llegar a la imagen.

si lo dejo hasta img, me abre el link, pero ya con la imagen ya no. ya verifique la ruta pero me manda error.

Help !!!!!! =(

[OmarVenturaP]

Hola, a mi lo que me ha resultado fácil para evitar error en la escritura de la ruta es escribir dentro de src=" ./ " al escribir el ./ te abre una pestañita con los archivos disponibles en tu carpeta raíz, ya de allí solo vas dándole click a los archivos hasta llegar a tu imagen y listo. con eso no deberías de tener problemas

[Bet05054]

Gracias! asi lo hice pero cuando llega a la imagen ya no muestra nada =(, sera or el tamaño de la imagen?

[AlexisRamirezHernandez]

Hola @Bet05054 te recomiendo que lleves un orden en tus carpetas, crea una donde estes haciendo tu practica, dentro de ella puedes crear tu carpeta img y en ella poner tu imagen que es de tu interes y ya en el html solo especificar la ruta /img/tuimagen
Revisa tambien la extension, es decir si se trata de un archivo .png o .jpg

[OmarVenturaP]

no será porque lo tienes en ONEDRIVE? veo que tu carpeta raíz no es local.

[OmarVenturaP]

checa este tema que se analizo en la primer semana:
https://github.com/romarpla/FrontEnd-Mision/blob/main/01%20-%20INTRO/temario/5.-estructuraCodigo.md

[Bet05054]

Gracias, hare lo que me comentan =)

[JuanSalvador73]

Generalmente cuando construímos un sitio, lo primero es crear un folder donde en la raíz va el HTML, y en subcarpetas con sus respectivos nombres, las imágenes y los estilos CSS - aún por ver - es mas ordenado y limpio así.

Ya que tienes tus imágenes en su folder, en el HTML las llamas directamente a SU FOLDER, en este caso una ruta directa:

<div class="large-8 columns">
    <div class="twentytwenty-container">
      <img src="img/House_after.jpg" />
      <img src="img/House_before_01.jpg" />
    </div>
</div>

Ve que la liga de las imágenes se llaman directamente a la raíz, y ya, no hay necesidad de poner toda la ruta de tu máquina, ya que lo hace mas tedioso y susceptible de errores si mueves folders. Si cambias la carpeta del sitio en tu pc, no se altera el orden de los archivos adentro.

Espero te sirva, saludos.

[doguedogue]

No se coloca la ruta completa, se coloca la ruta relativa de dónde está tu archivo HTML a la imagen.

Si está en el mismo directorio empiezas con ./imagen.png

Si está en un directorio abajo usas ../ tantas veces como se encuentre abajo.

Esto está pensado a cuando lo subas a un hosting todo es relativo a su posición de directorios.

Fijate en los readme.md de GitHub en el como están construidos en modo RAW para que veas las rutas relativas de los links y recursos.

Espero te aclare tus dudas,

[Bet05054]

pues les platico el final =), si tenia mi carpeta en ONEdrive (ni se si sea por eso), por el usuario que comparto en la maquina perooo hice la ruta mas corta, y pues me leyo la imagen, gracias chicos.

[JuanSalvador73]

Que bueno que al final lo solucionaste, y recuerda siempre tener un folder propio para tus sitios. Suerte :D

[Bet05054]

Si, Gracias! =)