Uno scenario comune online è che hai un'immagine sul tuo sito Web a cui vuoi collegarti. Forse stai codificando una pagina sul tuo sito e vuoi aggiungere quell'immagine, o forse vuoi collegarla ad un altro sito, come un account di social media che hai. In entrambi i casi, il primo passaggio in questo processo consiste nell'identificare l'URL (uniforme individuazione risorse) di quell'immagine. Questo è l'indirizzo univoco e il percorso del file per quella specifica immagine sul Web. Diamo un'occhiata a come è fatto.
Iniziare
Per iniziare, vai alla pagina con l'immagine che desideri utilizzare. Tieni presente, tuttavia, che devi utilizzare un'immagine che possiedi. Questo perché puntare alle immagini di altre persone è considerato un furto di larghezza di banda e può metterti nei guai, anche legalmente. Se si collega a un'immagine sul proprio sito Web, si utilizza la propria immagine e la propria larghezza di banda. Va bene, ma se si collega al sito di qualcun altro, si sta risucchiando la larghezza di banda del proprio sito per visualizzare quell'immagine. Se quel sito ha limiti mensili sull'utilizzo della larghezza di banda, che molte società di hosting impongono, allora stai mangiando fino al limite mensile senza il loro consenso. Inoltre, copiare l'immagine di un'altra persona sul tuo sito web potrebbe essere una violazione del copyright. Se qualcuno ha concesso in licenza un'immagine da utilizzare sul proprio sito Web, lo ha fatto solo per il proprio sito web. Il collegamento a quell'immagine e il disegno nel tuo sito in modo che venga visualizzato sulla tua pagina vada al di fuori della licenza e potrebbe aprirti a sanzioni legali e multe. In conclusione, è possibile collegare a immagini che sono al di fuori del proprio sito / dominio, ma è considerato maleducato nella migliore delle ipotesi e illegale nella peggiore, quindi basta evitare questa pratica tutti insieme.
Per il bene di questo articolo, assumeremo che le immagini siano legalmente ospitate nel tuo dominio.
Ora che capisci i "trucchi" del collegamento delle immagini, vorremmo identificare quale browser utilizzerai. Browser diversi fanno le cose in modo diverso, il che ha senso dal momento che sono tutte piattaforme software uniche create da diverse società. Per la maggior parte, tuttavia, i browser funzionano tutti alquanto simili in questi giorni. In Google Chrome, questo è quello che farei:
-
Trova l'immagine che desideri.
-
Fai clic destro sull'immagine (Ctrl + clic su un Mac).
-
Apparirà un menu. Da quel menu, seleziono Copia l'indirizzo dell'immagine.
-
Se si incolla ciò che è ora negli Appunti, si scoprirà di avere il percorso completo per quell'immagine.
Ora, questo è il modo in cui funziona in Google Chrome. Altri browser hanno differenze. In Internet Explorer, fai clic con il tasto destro sull'immagine e scegli Proprietà. Da quella finestra di dialogo vedrai il percorso di questa immagine. Copia il indirizzo dell'immagine selezionandolo e copiandolo negli Appunti.
In Firefox, fare clic con il tasto destro sull'immagine e scegliere copia la posizione dell'immagine.
I dispositivi mobili sono ancora più complicati quando si tratta di trovare un percorso URL, e dal momento che ci sono così tanti diversi dispositivi sul mercato oggi, la creazione di un elenco definitivo di come trovare un URL immagine su tutte le piattaforme e dispositivi sarebbe un compito scoraggiante. In molti casi, tuttavia, si tocca e si tiene su un'immagine per accedere a un menu che consente di salvare l'immagine o trovare il suo URL.
OK, quindi una volta ottenuto l'URL dell'immagine, è possibile aggiungerlo a un documento HTML. Ricorda, questo era il punto centrale di questo esercizio, per trovare l'URL dell'immagine in modo che potessimo aggiungerlo alla nostra pagina! Ecco come aggiungerlo con HTML. Nota che dovresti scrivere questo codice in qualsiasi editor HTML che preferisci:
Genere:
Tra la prima serie di virgolette incollerai il percorso dell'immagine che vuoi includere. Il valore del testo alternativo dovrebbe essere un contenuto descrittivo che spiega quale sia l'immagine per qualcuno che potrebbe non vederlo realmente nella pagina.
Carica la tua pagina web e testala in un browser Web per vedere se la tua immagine è ora sul posto!
Consigli utili
Gli attributi di larghezza e altezza non sono obbligatori per le immagini e dovrebbero essere esclusi a meno che non si desideri sempre che l'immagine venga renderizzata con le dimensioni esatte. Con i siti Web reattivi e le immagini che si riflettono e si ridimensionano in base alle dimensioni dello schermo, questo è raramente il caso in questi giorni. Probabilmente è meglio lasciare la larghezza e l'altezza spente, soprattutto perché, in assenza di altre informazioni o stili di dimensionamento, il browser visualizzerà comunque l'immagine nella sua dimensione predefinita.
