Frank's baseline UX — agreed 06-08-2026

The nine rules every page passes BEFORE Frank sees it, drawn from his corrections on the eR School pages. The full standard (with his working-style, conciseness and cookbook blocks) lives in memory feedback-franks-standard.md.

1. Baseline UX is assumed, never requested: the whole card is clickable, hover is visible, links work.
2. Compact beats wide: cards a third of the page, not half — but real air between a title and its content.
3. Numbers are almost never the message: small, grey, or absent. Nobody cares that there are 164 of something.
4. Color carries meaning (one hue per section family); decoration carries nothing — no separator lines that add nothing.
5. One name per notion, once per page: no brand appearing twice, no two sections with near-same titles, sibling pages visible in the navigation, internal menus labeled as menus, meta information a whisper.
6. Titles precise, not evocative: "Good UI/UX", never "What makes a good service".
7. Missing content shown honestly: a tab saying "to be filled later" beats a hidden gap.
8. The builder's eye is the linter, not Frank's: this list plus the five-second cover-the-text test run before any page opens in his browser.
9. Look-choices come as three options rendered in the real page, one marked recommended.

10. Una página que llena la pantalla del teléfono se pega a los cuatro lados y nunca se mide en vh (27-08-2026)

Lo que pasó. Cuatro noches con el mismo defecto en la portada ABC: al abrirla en el teléfono se veía perfecta, y uno o dos segundos después asomaba una tira oscura abajo, el contenido subía y el título se metía detrás de la hora. Se arreglaron tres síntomas reales, uno por noche, y volvía.

La causa. Safari cambia el alto visible dos veces al abrir: su barra de traducción aparece y se va sola, y después se esconde la de direcciones. 100vh mide de más, 100svh mide con la barra puesta, 100dvh sigue a la barra pero no al vuelo: durante el salto el bloque conserva el alto anterior, deja ver el fondo por abajo y ese hueco mueve la página.

La regla. En la consulta de teléfono, el bloque que debe llenar la pantalla va position: fixed; inset: 0, que mide siempre la pantalla del instante. Si debajo no hay nada, se bloquea la rodada con html, body { height: 100%; overflow: hidden }. Y la imagen de fondo se sale un dedo por arriba y por abajo (56 px bastan), para que en el instante del salto lo que asome sea la propia imagen y no el color del fondo.

Cómo se comprueba, y sin esto no está hecho. Un navegador de escritorio nunca reproduce el salto: allí svh, dvh y la pantalla valen lo mismo. Se comprueba de dos maneras: (1) el bloque tiene que estar fixed (la vara de la página lo mide y reprueba si no); (2) cambiando el alto de la ventana SIN recargar, de 640 a 720, el bloque tiene que pasar a 720 en el mismo momento, con el título entero.

Dónde vive el guardián: 3 - Projects/abc-colombia/valentina/la-vara-pagina.py, criterio 46 en 9 - System/ui-ux/motion/criteria.md.