Inserire un'Immagine Ottimizzare la Visualizzazione dell'Immagine
. Esistono numerosi servizi di hosting gratuiti che puoi usare come archivio online per le tue immagini, per esempio Picasa Web Albums, Imgur, Flickr o Photobucket. Leggi attentamente i termini relativi all'utilizzo del servizio che hai selezionato. Alcuni riducono automaticamente la qualità delle immagini per diminuire lo spazio occupato su disco, oppure le rimuovono nel caso in cui dovessero generare troppo traffico (questo accade per preservare la banda del servizio di hosting).  Alcuni servizi di hosting dedicati ai blog permettono di caricare le proprie immagini utilizzando direttamente l'interfaccia di amministrazione del blog. Se hai scelto un servizio di hosting a pagamento per il tuo sito web, sarai in grado di caricare le tue immagini direttamente su quest'ultimo utilizzando un client FTP. In questo caso è bene creare una cartella denominata "Immagini" per organizzare al meglio i file relativi al sito.  Se hai la necessità di usare un'immagine pubblicata su un altro sito web, dovrai chiedere il permesso al relativo proprietario. Se ti concede il permesso di usarla, scaricala in locale sul computer, quindi caricala sul servizio di hosting che hai scelto di utilizzare. Apri il file HTML relativo alla pagina dove vuoi inserire l'immagine in esame. Se stai cercando di pubblicare un'immagine all'interno di un forum, puoi inserire il codice direttamente nel post. Molti forum utilizzano un proprio sistema personalizzato per gestire i contenuti anziché il codice HTML. In questo caso, se non riesci a pubblicare l'immagine di tuo interesse, chiedi aiuto agli altri utenti che frequentano il forum. Individua il punto all'interno del tag "body" del codice HTML in cui desideri inserire l'immagine in esame, quindi digita il codice <img>. Si tratta di un tag HTML "vuoto", il che significa che non prevede l'utilizzo del relativo tag di chiusura. Tutte le informazioni relative all'immagine da pubblicare andranno inserite all'interno delle parentesi angolari del tag "img". <img> Accedi alla pagina web dove hai caricato l'immagine in oggetto. Selezionala con il tasto destro del mouse (se stai usando un Mac, cliccala tenendo premuto il tasto "Ctrl"), quindi seleziona l'opzione "Copia l'indirizzo dell'immagine" dal menu contestuale che apparirà. In alternativa puoi visualizzare l'immagine in una pagina dedicata scegliendo l'opzione "Visualizza immagine" e copiare l'URL visibile all'interno della barra degli indirizzi del browser. Se hai caricato l'immagine all'interno della cartella dedicata a questo tipo di contenuti memorizzata sul servizio di hosting che ospita anche il sito web su cui la pubblicherai, allora dovrai inserire il relativo link rispettando il seguente formato "/[cartella_immagini]/nome_file" (per esempio /images/pippo.jpg). Se il link indicato non dovesse funzionare, significa che l'immagine molto probabilmente è contenuta all'interno di una sottocartella. Per ovviare al problema, spostala nella directory principale. Come già saprai, gli attributi fanno riferimento a un tag HTML e ne modificano l'aspetto e il funzionamento e vanno inseriti all'interno di quest'ultimo. L'attributo src è la contrazione del termine inglese "source" e serve a indicare al browser internet dove reperire l'immagine da assegnare al tag "img". Digita il codice src=" " e incolla l'URL dell'immagine da usare all'interno delle virgolette. Ecco un esempio che ti aiuterà a capire meglio: <img src="http://www.serviziodihosting.com/pippo.jpg"> Tecnicamente il codice HTML creato nel passaggio precedente ha tutto quello che serve per visualizzare l'immagine scelta nel punto desiderato, ma è meglio utilizzare anche l'attributo alt per ottenere i risultati migliori. Quest'ultimo indica al browser internet il testo che deve essere visualizzato nel momento in cui l'immagine non fosse disponibile. La funzione più importante di questo attributo, però, è quella di indicare ai motori di ricerca a cosa fa riferimento l'immagine e permettere ai lettori automatici di descriverla agli utenti non vedenti. Usa il codice mostrato di seguito modificando il testo inserito fra virgolette:  <img src="http://www.serviziodihosting.com/pippo.jpg" alt="inserisci qui la descrizione dell'immagine"> Se l'immagine non è inerente al contenuto presente nella pagina web, includi comunque l'attributo "alt" ma senza aggiungere del testo (alt=""). Salva il file che contiene la struttura HTML del tuo sito web. A questo punto visita la pagina web appena modificata, oppure aggiornala se è già visibile all'interno di una scheda del browser. L'immagine che hai inserito dovrebbe apparire nel punto specificato. Se la dimensione non ti soddisfa o non sei felice del risultato ottenuto, prosegui nella lettura dell'articolo. Per ottenere i risultati migliori ridimensiona l'immagine usando un software gratuito, quindi carica sul sito o sul servizio di hosting la nuova versione. Gli attributi width e height del codice HTML servono a indicare al browser come ridimensionare un'immagine. Tuttavia alcuni browser potrebbero generare un risultato imprevedibile – e in rari casi generare un errore nella visualizzazione dell'immagine. Se hai la necessità di eseguire una modifica rapida ed efficace, utilizza il seguente codice:   <img src="http://esempio.com/imgesempio.png" alt="visualizza questa immagine" width=200 height=200> (I valori degli attributi width e height sono espressi in pixel).  In alternativa, usa questo codice <img src="http://esempio.com/imgesempio.png" width=100% height=10%> (in questo caso i valori degli attributi width e height rappresentano una percentuale delle dimensioni della pagina web o dell'elemento in cui è inserita l'immagine).  Nel caso in cui usassi un solo attributo (width o height), il browser internet dovrebbe preservare automaticamente il rapporto esistente fra altezza e larghezza dell'immagine per mantenere le proporzioni corrette. L'attributo title può essere usato per aggiungere un commento o un'informazione addizionale all'immagine che ne aiuti a capire la funzione. Per esempio puoi citare l'artista che l'ha creata. Nella maggior parte dei casi il testo dell'attributo title viene visualizzato quando l'utente sposta il cursore del mouse sull'immagine e lo mantiene fermo per qualche secondo. <img src="http://esempio.com/imgesempio.png" title="Scattata da J. Godfrey"> Per fare in modo che l'immagine funga anche da link HTML, dovrai inserirla all'interno dei tag <a></a>. Ecco un codice di esempio: <a href="http://www.url_del_link.com"><img src="http://url_immagine.com/immagine.gif"></a>
Carica l'immagine da usare online Modifica il codice HTML. Inizia inserendo il tag HTML "img". Individua l'URL completo dell'immagine da utilizzare. Colloca l'URL dell'immagine all'interno dell'attributo "src". Aggiungi l'attributo "alt". Salva le modifiche al codice HTML. Modifica la dimensione finale dell'immagine. Aggiungi un "tooltip". Usa l'immagine come collegamento ipertestuale.
https://www.wikihow.com/Insert-Images-with-HTML https://www.wikihow.com/Insert-Images-with-HTML
Inserting the Image Optional Adjustments