Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial

La legge di Fitts e l'effetto flipper

L'effetto flipper per avere link che si espandono su tutto il loro contenitore, e la famosa legge che tanto più grande è un link, meglio è.
L'effetto flipper per avere link che si espandono su tutto il loro contenitore, e la famosa legge che tanto più grande è un link, meglio è.
Link copiato negli appunti

L'ultimo articolo di Digital Web Magazine, The pinball effect, presenta un'interessante idea ovvero l'espandibilità  dei link grazie ai CSS, DOM e Javascript. Il concetto alla base è, tradotto dall'introduzione dell'autore, il seguente:

àˆ più semplice e veloce usare un link grande - questo è ovvio. C'è
anche una formula matematica, la legge di Fitts, per calcolare quanto più velocemente. Viene qui presentato un modo semplice per trasformare
un'intera area di una pagina web in un link dal suo interno, espandendo efficacemente
la sua dimensione grazie ai CSS, Javascript e il DOM. L'ho chiamato l'effetto flipper
in quanto il cursore accende varie aree dello schermo quasi come fa una pallina del flipper
in gioco.

Sottile il meccanismo dietro l'esempio dell'articolo, che usa tra l'altro la seconda versione Nifty Corners. Ci sono due div che hanno un link "dominante", inserito nel corrispondente titolo. Questi div sono
in grado di intercettare gli eventi mousover e onclick, così da mostrare un effetto rollover anche all'esterno del link dominante che estende grazie a Javascript l'area cliccabile a tutto il div che contiene il link. Sembra complicato, ma l'esempio potrà  chiarire meglio di tante parole.

L'idea di link che si espandono grazie al javascript non è del tutto nuova, ho segnalato in questo post
tempo fa Large clickable boxes as navigation with CSS and DOM di Chris Heilmann che, seppur basata sullo stesso concetto, ha un'applicazione un po' meno generica.

In quanto alla legge di Fitts, ecco alcuni approfondimenti:

Infine, tornando al pinball effect, ecco in chiusura tre provocazioni per stimolare la riflessione:

  • Tempo fa c'erano i siti "albero di natale" con un sacco di gif animate... dovremo aspettarci i siti "flipper" in futuro?
  • Personalmente, mi trovo spesso a selezionare il testo che leggo per aumentarne la leggibilità ... come potrei fare con l'effetto pinball?
  • Se l'HTML potesse avere l'elemento <blocklink> con un attributo href che può contenere elementi block-level, inline e anche link tradizionali <a> (ma non altri blocklink) non sarebbe necessario forse ricorrere al DOM e credo disporremmo di altri livelli di interazione sulle pagine web.

Ti consigliamo anche