Diarios de la nube Idea guardada 0 veces
Sé la primera persona en valorar esta idea Valorar

El servicio de Google para realizar el aviso de uso de cookies en tu web: Cookiechoices.



Al navegar por múltiples sitios en Internet todos nos hemos encontrado con algún tipo de aviso o alerta que alude al "uso de cookies" en el sitio por el cual estamos navegando.
Este mensaje es fruto de la legislación europea publicada en su directiva 2009/136/CE referente a los derechos de los usuarios y la necesidad de que estos sean informados cuando un sitio web haga uso de las mismas.¿Qué son las Cookies?

Las cookies (proveniente de galletas en inglés) son pequeños "trozos" de información que un sitio web puede utilizar para almacenar información del navegador que puede ser analizada por un programa para diversos fines.
Por ejemplo, cuando un usuario realiza una búsqueda de un artículo en una determinada tienda virtual, los sistemas publicitarios que puedas albergar en tu web pueden leer de la cookie de dicha tienda virtual qué artículo ha buscado el citado usuario para ofrecerle publicidad referente a ese artículo.
También se pueden utilizar Cookies para estudiar el número de visitas que un sitio web recibe, la localización geográfica de las mismas y diversa información que puede utilizarse para múltiples fines dentro de un sitio web.
¿Porqué hay que informar del uso de Cookies?

Legalmente es natural informar a los usuarios de la utilización de aplicaciones de terceros que pueden leer la información temporal de la navegación de los mismos que realizan por Internet. El usuario tiene el derecho de conocer que sus datos de navegación pueden ser analizados por sistemas ajenos a la propia web que visita, así como saber cuáles son estos para informarse de las políticas de calidad y directrices de calidad de las mismas.¿Cómo puedo informar al usuario del uso de cookies en mi página web?

Google ha desarrollado la web http://www.cookiechoices.org/ diseñada específicamente para todos los editores web que deseen utilizar un código fuente que ya se ocupa directamente de avisar al usuario como nosotros decidamos.
En Cookiechoices te proporcionan un script mediante el cual puedes avisar al usuario de que utilizas cookies para que éste pueda visualizar información sobre las mismas o cerrar el mensaje porque acepte su utilización.¿Porqué utilizar las herramientas de Cookiechoices?

En primer lugar por confiabilidad. Aunque existen múltiples herramientas, páginas webs y scripts en Internet para realizar el aviso de uso de cookies a los usuarios, éste sitio está respaldado, diseñado y desarrollado por Google.
En segundo lugar, el script utilizado por cookiechoices, a diferencia de la mayoría existente en Internet, está diseñado para no impactar en el rendimiento web de la página (utiliza llamadas asíncronas según la normativa de Google Pagespeed para evitar bloqueos o ralentizaciones innecesarias).
Por último y lo más importante, no reside en ningún servidor "de terceros". Puedes instalarte el código fuente que utiliza el script de cookichoices en tu propia web sin necesidad de acceder a él por medio de un servidor que no sea el tuyo. Simplificando, el código que utilizas no está en otro sitio que "donde tú digas" y no dependes de una web ajena a la tuya para ofrecer el servicio de aviso a los usuarios.
Adicionalmente, mejora la calidad de tu servicio al cumplir con las normativas y estándares europeos creados a tal efecto.¿De qué debe componerse un correcto mensaje de aviso de uso de cookies?

Si bien cookiechoices te dota de todas las opciones para poder poner en tu web el mensaje de aviso de cookies es importante conocer la composición de éste:
En Diarios de la nube he implementado el mensaje de aviso de cookies ajustado en la parte superior de la web, justo bajo el menú (está remarcado en rojo en la imagen inferior):


El mensaje está compuesto de un "cuerpo" con el texto que prefieras para avisar sobre la utilización de cookies en tu web: "Las cookies me permiten ofrecerte mejor mis servicios. Al utilizar estos servicios, aceptas el uso que hago de las cookies"
Al cuerpo del mensaje siempre le acompañan dos enlaces:
"Aprender más": donde he creado una página en el Blog para explicar la utilización que hago de las cookies.
"Cerrar mensaje": enlace que al ser pulsado hará que el mensaje de cookies se cierre y NO VUELVA A SALIR hasta que el usuario limpie sus archivos temporales en el navegador.¿Cómo utilizo los servicios de cookiechoices de Google en mi web con Joomla, Wordpress, etc...?

1) teclea en la barra de direcciones de tu navegador http://www.cookiechoices.org/ y se te mostrará una pantalla como la que te expongo a continuación:


2) Pulsa en la opción del menú de la página web llamada "Herramientas" tal como te marco en el recuadro rojo de la imagen inferior.


3) En Herramientas te explican las dos opciones disponibles para mostrar el mensaje de aviso a tus usuarios:
En forma de mensaje de bienvenida, donde como puedes ver en la pantalla inferior, cuando el usuario acceda a la web se le presentará el aviso en una ventanita en el centro de la pantalla (ver ejemplo en pantalla inferior):


En una barra de aviso en la parte superior de la página web (ver ejemplo en pantalla inferior, he marcado en rojo el aviso tal y como quedaría en cualquier web donde se instalara):


4) Una vez escogido el formato de aviso que prefiramos para nuestra web, sólo tenemos que:En Wordpress, Joomla o cualquier medio de edición web con permisos para subir archivos:

4.1) Copiar en la raíz de nuestro servidor el archivo descargable desde cookiechoices llamado "cookiechoices.zip" (te lo marco en rojo en la pantalla inferior el enlace del cual puedes descargarlo):


4.2) Copiar el código fuente que se encuentra justo debajo del enlace donde se referencia al javascript de cookiechoices (te lo marco en rojo en la pantalla inferior):


En Blogger:



Tienes dos formas de hacerlo en Blogger: utilizando el código de cookiechoices.js directamente dentro de tu plantilla o empleando Google Drive para subir cookiechoices.js y llamarlo desde tu Blog.
NOTA: antes de hacer cambios en tu plantilla recuerda realizar una copia de seguridad para recuperarla en caso de error.
A) Utilizando el código fuente del contenido de cookiechoices.js directamente en tu plantilla. Bastaría con copiar y pegar el código fuente que a continuación te muestro justo bajo la etiqueta <body> del HTML de tu plantilla:
A.1) Dentro de Blogger, dirígete a "Plantilla" y pulsa el botón "Editar HTML" :

A.2) Copia y pega el código de cookiechoices.js directamente en tu plantilla bajo la etiqueta <body>. Debido a la extensión, para no hacer más grande el documento te pongo el código para copiar y pegar tras el botón que te muestro a continuación:<script>//<![CDATA[ Copyright 2014 Google Inc. All rights reserved.
 Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at
 http://www.apache.org/licenses/LICENSE-2.0
 Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. 
(function(window) {
  if (!!window.cookieChoices) {    return window.cookieChoices;  }
  var document = window.document;  // IE8 does not support textContent, so we should fallback to innerText.  var supportsTextContent = "textContent" in document.body;
  var cookieChoices = (function() {
    var cookieName = "displayCookieConsent";    var cookieConsentId = "cookieChoiceInfo";    var dismissLinkId = "cookieChoiceDismiss";
    function _createHeaderElement(cookieText, dismissText, linkText, linkHref) {      var butterBarStyles = "position:fixed;width:100%;background-color:#eee;" +          "margin: 63px 0px 63px 0px; left:0; top:0;padding:4px;z-index:1000;text-align:center;";
      var cookieConsentElement = document.createElement("div");      cookieConsentElement.id = cookieConsentId;      cookieConsentElement.style.cssText = butterBarStyles;      cookieConsentElement.appendChild(_createConsentText(cookieText));
      if (!!linkText && !!linkHref) {        cookieConsentElement.appendChild(_createInformationLink(linkText, linkHref));      }      cookieConsentElement.appendChild(_createDismissLink(dismissText));      return cookieConsentElement;    }
    function _createDialogElement(cookieText, dismissText, linkText, linkHref) {      var glassStyle = "position:fixed;width:100%;height:100%;z-index:999;" +          "top:0;left:0;opacity:0.5;filter:alpha(opacity=50);" +          "background-color:#ccc;";      var dialogStyle = "z-index:1000;position:fixed;left:50%;top:50%";      var contentStyle = "position:relative;left:-50%;margin-top:-25%;" +          "background-color:#fff;padding:20px;box-shadow:4px 4px 25px #888;";
      var cookieConsentElement = document.createElement("div");      cookieConsentElement.id = cookieConsentId;
      var glassPanel = document.createElement("div");      glassPanel.style.cssText = glassStyle;
      var content = document.createElement("div");      content.style.cssText = contentStyle;
      var dialog = document.createElement("div");      dialog.style.cssText = dialogStyle;
      var dismissLink = _createDismissLink(dismissText);      dismissLink.style.display = "block";      dismissLink.style.textAlign = "right";      dismissLink.style.marginTop = "8px";
      content.appendChild(_createConsentText(cookieText));      if (!!linkText && !!linkHref) {        content.appendChild(_createInformationLink(linkText, linkHref));      }      content.appendChild(dismissLink);      dialog.appendChild(content);      cookieConsentElement.appendChild(glassPanel);      cookieConsentElement.appendChild(dialog);      return cookieConsentElement;    }
    function _setElementText(element, text) {      if (supportsTextContent) {        element.textContent = text;      } else {        element.innerText = text;      }    }
    function _createConsentText(cookieText) {      var consentText = document.createElement("span");      _setElementText(consentText, cookieText);      return consentText;    }
    function _createDismissLink(dismissText) {      var dismissLink = document.createElement("a");      _setElementText(dismissLink, dismissText);      dismissLink.id = dismissLinkId;      dismissLink.href = "#";      dismissLink.style.marginLeft = "24px";      return dismissLink;    }
    function _createInformationLink(linkText, linkHref) {      var infoLink = document.createElement("a");      _setElementText(infoLink, linkText);      infoLink.href = linkHref;      infoLink.target = "_blank";      infoLink.style.marginLeft = "8px";      return infoLink;    }
    function _dismissLinkClick() {      _saveUserPreference();      _removeCookieConsent();      return false;    }
    function _showCookieConsent(cookieText, dismissText, linkText, linkHref, isDialog) {      if (_shouldDisplayConsent()) {        _removeCookieConsent();        var consentElement = (isDialog) ?            _createDialogElement(cookieText, dismissText, linkText, linkHref) :            _createHeaderElement(cookieText, dismissText, linkText, linkHref);        var fragment = document.createDocumentFragment();        fragment.appendChild(consentElement);        document.body.appendChild(fragment.cloneNode(true));        document.getElementById(dismissLinkId).onclick = _dismissLinkClick;      }    }
    function showCookieConsentBar(cookieText, dismissText, linkText, linkHref) {      _showCookieConsent(cookieText, dismissText, linkText, linkHref, false);    }
    function showCookieConsentDialog(cookieText, dismissText, linkText, linkHref) {      _showCookieConsent(cookieText, dismissText, linkText, linkHref, true);    }
    function _removeCookieConsent() {      var cookieChoiceElement = document.getElementById(cookieConsentId);      if (cookieChoiceElement != null) {        cookieChoiceElement.parentNode.removeChild(cookieChoiceElement);      }    }
    function _saveUserPreference() {      // Set the cookie expiry to one year after today.      var expiryDate = new Date();      expiryDate.setFullYear(expiryDate.getFullYear() + 1);      document.cookie = cookieName + "=y; expires=" + expiryDate.toGMTString();    }
    function _shouldDisplayConsent() {      // Display the header only if the cookie has not been set.      return !document.cookie.match(new RegExp(cookieName + "=([^;]+)"));    }
    var exports = {};    exports.showCookieConsentBar = showCookieConsentBar;    exports.showCookieConsentDialog = showCookieConsentDialog;    return exports;  })();
  window.cookieChoices = cookieChoices;  return cookieChoices;})(this);//]]>  document.addEventListener(&#39;DOMContentLoaded&#39;, function(event) {    cookieChoices.showCookieConsentBar(&#39;AQUI_TU_MENSAJE_DE_AVISO&#39;,      &#39;cerrar mensaje&#39;, &#39;Aprende más&#39;, &#39;AQUÍ_DIRECCIÓN_PARA_EXPLICAR_TUS_COOKIES&#39;);  });</script>

Recuerda modificar a tu gusto el mensaje de aviso y de establecer la URL a la que redireccionarás para explicar las cookies que utilizas en tu web si pulsan "más información".B) Utilizando Google Drive para servir el archivo cookiechoices.js en tu Blog: Puedes subir el archivo a Google Drive y luego llamarlo desde tu plantilla:Descarga el archivo cookiechoices.zip y descomprímelo en tu disco duro. En el interior del .zip verás que se encuentra el .js (el javascript de cookiechoices) y el archivo license (la licencia de uso).
B.1- Conéctate a Drive https://drive.google.com/ y una vez dentro pulsa el botón de la flecha roja que hay a la derecha del botón "crear" en el menú izquierdo. Te he marcado el botón con un recuadro azul en la imagen inferior de Drive:



B.2- Ahora sube los dos archivos (cookiechoices.js y license) con el botón de la flecha.

B.3- Cuando subas los archivos asegúrate que están compartidos como Público. Si no la compartes, no se podrá ver en Internet. Deberás seleccionar "Publico en la web" en la sección "Opciones de visibilidad" tal como te muestro en pantalla.


B.4- Al finalizar de compartir debes copiarte el código que te he marcado en rojo en la ventana inferior. Es el código identificativo único que Drive asignará a tu carpeta para que puedas utilizarla en tu Blog:


B.5- Escribe el código fuente de cookiechoices del tipo de aviso que quieres utilizar (si el de ventana de bienvenida o el de barra horizontal) en el código fuente de tu plantilla bajo la etiqueta <Body>:
<script src="DIRECCIÓN_DE_DRIVE"></script>
<script>
document.addEventListener("DOMContentLoaded", function(event) {
cookieChoices.showCookieConsentDialog("tu mensaje de aviso.",
"cerrar mensaje", "Aprender más", "dirección para explicar uso");
});
</script>

 un ejemplo con Drive sería:<script src="https://googledrive.com/host/LA_CLAVE_DE_DRIVE/"></script><script>
document.addEventListener("DOMContentLoaded", function(event) {
cookieChoices.showCookieConsentDialog("tu mensaje de aviso.",
"cerrar mensaje", "Aprender más", "dirección para explicar uso");
});
</script>

B.6- introduce el mensaje de aviso que prefieras y para cuando tus usuarios pulsen en "aprender más" escribe a la URL donde deseas que sean redireccionados para la explicación de las cookies que utilizas en tu web.
¡Eso es todo!, elige la forma en que deseas mostrar tu aviso de cookies, personaliza tu mensaje, ponlo en tu web y listo para cumplir con la normativa actual.

Fuente: este post proviene de Diarios de la nube, donde puedes consultar el contenido original.
¿Vulnera este post tus derechos? Pincha aquí.
¿Qué te ha parecido esta idea?

Esta idea proviene de:

Y estas son sus últimas ideas publicadas:

SEO con imágenes

Las imágenes que utilizas en tu Blog, en tu web, no son sólo un reclamo o un añadido decorativo para tus contenido. Pueden servir a los buscadores web para comprender mejor la información que proporci ...

Etiquetas: generalpropuestas

Recomendamos

Relacionado

guías y tutoriales informática blogger ...

Poner el aviso de uso de cookies en nuestro blog

Hola amores!! La verdad es que en este país se inventan leyes y normativas bastante absurdas, y ahora les ha dado por la política de uso de los cookies. Y para que no nos caiga una multa del copón hay que poner un aviso en el que se informa a los lectores del blog que se está recopilando información de sus visitas, lo que ya he nombrado como cookies. ¿Y que son las cookies? Pues básicamente son ...

general ayuda blogger otros tutoriales

Como poner la barrita de cookies en blogger

No me suele gustar publicar sobre cosas que ya han sido publicadas tropecientas veces en otros lados. Ojo, seguro que lo hago, pues realmente no leo otros blogs sobre mi temática, pero si algo sé o intuyo que ya lo han publicado mil sitios más, pues trato de evitarlo, porque para qué. Si es algo tipo el post sobre si es mejor blogger o worpdress, pues sí, porque al final yo doy mi punto de vista ( ...

rendimiento

Mejora el rendimiento de tu web con GTMetrix: Defer Parsing of Javascript

En Diarios de la nube vamos a ir ayudándote a resolver cada respuesta que GTMetrix pueda devolverte al analizar tu web. GTMetrix es un servicio de análisis rendimiento de la compañía de hosting GT.net. Es capaz de realizar los test más exigentes para analizar la velocidad de carga de todos los recursos de un sitio web, indicando así su velocidad de carga y localizando posibles "cuellos de bot ...

rendimiento

Mejora el rendimiento de tu web utilizando jascript asíncrono

El rendimiento es algo fundamental para la mejora de la experiencia de usuario y, junto a la calidad de los contenidos que se ofrecen en una web, un gran impulsor del posicionamiento en buscadores. En Diarios de la nube vamos a ir ayudándote a resolver distintos puntos importante para mejorar el rendimiento de tu sitio web por medio de GTMetrix. GTMetrix es un servicio de análisis rendimiento de l ...

general propuestas

Save to Drive un botón en tu web para guardar archivos en Google Drive

Google Drive es el servicio de almacenamiento en la nube desarrollado por Google. Hemos visto diversas utilidades que aprovechar con Google Drive para potenciar a Blogger: para alojar y servir una web completa, para alojar hojas de estilo o recursos para nuestra web que no podemos almacenar en Blogger, para crear enlaces de descarga de archivos con los que complementar nuestras entradas (instrucc ...

general social

Cómo insertar una publicación de Google+ en tu web

Una publicación e Google+ no es simplemente un mensaje que se comparte en una red social para que lo lean nuestros seguidores. Muchos creadores de contenidos web han descubierto la ventaja en materia de posicionamiento que supone utilizar esta red social. Al encontrarse plenamente integrada con el buscador, ambos forman una sinergia de la que ninguna otra red social del mundo dispone. Los "po ...

BLOGGER jimdo marketing digital ...

Cómo afecta al email marketing y al blog el RGPD?

El email marketing está afectado al igual que tu blog por el RGPD, es decir el reglamento general de protección de datos, que durante el 2018 entró en vigor en la Unión Europea. RGPD para cumplimiento legal de tu blog y el email marketing El RGPD está provocando que los datos de los usuarios sean protegidos dentro de la navegación como en formularios para suscripción, descarga u otras acciones en ...

general rendimiento

Cómo localizar problemas de rendimiento en tu web

Muchas veces tenemos problemas de rendimiento en nuestras web que son de difícil detección. En ocasiones las imágenes, otras veces algún script o componente que hemos instalado y ralentiza su dibujado en los navegadores de nuestros usuarios... Problemas que son de difícil detección si no se poseen suficientes conocimientos técnicos. Te propongo una manera sencilla de detectar qué puede estar afect ...

internet posicionamiento web posicionamiento seo ...

¿Cómo mejorar en Google el posicionamiento de mi web?

Esta es una de las muchas preguntas que se pueden hacer las pymes cuando no ven que su web alcanza visibilidad en Google. Aparecer en primeras posiciones es algo muy difícil ya que cuando realizas una búsqueda en Google aparecen miles de páginas como resultados y llegar a colocarte en la primera página no es sencillo, aunque si puede ser posible con mucha dedicación y perseverancia. ¿Qué hay que h ...

servicios picnik google

Picnik, el servicio en linea de retoque fotográfico de Google

Google continúa su imparable ascenso hacia lo más alto de las multinacionales. Su última adquisición se llama Picnik, y no es una merienda campestre, sino un servicio gratuito de retoque fotográfico en internet. Picnik permite a cualquier usuario hacer retoques más o menos sencillos en sus imágenes sin tener conocimientos avanzados de programas profesionales como Photoshop, de Adobe, iPhoto o Gimp ...