Barras de progreso de scroll, y por qué la tuya debería ser un perro

Toda página larga plantea la misma pregunta: ¿cuánto queda de esto? Un indicador de progreso la responde, y la mayoría la responde de una manera que dejas de notar en el segundo párrafo.

Para qué sirve la barra

La barra de desplazamiento ya te dice dónde estás, en principio. En la práctica mide unos pocos píxeles de ancho, se esconde hasta que mueves el ratón y, en una página que carga imágenes mientras avanzas, su pulgar cambia de tamaño mientras lees. Las extensiones devuelven una barra de progreso porque la respuesta propia del navegador se fue diseñando en silencio hasta desaparecer.

Así que tienes una línea fina de color arriba de la página que se llena al hacer scroll. Funciona. Es también lo más fácil de dejar de ver que hay en la página: es una línea recta, se sitúa en la franja que tu ojo ha aprendido a ignorar y nunca hace nada salvo alargarse.

Posición, pero también velocidad

Una barra lleva exactamente un número — cuánto has bajado. Hay un segundo número disponible gratis, y ninguna barra lo muestra: a qué velocidad te mueves.

scrolldog lleva los dos. La posición de la mascota a lo largo del borde de la ventana es la profundidad del scroll. Arriba de la página está a la izquierda; abajo, ya llegó al otro lado. Su paso es la velocidad del scroll: un golpe a la rueda y sale disparado; bajas párrafo a párrafo y va al trote.

Para, y se sienta. Esa es la parte que una barra no puede hacer. Una barra estática se ve idéntica si estás leyendo con atención o si dejaste la pestaña abierta hace tres horas. Una mascota que se ha sentado te está diciendo que la página se quedó quieta, y leerlo no te cuesta nada, porque no lo estabas leyendo — lo pillaste con el rabillo del ojo, que es la única atención que un indicador de progreso ha merecido nunca.

Qué cuesta

La objeción habitual a una extensión decorativa es que empeora el navegador. Esta escucha el scroll de forma pasiva, reduce cada ráfaga de eventos a una escritura por fotograma de animación y mueve un solo elemento dentro de un carril fijo de tamaño cero. Nunca lee ni cambia el diseño de tu página, y no hace ninguna petición de red desde la página que estás leyendo.

Un interruptor en la ventana lo apaga en todas partes, en cada pestaña abierta, a la vez.