El principal problema relacionat amb l'addició d'imatges d'HTML des de fonts remotes és que pot provocar un lent temps de càrrega de la pàgina. Això es deu al fet que el navegador ha de fer una sol·licitud independent per a cada imatge, que es pot afegir ràpidament si hi ha diverses imatges a la pàgina. A més, si la font remota està baixa o té una connexió lenta, això pot retardar encara més els temps de càrrega de la pàgina. Finalment, també hi ha un major risc de vulnerabilitats de seguretat, ja que les imatges s'extreuen d'una font externa.
<img src="https://example.com/image.jpg" alt="Example Image">
1. Aquesta línia de codi és una etiqueta d'imatge HTML, que s'utilitza per mostrar una imatge en una pàgina web.
2. L'atribut “src” especifica l'URL de la imatge que es mostrarà, en aquest cas és “https://example.com/imatge.jpg”.
3. L'atribut "alt" proporciona text alternatiu per a la imatge, en aquest cas és "Imatge d'exemple".
atribut img src
L'atribut img src en HTML s'utilitza per especificar la font d'una imatge. S'utilitza dins del etiqueta per definir l'origen d'una imatge. El valor d'aquest atribut ha de ser un URL vàlid que apunti a un fitxer d'imatge. Aquest atribut és necessari per a totes les imatges d'una pàgina web i permet al navegador localitzar i mostrar la imatge.
Com puc afegir una imatge externa en HTML
Afegir una imatge externa en HTML és bastant senzill. Tot el que heu de fer és utilitzar el etiqueta i especifiqueu l'origen de la imatge mitjançant l'atribut src. La sintaxi per afegir una imatge externa en HTML és així:
On "image_url" és un enllaç al fitxer d'imatge i "text alternatiu" és una descripció del que hi ha a la imatge (per a finalitats d'accessibilitat).
Per exemple, si volguéssiu afegir una imatge externa del vostre lloc web anomenada my-image.jpg, el vostre codi es veuria així:
