Pubblicato il 07/12/15 - aggiornato il  | 2 commenti :

Come modificare le dimensioni delle immagini cambiando il loro URL su Picasa.

Come ottenere il link diretto di una immagine caricata su Picasa e come modificarlo per cambiare le dimensioni, per renderla quadrata e per farla scaricare automaticamente.
Il servizio Picasa Web Album di Google  è stato recentemente scorporato da Google+ anche se le nostre foto sarà comunque sempre possibile visualizzarle anche tramite Google Foto. In questo spazio praticamente illimitato vengono caricate anche tutte le immagini postate tramite i nostri blog su Blogger. Lo spazio nominalmente è di 15GB ma vengono conteggiate solo le immagini che abbiano una dimensione superiore ai 2048 pixel quindi praticamente nessuna di quelle che vengono pubblicate negli articoli.

Se non siete sicuri di quanto spazio state utilizzando e se volete conoscere quanto ve ne rimane basta accedere a Spazio Archiviazione di Drive. Infatti lo spazio usato su Picasa viene sommato a quello utilizzato su Gmail e ai documenti e ai file creati o caricati su Google Drive.

spazio-picasa-web-album

Quando si crea un nuovo blog e si comincia a pubblicarvi articoli con immagini automaticamente su Picasa Web Album viene creato appunto un nuovo Album con il nome dello stesso blog. La Privacy di questo album di default è Solo a chi ha il link che permette a tutti di visualizzare le immagini del blog. Le altre scelte sono Pubblica sul web e Solo tu. Nel primo caso chiunque ha accesso a internet può accedervi inoltre le foto appariranno nella Galleria Pubblica. Nel secondo caso invece solo il proprietario dell'account può visualizzare le foto dell'album. Se foto di un album configurato come Solo tu fossero postate in un articolo i lettori vedrebbero una icona con il divieto di accesso usato per la viabilità.

COME AVERE IL LINK DIRETTO DI UNA IMMAGINE SU PICASA


Il link diretto o hotlink di una immagine è il parametro fondamentale per pubblicarla in una pagina web mediante i tag HTML. Ci sono almeno un paio di metodi per ottenere il link diretto di una foto su Picasa.  Bisogna cliccare sopra alla foto per avere solo quella nella pagina

url-diretto-picasa 
Dopo aver separato l'immagine dalle altre dell'album con il sinistro del mouse si clicca sulla foto con il destro del cursore e si sceglie Copia URL immagine (Chrome) nel menù contestuale che si apre. Questo primo metodo è difficile da applicare quando l'immagine è molto piccola magari di un solo pixel e non si riesce a cliccarci sopra con il destro del mouse. Alternativamente quindi si può andare sulla destra e cliccare su Link a questa foto


link-foto-picasa

Nella scheda che si apre si mette la spunta su Solo immagine (nessun link) e in Dimensioni scegliere Dimensione originale al posto di Miniatura. Si copia quindi l'indirizzo del campo Incorpora immagine che ci permetterà di mostrare la foto in una pagina web con questo codice

<img src="URL_DIRETTO_PICASA" title="Titolo immagine" alt="Testo alternativo" width="200" height="150" />

Oltre all'URL diretto ottenuto da Picasa è fondamentale dal punto di vista SEO inserire il cosiddetto Testo alternativo all'interno del tag Alt. Tale testo si visualizza nei browser che per una qualche ragione non riescono a caricare la foto. Anche il Titolo della immagine all'interno del tag Title è importante ed è quello che il lettore legge nel tooltip che si apre quando passa con il mouse sopra alla foto. I parametri width="200" height="150" determinano le dimensioni della foto e sono opzionali. Se non vengono inseriti verrà visualizzata la foto nelle sue dimensioni originali.  

RIDIMENSIONARE LE FOTO TRAMITE L'URL DI PICASA


Non sempre si è in grado di inserire gli attributi width e height per configurare le dimensioni di una foto. Possiamo ovviare modificando l'hotlink della immagine. Recentemente è stato introdotto nell'URL delle foto di Picasa il parametro Ic42 che non è chiaro a cosa serva anche se è chiaro cosa significhi il parametro che lo precede nell'URL. Facciamo l'esempio di una foto con questo URL

https://lh3.googleusercontent.com/-8Hc897zAc-U/TrKna0FXaaI/AAAAAAAAU_0/eX-HU721RHI/s419-Ic42/idoli.jpg

Come vedete prima di -Ic42 c'è il parametro s419 che determina la larghezza della foto. Possiamo diminuirne la larghezza modificando quel valore. Per esempio l'URL

https://lh3.googleusercontent.com/-8Hc897zAc-U/TrKna0FXaaI/AAAAAAAAU_0/eX-HU721RHI/s320-Ic42/idoli.jpg

mostrerà la stessa foto del precedente indirizzo ma con una larghezza di 320 pixel. Non possiamo però aumentare la larghezza ma solo diminuirla. Infatti questo URL

https://lh3.googleusercontent.com/-8Hc897zAc-U/TrKna0FXaaI/AAAAAAAAU_0/eX-HU721RHI/s480-Ic42/idoli.jpg

mostrerà una immagine con le stesse dimensioni di 419 pixel della foto originale. Questo può essere facilmente controllato utilizzando la estensione Image Size Info di Chrome. Prendendo come dimensioni massime quelle originali possiamo comunque configurare una foto con larghezza e altezza differenti modificando l'URL in questo modo

https://lh3.googleusercontent.com/-8Hc897zAc-U/TrKna0FXaaI/AAAAAAAAU_0/eX-HU721RHI/w380-h250-p-Ic42/idoli.jpg

che avrà larghezza di 380 pixel e altezza di 250 pixel. In sostanza al parametro s419 della foto originale si è sostituito w380-h250-p che determina le due dimensioni della immagine. Oltre a -p esistono altri parametri come -rw, -c e -d di cui non mi è molto chiaro il funzionamento.  Se per esempio modificate l'URL precedente in questo modo

https://lh3.googleusercontent.com/-8Hc897zAc-U/TrKna0FXaaI/AAAAAAAAU_0/eX-HU721RHI/w380-h250-p-d-Ic42/idoli.jpg

aggiungendo -d e lo incollate nel browser verrà scaricata la foto automaticamente. Potrebbe essere un sistema non so quanto lecito di far scaricare una determinata immagine senza il loro consenso a tutti coloro che aprano una pagina web. Se invece usate questo URL

https://lh3.googleusercontent.com/-8Hc897zAc-U/TrKna0FXaaI/AAAAAAAAU_0/eX-HU721RHI/s400-c-Ic42/idoli.jpg 

oltre a settare la larghezza della foto, con il parametro -c, l'immagine sarà mostrata quadrata

immagini-url-picasa 
Se riuscirò a trovare delle applicazioni pratiche ulteriori di queste funzionalità di Picasa non esiterò a pubblicarci un articolo in merito.


2 commenti :

  1. Salve Ernesto, sto cercando di rispettare il requisito CLS di Pagespeed che impone di dare delle dimensioni alle immagini per evitare l'effetto BOOM. Premetto che le mie immagini si adattano allo schermo senza i parametri width ed height, ma li devo mettere per questioni SEO. Quindi nell'HTML dell'immagine uso questo codice:
    data-original-height="386" data-original-width="580" height="386" width="386"

    così facendo sul desktop ho l'immagine diventa più piccola mentre prima di di aggiungere height="386" width="386" si adattava alla larghezza della versione mobile fino a un massimo di 580px. Il problema è dovuto al fatto che nella versione desktop io vedo il link corretto (l'unico e solo che io ho messo) ed è questo:
    https://1.bp.blogspot.com/-bY70IGJ44y4/YYq1ogW5v6I/AAAAAAAAt80/4Ot7CeyQb4Yt54ZDirdLNuTKKpgYni98gCLcBGAsYHQ/s0/donna-che-si-pettina-onde-dorate.jpg

    mentre nella versione mobile mi appare un link diverso, tra l'altro mi converte i valori di width a 280 ed height a 186. Notare che s280 appare nel link della versione mobile. Il fatto è che non gliel'ho detto io di mettere questo url e vorrei capire se c'è un modo per impedirgli di modificarmi il link quando si passa alla versione mobile.
    https://1.bp.blogspot.com/-bY70IGJ44y4/YYq1ogW5v6I/AAAAAAAAt80/4Ot7CeyQb4Yt54ZDirdLNuTKKpgYni98gCLcBGAsYHQ/s280/donna-che-si-pettina-onde-dorate.jpg

    Premetto che uso il tema SIMPLE. Nel dubbio ho creato un blog di prova e ho notato che col tema SIMPLE mi cambia il link pure lì, sul tema EMPORIO il link rimane come quello che ho impostato anche nella versione mobile. Ne sai qualcosa?

    RispondiElimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti.
Info sulla Privacy