Chi ha paura dello scrolling orizzontale?
Update!: E’ uscito The Horizontal Way, la mia galleria orizzontale di siti orizzontali.
Presentata come “la più lunga pagina su internet” BlueSfear Worm è un esperimento collaborativo in cui, da fine 2004, delle illustrazioni di vari utenti vengono collegate una di fianco all’altra per formare un lunghissimo “baco” artistico.
La visione dell’ immagine, disposta in larghezza, è quindi nelle mani di un template a scrolling orizzontale che implica nel lettore l’inusuale utilizzo della leva che si muove da sinistra verso destra.
La prima cosa che mi è venuta in mente è stata: perchè devo considerare “inusuale” un tipo di lettura che faccio normalmente con un qualsiasi giornale? Perchè questo tipo di siti non hanno mai preso il decollo?
Ho cominciato così a cercare nella mia cache personale tutti i siti con scrolling orizzontale che ricordassi, approdando per primo al Dmitry Kirsanov segnalato dal Cavedoni almeno una ventina di anni fa.
Quindi, questo thread del forum di Sitepoint mi ha fatto visitare:
- il Portfolio di Blue Sky Marcom
- il “Portfolio Wall” di sone-pl
- la rivista modular people
Caratteristica comune di questi e dei primi due sopra sono:
- l’unico scopo è presentare delle immagini e non del contenuto scritto
- il layout è a tabelle e quindi…
- …si ha completa mancanza di accessibilità e problemi con la stampa
L’esistenza di un sito orizzontale -soprattutto orientato ai contenuti- dovrebbe quindi passare attraverso una costruzione con layout in CSS: la separazione di struttura e presentazione potrebbe costituire la soluzione ad alcuni problemi.
Lo stesso thread suggerisce quindi:
un sito in CSS che dispone le sue colonne una di fianco all’altra attraverso il posizionamento assoluto.
Anche lo Zen Garden propone 8 stili con fanno di certo sfigurare lo scrolling orizzontale:
che posizionano indistintamente i div in cui è inserito il testo in assoluto o attraverso l’uso del float.
Come sapete, lo Zen Garden è solo una pagina dimostrativa, è come tale il suo contenuto non cambia e non contiene collegamenti ad altre pagine.
Per ovviare a questo problema (credo) un tema per WordPress Horizontal Theme utilizza il javascript
per posizionare il testo in più colonne che, non dipendenti dalla lunghezza di un testo, verranno fatte scorrere in senso orizzontale senza il movimento della barra inferiore del browser.
Ora: chi è assolutamente contro alzi la mano.
Compresi voi, tanti e tanti compresa la maggioranza degli utenti del thread, che tirano anche in ballo la Top Ten Web-Design Mistakes of 2002 di Nielsen.
C’è, comunque, chi dice:
My first website, in 1996, was horizontal scrolling experience. It was a shopping site where one would stroll (scroll) along the street to visit various shops and boutiques.
Done right, horizontal can be quite comfortable to live with.
Ma mi chiedo ancora: perchè ancora cosi pochi hanno utilizzato o utilizzano i template orizzontali, anche se per semplici presentazioni di immagini, showcase o pagine con piccoli testi?
Voi cosa ne pensate?
Vedi anche: Orizzonthash.
Ti segnalo anche questo.
Anche io ritengo i layout orizzontali una soluzione innovativa ed originale ma troppo sottovalutata. Mi sembra inoltre anche più accessibile ed usabile.
Il primo che hai segnalato è meraviglioso.
Secondo me vanno bene solo per delle nicchie di contenuti particolari, come quello nell’esempio.
grazie qbic!
skid, quello che non ho capito è come fanno a stabilire l’ordine in cui una persona deve continuare: se modificano la stessa immagine in tredici contemporaneamente ? Si tratta di una risorsa condivisa, quindi deve essere per forza gestita in mutua esclusione. (sì, è
lunedìmartedì)[...] Stamattina mi sono svegliato con uno strano dubbio geometrico: quale termine si utilizza per indicare lo scambio delle coordinate x e y di un piano cartesiano? Non avviene una traslazione ma…Uhm, non ricordo. E’ comunque quello che ho pensato di fare modificando il Tiny Scrolling per l’utilizzo in quei particolari layout che prevedono uno scrolling in orizzontale: forse ricordete questo vecchio post. Un script che dopo un brainstorming di sei ore con il mio team di comunicazione ha preso il nome “Horizontal Tiny Scrolling”. (il coniglio Gegio aveva proposto all’inizio “Il lungo cammino verso l’Est”, soluzione valida per le prime due ore e quaranta) Non starò a tediarvi come durante lo scorso post, anche perchè il funzionamento dello scrolling morbido è sempre riassumibile in un paio di righe: lo script cerca nella pagina un link interno (con un ‘#’), controlla la posizione della meta da raggiungere e fa uno scroll verso di questa ad una velocità variabile, in sostituzione del consueto disorientante salto diretto. Questa volta naturalmente il movimento sarà da sinistra verso destra, e viceversa. Come vedete nell’esempio online, per una “pagina tipo” ho disposto i paragrafi uno accanto all’altro applicandogli la proprietà float; al click di uno dei link interno lo scroll farà bloccare il paragrafo richiesto in corrispondenza dell’estremità sinistra della pagina. (si potrebbe aggiungere l’illuminazione temporanea dell’elemento interessato tramite la Fade Anithing Technique). L’altezza del container, 509px, è quella che ho calcolato massima per evitare il comparire della barra di sinistra che complicherebbe ulteriormente l’usabilità. Il contesto è quello di un browser la cui altezza della pagina è limitata dalla presenza in contemporanea, ad esempio, di una web developer toolbar, una barra dei bookmark, ed un’altra toolbar come la Google- o la MozBlogBar. Oltre al diverso funzionamento dello “scrollTo” le funzioni non riguardano più posizione Y relativa, altezza di pagina e finestra, ma naturalmente posizione X e larghezze. (vedi qui) Un piccolo extra che ho aggiunto è lo scrolling della pagina tramite il mouse (come una normale pagina verticale) che sfrutta il movimento della rotellina come evento DOM: [...]
Salve,
sono un webdesigner e volevo segnalarvi il mio piccolo sito basato sul plugin per jQuery SerialScroll che mi ha permesso di organizzare il sito con uno scroll verticale e la sezione porfolio con uno scroll orizzontale.
Concordo con il fatto che questa tecnica, effettivamente poco usata e anche un pò “datata”, può risultare ancora affascinante e avere un certo appeal.
Grazie per la segnalazione Fabrizio! :-)
segnalo anche io un personale tentativo di sito in orizzontale:
http://www.veenrandi.com
hem… http://www.venerandi.com
Esite una ragio storica per la preferenza dello scrolling verticale. Segue l’andamento della mappatura in memoria del video e quindi occupa molto meno tempo ad essere processato rispetto al corrispettivo orrizontale… questo ancora dai primi windows XD