Molti gestori di siti hanno l’abitudine di porre un watermark sulle proprie immagini per evitare che altri utenti le possano riutilizzare su altri siti.
Personalmente non ho mai amato questo tipo di protezioni perché continuo a credere nella condivisione delle informazioni.
watermark.js è una libreria js per la creazione ‘al volo’ di watermark sulle immagini.
Le immagini con il classname “watermark” (si può tranquillamente cambiare il nome della classe) verranno automaticamente ‘marchiate’ con l’immagine da voi scelta.
Il vostro watermark non deve per forza essere un PNG o un GIF trasparente: potrete tranquillamente anche usare una JPG.
watermark.js si occuperà di rendere trasparente la vostra JPG.
Ecco alcuni esempi di come il watermark viene applicato alle immagini
Nella prima immagine viene inserito come esempio un Qr Code, nella seconda un logo trasparente.
Come funziona:
Posizionate watermark.js subito prima la chiusura del tag <body> e modificate a vostro piacimento il tipo di chiamata al js.
Assegnate la classe “watermark” a tutte le immagine che volete marchiare.
Le impostazioni principali sono:
“className”: il nome della classe- default: “watermark”
“position”: “top-left”|”top-right”|”bottom-right”|”bottom-left”. dove volete far apparire il watermark
“path”: il percorso alla vostra immagine di watermark
“opacity”: la trasparenza del watermark [da 0 a 100] – Default: 50
Ovviamente questo metodo di protezione è davvero basico e può essere facilmente aggirato guardando nel codice della pagina e puntando alla url assoluta dell’immagine prima del processamento di watermark.js.
Resta comunque una soluzione semplice ed elegante per inserire un vostro logo su tutte le immagini che volete.
Tutto opensource e scaricabile gratuitamente da qui
