Cómo evitar que nos roben imágenes de nuestras páginas web

7 enero, 2008 on 10:17 am | En contenidos, Diseño web, General, internet | 11 Comentarios

Cuando realizamos una página web, una de las grandes preocupaciones (entre otras) es evitar que nos roben nuestros contenidos. Sobre todo si hablamos de sitios con textos o gráficos muy exclusivos o difíciles de conseguir.

En primer lugar hay que decir que desgraciadamente todo lo que publiquemos en internet podrá ser copiado de alguna manera u otra. Y que la única forma segura de evitar que nos “fusilen” algo es no publicarlo.

Sin embargo, podemos hacer algo al respecto, y al menos ponérselo un poco más difícil a los que quieran coger contenido “prestado”. En este post vamos a hablar de las formas de persuadir a quienes quieran acceder a nuestros contenidos gráficos.

Deshabilitar botón derecho con javascript

Uno de los recursos más empleados en este tipo de casos es deshabilitar el botón derecho a través de javascript. Este recurso al menos deshabilita la función de “Guardar imagen como…” con el botón derecho. Además si lo acompañamos con un mensaje tipo alert recordando el copyright, mucho mejor.

Botón derecho deshabilitado

Un ejemplo de código javascript para emplear en estos casos es el siguiente, que debemos incluir en nuestros archivos html entre las etiquetas <head> y </head>:

PLAIN TEXT

JavaScript:

  1. <script>  var sMensaje = \\\\\\’Botón derecho deshabilitado. \n Todos los derechos reservados  ©\\\\\\’;
  2. function anularBotonDerecho(e) {
  3. if (navigator.appName == \\\\\\’Netscape\\\\\\’        && (e.which == 3 || e.which ==    2)){       alert(sMensaje);       return false;     } else if (navigator.appName == \\\\\\’Microsoft Internet Explorer\\\\\\’          && (event.button    == 2)) {       alert(sMensaje);     }   }
  4. document.onmousedown=anularBotonDerecho;   document.oncontextmenu=new Function(“return false”);
  5. </script>

Marcas de agua

Con el anterior ejemplo tan sólo hemos deshabilitado el botón derecho. De todas maneras sabemos que un usuario medianamente experto podía haber guardado las imágenes en su disco duro de alguna manera.

Otro métido para persuadir a los usuarios es colocar una “marca de agua” en nuestras fotografías. Este método resulta más “intrusivo”, ya que estamos modificando la foto original, pero por contra resultará más difícil que después esa imagen sea empleada con otros motivos.

Existen dos maneras de realizar marcas de agua. Una es realizarla con directamente con un programa de edición gráfica (por ejemplo Photoshop). Entonces podemos incluir una imagen encima de la original (en una nueva capa), con nuestro logotipo y jugando con la transparencia.

imagen con marca de agua

Evidentemente esto supone un trabajo importante si publicamos imágenes en nuestro sitio habitualmente. Pero si tenemos un publicador en php podemos hacer que este proceso se realice automáticamente cada vez que subimos una imagen al servidor.

En primer lugar tenemos que hacer una imágen en png que sirva de marca de agua. Es decir, una imagen con transparencia que se superpondrá a todas las imágenes que subamos. Y para que el sistema insete esta marca de agua automáticamente debemos usar la siguiente función:

PLAIN TEXT

PHP:

  1. function marcadeagua($img_original, $img_marcadeagua, $img_nueva, $calidad) {
  2. // obtener datos de la fotografia
  3. $info_original = getimagesize($img_original);
  4. $anchura_original = $info_original[0];
  5. $altura_original = $info_original[1];
  6. // obtener datos de la "marca de agua"
  7. $info_marcadeagua = getimagesize($img_marcadeagua);
  8. $anchura_marcadeagua = $info_marcadeagua[0];
  9. $altura_marcadeagua = $info_marcadeagua[1];
  10. // calcular la posicion donde debe copiarse la "marca de agua" en la fotografia
  11. $horizextra = $anchura_original - $anchura_marcadeagua;
  12. $vertextra = $altura_original - $altura_marcadeagua;
  13. $horizmargen =  round($horizextra / 2);
  14. $vertmargen =  round($vertextra / 2);
  15. // crear imagen desde el original
  16. $original = ImageCreateFromJPEG($img_original);
  17. ImageAlphaBlending($original, true);
  18. // crear nueva imagen desde la marca de agua
  19. $marcadeagua = ImageCreateFromPNG($img_marcadeagua);
  20. // copiar la "marca de agua" en la fotografia
  21. ImageCopy($original, $marcadeagua, $horizmargen, $vertmargen, 0, 0, $anchura_marcadeagua, $altura_marcadeagua);
  22. // guardar la nueva imagen
  23. ImageJPEG($original, $img_nueva, $calidad);
  24. // cerrar las imagenes
  25. ImageDestroy($original);
  26. ImageDestroy($marcadeagua);
  27. }

Después sólo tendríamos que llamar a la función:

PLAIN TEXT

PHP:

  1. marcadeagua(“images/original.jpg”,”images/marcadeagua.png”,”images/original.jpg”,100);

Más sobre la marca de agua en php: http://bitacora.guebs.com/articulo/28/anadir-marca-de-agua-a-fotografias/
Emplear flash

Otro recurso para evitar que nuestras imágenes se puedan coger fácilmente es emplear flash, por ejemplo para realizar una galería de fotos donde se muestren las imágenes más importantes. Con ello evitaremos que los usuarios se puedan descargar las imágenes de una manera directa. Aunque ni aún así estaremos a salvo de que nos puedan copiar.

Conclusión

Como decíamos al comienzo del artículo la única manera de que algo que publiquemos en internet no sea copiado es no publicándolo. Sin embargo con las técnicas que hemos explicado podemos, al menos dificultar esa tarea. Según nos convenga podemos usar cada una de las técnicas, e incluso combinarlas.

Feed Feeds entradas - comentarios. XHTML y CSS válidos.

www.asoma.es