Nel mio quotidiano peregrinare in ambito seo, mi sono imbattuto nell’ennesima gara di posizionamento sui motori di ricerca: dopo i velocipedi equestri, i fattori arcani, i phpisti malvisti, il globalwarming awareness2007, e tante altri seo-contest con sfumature che vanno dal serio-serioso fino ad arrivare al faceto, pare sia il momento del funzino apocrifo, gara di posizionamento sui motori di ricerca promossa in ambito universitario.

…La prima cosa che mi ha incuriosito è dovuta al software utilizzato per realizzare il sito stesso: si tratta di RapidWeaver (lo stesso utilizzato per Sbrana.com e del quale ho già parlato in una o due occasioni). La seconda cosa che mi ha sorpreso del sito di cui vi sto parlando è la home page, forse un po’ troppo sviluppata in verticale ma poco male: gli autori hanno utilizzato il plugin PageToc di Eike Preuss grazie al quale, cliccando sulle intestazioni poste in un menu completamente personalizzabile, l’utente viene automaticamente portato alla parte di contenuto di suo interesse.
Come è facile intuire, questa soluzione risulta oltremodo comoda nel caso di pagine particolarmente lunghe -come alcune landing page- o addirittura per siti monopagina organizzabili in topic, visto che si evita all’utente di dover scrollare la pagina del browser rischiando pericolosi incidenti con la rotella del mouse.

…Iniziando ad aprire i cassetti della memoria -e andando ad espldere una buona parte dei bookmark di Firefox, trovo la pagina di presentazione di K+ realizzata da Stuart Delta (ma prima non si chiamava X+?

…Ma ho promesso che non avrei parlato di seo: vediamo come realizzare una pagina con scrolling fluido con PageToc: 1) scaricare e installare il plugin PageToc di Eike Preuss, 2) aggiungete quindi una pagina “Styled Text with Table of Contents” al vostro progetto RapidWeaver, 3) dal tab “modifica” cliccate su “setup” (in basso a destra, come la maggior parte dei menu “imposta” di RapidWeaver) impostate il menu delle vostre intestazioni: potrete infatti decidere la loro dimensione, il loro posizionamento all’interno della pagina e quant’altro in modo molto semplice, in caso di dubbi potete far riferimento alla documentazione fornita da Eike, 4) otterrete quindi una pagina abbastanza simile a questa, 5) per implementare lo smooth scroll occorre scaricate le le classi javascript rilasciate sotto MIT-style licenze sulle quali ha lavorato Stuart (che non smetterà mai di stupirmi per l’eclettica preparazione e genialita’) utilizzando la libreria di effetti in javascript Moo.fx creati da Valerio Proietti di Mad4Milk. Ecco le classi da scaricare: classes.zip, 6) decomprimete lo zip, e caricate la cartella “classes” nella stessa directory che contiene la pagina sulla quale volete ottenere l’effetto “smooth” (spero non occorra spiegare come caricare una cartella via ftp), 7) ultimi due step: occorre richiamare le classi cartella “classes” appena caricata nell’head della pagina da “smoothare” realizzata con PageToc. Per farlo potete andare a modificare il tema (comunque prima fatene una copia) o semplicemente modificate la pagina in questione, prima o dopo la sua pubblicazione, anche con un semplice editor di testo (Smultron, TextWrangler & so on).

…la velocità dell’effetto scrolling è personalizzabile; per farlo è sufficiente andare a modificare il file “m4m.set.js”, presente nella cartella “classes” che avete caricato sul vostro sito: con un editor di testo individuate il parametro “duration” -settato di default a 800- e divertitevi a sperimentare: a 8000 fate in tempo a vedervi “Via col Vento” in versione integrale.

…Forse nel caso specifico di pesce apocrifo avrei preso in considerazione un’applicazione un po’ diversa di questo javascript (i link che portano allo scrolling non sono così visibili), ma il risultato rimane innovativo e dinamico…

altri post che ti potrebbero interessare: