don’t click (clickjacking en twitter)

Hoy la curiosidad lleno twitter de mensajes don’t click y el enlace de una misteriosa url con un simple botón.

No era más que un iframe que ocultaba hábilmente el botón de update de la página de twitter, y si pulsabas estando logeado en tu cuenta de twitter mandabas el mensaje «don’t click [y la dichosa url del boton]» como actualización de estado. Así que otros incautos followers tuyos lo vería de nuevo y propagarían el clickjacking.

En ajaxiam explican como lo hicieron.


iframe { position:absolute;width:550px;height:228px;top:-170px;left:-400px;z-index: 2;opacity: 0;filter: alpha(opacity=0); }
button { position:absolute;top:10px;left:10px;z-index:1;width: 120px; }

Un par de líneas para comprende lo sencillo que fue aprovechar la actualización de status para propagarse. Una simple visita con el firebug lo delata.

Y por cierto, al estar acortada con una tinyURL ya ha sido bloqueada por uso inapropiado. http://tinyurl.com/amgzs6

Durbon también «reinicia»

durbonDurbon también reinicia, hablo del diseño. Más que reiniciar, unos retoques, la verdad que este diseño no me disgusta. Tiene fallos o cosas a mejorar, pero aún no me he cansado de él.

ReiniciaEl boletín que me han mandado esta tarde los chicos de cssReinicia recordaba los 15 días que quedan para el Reinicio global. Y yo aún sin un diseño. Ni dibujado en un papel y, por supuesto, aún sin una línea de código escrita. Pero tengo un buen libro de CSS, uno profesional, nada de «aprenda css fácilmente». ¡Qué uno ya tiene una buena base, por favor!

15 días para el reinicio, y me piro a Cantabria y Asturias. A la vuelta con un poquito de presión( y suerte) tendremos listo el diseño. Intentaré no darme muchos cabezazos con el teclado intentando que cumpla las normas W3C.

Aardvark: extensión para Firefox

Aardvark es una herramienta para diseñadores y desarrolladores que quieren ver exactamente cuales son las capas de las CSS y donde estan colocadas en la web. Una fenomenal herramienta para combinar con el código fuente bruto para localizar el diseño de cada elemento y su nombre en hoja de estilos. Muestra el nombre del id o class si existen o sino simplemente el nombre del elemento html

Está disponible como extensión de Mozilla Firefox.

Cambio de diseño

Ayer me decidí a cambiar el diseño del weblog. Al final me ha gustado como ha quedado, pero falta aún modificar varias cosas para que sea más funcional. No falla nada, eso sí.
Tengo que:

  • Terminar el about
  • Terminar la página de artículos
  • Rediseñar el apartado para los comentarios
  • Escribir las decisiones de diseño (para recordar el por qué de cada cosa) y las influencias