Tutorial de Ublock Origin

Una de las extensiones que siempre instalo en todos los ordenadores es uBlock Origin, un bloqueador de publicidad muy personalizable, eficiente y con un funcionamiento casi perfecto.

Gracias a esta fantástica utilidad navegaremos más agusto, más seguros e incluso más rápido. Pero no debemos olvidar que muchas webs viven de la publicidad, por ello debemos ser conscientes y bloquear sólo aquella publicidad que sea realmente intrusiva o comprometa nuestra seguridad.

Podemos instalarlo desde su url de la webstore de google para Chrome o la tienda de addons de Firefox. Es posible instalarlo en Firefox para Android sin problema :-)

Para leer la documentación oficial debemos acudir a su repositorio oficial en github.

¡Ojo, no confundir con la url: ublock.org!, (este es otro proyecto diferente)

Una vez instalado no tendremos que hacer nada más para empezar a filtrar gran parte de la publicidad mediante el uso de listas estáticas. Podemos encontrar infinidad de listas públicas en filterlists.com. Dichas listas contienen los elementos del DOM que deben ignorarse en el renderizado de las páginas. Podemos ver cuáles vienen activadas por defecto en Configuración > Listas de filtros.

NOTA: No interesa volverse loco añadiendo listas de todo tipo porque cuantas más tengamos mayor será el consumo de recursos que realizará el navegador ya que obligamos a que cuando solicitamos un sitio tenga que procesar todas las reglas.

Uso básico

1. Botón para activar o desactivar Ublock origin, en la pestaña actual.
2. Permite eliminar temporalmente elementos html de la página pero no crea ningún filtro asociado. Esto es útil para examinar un sitio web antes de crear reglas personalizadas.
3.  Realiza lo mismo que el anterior pero además crea un filtro para bloquear el elemento elegido. (ver selección manual de elementos).
4. Muestra un log de las requests realizadas por el sitio, indicando hora, tipo de fichero y ruta completa. 
5. Abre el panel de control de Ublock Origin. Desde aquí podemos ver qué filtros están activos, nuestras reglas personalizadas, configuración etc.
6. Número de peticiones bloqueadas.
7. Número de peticiones bloqueadas desde instalación de ublock.
8. El número de dominios diferentes que hay en el total de peticiones realizadas y cuántos se han bloqueado. Existe una correlación entre este número y la exposición de nuestra privacidad.
9. Bloquear todas las ventanas emergentes (deshabilitado por defecto).
10. Bloquea elementos multimedia de gran tamaño (deshabilitado por defecto). Principalmente para ahorrar ancho de banda. El tamaño límite se puede cambiar en el panel de control, pestaña de configuración, opción: Bloquear elementos multimedia mayores que xxKB
11. Filtrado cosmético (habilitado por defecto). Es la eliminación de elementos visuales html del sitio, como banners. El contador nos indica los bloqueos realizados en la última request.
12. Fuentes descargadas de direcciones remotas (permitidas por defecto). El contador nos indica los bloqueos de fuentes realizados en la última request.
13. Deshabilitamos javascript por completo para el sitio.
14. Lista de dominios que han sido solicitados en la última request. Los indicadores significan: +++, ---- 100 o más requests  han sido permitidos/bloqueados, ++,-- menos de 100, +,- menos de 10.

Selección manual de elementos

No obstante puede ser que lleguemos a una web en la que se sigan colando anuncios, pero podemos eliminarlo manualmente asi como cualquier otro elemento que personalmente nos moleste.

Simplemente tenemos que desplegar el menú de ublock origin desde su icono en la barra de herramientas del navegador, y seleccionar el icono del cuentagotas, para seguidamente marcar con el cursor en forma de cruz aquel elemento que deseamos que no vuelva a aparecer en sucesivas visitas a la página en cuestión. Cuando lo hayamos marcado nos aparecerá una ventana emergente en la esquina inferior derecha donde nos indica el identificador del elemento que vamos a filtrar. Simplemente hacemos click en el botón Crear.

Con esto habremos creado un filtro personalizado que hace matching con el elemento html concreto, y que ahora aparecerá en la pestaña "Mis filtros" de la configuración de ublock. Ya podemos recargar la página y observar cómo el elemento molesto ya no aparece.

Filtrado dinámico

Algunas ventajas del filtrado dinámico frente al estático son el poco gasto de recursos y que permiten solucionar pequeños errores que cometan los filtros estáticos. Sin embargo también tienen desventajas: Son muy genéricos en comparación con la precisión que ofrece un filtro, y no pueden cargarse de listas públicas como los filtros.

Cuando activamos el filtrado dinámico ya no hablaremos de filtros sino de reglas de bloqueo de peticiones, como si de un firewall se tratase. Además las reglas tienen prioridad sobre los filtros estáticos.

Las reglas se crean desde la ventana principal de ublock, en la lista de dominios solicitados. Podemos actuar a nivel global (fig. 1 para todos los sitios) o a nivel local (fig 2. para el sitio actual) dependiendo de si lo hacemos sobre la columna roja o la azul. Las reglas locales tienen prioridad sobre las globales.

En la lista de dominios conectados podemos ver que en el extremo de cada fila aparece un color que nos indica:

• rojo: todas las peticiones fueron bloqueadas.
• verde: ninguna fue bloqueada.
• amarillo: algunas fueron bloqueadas.

Podemos establecer reglas dinámicas sobre elementos genéricos:

• images: engloba todas las request de tipo image.
• inline-scripts: engloba los scripts embebidos dentro del mismo fichero html del sitio.
• 1st-party scripts: scripts que se solicitan en peticiones separadas del html principal, pero apuntan al dominio del sitio.
• 3rd-party scripts: scripts que se solicitan en peticiones separadas del html principal, y apuntan a un dominio diferente al dominio del sitio.
• 3rd-party frames: Hace referencia a los elementos iframe, es decir, una ventana a un sitio externo incrustado dentro del documento html. Un ejemplo son los videos de youtube.

Las operaciones que podemos realizar con una regla son básicamente tres (fig 5.):

• Block (Roja): Bloquear elementos/dominio
• Noop (Gris oscuro): Sirve para añadir una excepción a una regla dinámica genérica.
• Allow(Verde): Permitir elementos/dominio

*Gris claro: Indica que no existe ninguna regla en para ese dominio.

Y por supuesto podemos establecer reglas dinámicas sobre dominio concretos.

Cuando realicemos cambios en las reglas podemos hacer los cambios permanentes para futuras visitas a la web haciendo click en el botón del candado (fig. 4).

Una buena práctica es crear copias de seguridad de nuestras reglas desde el panel de control, pestaña Mis Reglas, botón Exportar a archivo.

Evitar Anti Adblockers

Aunque en este punto puede parecer que ublock es perfecto, aún nos encontraremos con ciertas webs que detectarán el uso que hacemos de éste y nos pedirán desactivarlo sin queremos visualizar el contenido. Cabe mencionar que algunos sitios simplemente nos advierten pero no nos bloquean la navegación.

Como para todo, se puede hacer trampa, existe un conjunto de filtros llamado uBlock Protector, que evitará que funcionen los scripts que detectan los bloqueadores, y que podemos instalar siguiendo los pasos que indican en su página:

1. Habilita Adblock Warning Removal List.
2. Añade el filtro Nano Defender Integration
3. Habilita el modo avanzado y en el icono de ruedas dentadas cambia la variable userResourcesLocation del valor unset a  https://gitcdn.xyz/repo/NanoAdblocker/NanoFilters/master/NanoFilters/NanoResources.txt
4. Añade el filtro Nano filters
5. Añade el filtro Nano filters - Whitelist

Puede que adicionalmente a ublock protector tengais que eliminar manualmente algunos elementos del DOM. Una pagina para probar es: http://blockadblock.com