Vuoi inserire un’immagine in una pagina scritta in html ma non sai come fare??? Non ti preoccupare, ci siamo noi! In questa guida ti faremo vedere come inserire un’immagine in un file html!
L’aggiunta di immagini su un sito web o un profilo, è un ottimo modo per abbellire la tua pagina. Il codice HTML per aggiungere immagini è semplice e spesso una delle prime lezioni di informatica per un principiante HTML.
Inserimento dell’immagine IN HTML
Carica la tua immagine
Esistono molti servizi gratuiti di hosting di immagini, come Picasa, Imgur, Flickr o Photobucket.
Alcuni servizi ridurranno la qualità dell’immagine o elimineranno l’immagine se troppa gente la visualizza (poiché utilizza la larghezza di banda dell’host).
Alcuni servizi di hosting di blog ti consentono di caricare immagini utilizzando gli strumenti di amministrazione del blog.
Se disponi di un host web a pagamento, carica l’immagine sul tuo sito utilizzando un servizio FTP. Si consiglia di creare una directory “images” per mantenere organizzati i file.
Se si desidera utilizzare un’immagine su un altro sito Web, chiedere al creatore il permesso.
Apri il tuo file HTML
Se stai cercando di inserire un’immagine su un forum, puoi digitare l’url direttamente nel post. Molti forum utilizzano un sistema personalizzato anziché HTML. Chiedi aiuto ad altri utenti del forum se questo non funziona.
Inizia con il tag img
Trova il punto nel tuo file HTML in cui desideri inserire un’immagine e scrivi il tag <img>. Questo è un tag vuoto, senza tag di chiusura. Tutto ciò che ti serve per mostrare la tua immagine andrà inserito tra le parentesi.
Trova l’URL della tua immagine
Visita la pagina web in cui è ospitata la tua immagine. Fare clic con il tasto destro del mouse sull’immagine (control-clic su Mac) e selezionare “Copia posizione immagine”. Puoi anche fare clic su “Visualizza immagine” per visualizzare l’immagine da sola su una pagina, quindi copiare l’URL nella barra degli indirizzi.
Se hai caricato l’immagine in una directory di immagini nel tuo sito web, collegalo a / images / yourfilenamehere. Se questo non funziona, la directory delle immagini è probabilmente all’interno di un’altra cartella. Spostalo nella directory principale.
Inserisci l’URL in un attributo src.
Come forse già saprai, gli attributi HTML entrano in un tag per modificarlo. L’attributo src è l’abbreviazione di “source” e indica al browser dove cercare l’immagine. Scrivi src = “” e incolla l’URL dell’immagine tra le virgolette. Ecco un esempio:
<img src=”https://www.esempio.com/casa.jpg”>
Aggiungi un attributo alt
Tecnicamente il tuo HTML ha tutto ciò che serve per visualizzare l’immagine, ma è meglio aggiungere anche un attributo alt. Questo dice al browser quale testo visualizzare quando l’immagine non viene caricata. Ancora più importante, questo aiuta i motori di ricerca a capire di cosa tratta la tua immagine, e permette agli screen reader di descrivere l’immagine ai visitatori ipovedenti.
Segui questo esempio, cambiando il testo tra virgolette:
<img src=”https://www.esempio.com/casa.jpg” alt=”la mia casa”>
Se l’immagine non è importante per il contenuto della pagina, includi l’attributo alt senza testo (alt = “”).
Salva le tue modifiche
Salva il file HTML sul tuo sito web.
Visita la pagina che hai appena modificato o aggiorna la pagina se già l’avevi aperta.
Ora dovresti vedere la tua immagine.
Bene, ora sai come inserire un’immagine in un file HTML! Speriamo di esservi stati di aiuto, ciao e alla prossima 🙂
