Six Revisions è, come indicato nella dicitura principale, un blog che fornisce utili informazioni per i Web Designers ed i Web Developers. Ma in realtà è molto di più: tutorial tecnici, tutorial grafici, segnalazioni importanti, consigli pratici, recensioni di script e tool, presentazione di applicazioni e molto altro ancora.

Da questo famosissimo blog in lingua americana ho ricavato parecchie tecniche e suggerimenti utili tanto da esserne stato favorevolmente affascinato.

L’autore di Six Revisions Jacob Gube ed io abbiamo attuato una collaborazione riguardo alla scrittura di un tutorial sulle meccaniche di moo.rd, dalla quale è stato positivamente colpito a sua volta.

Nel tutorial denominato Using moo.rd to Create Image Galleries, oltre ad …

Inizia oggi la saga dedicata alla versione 1.2 del framework MooTools con una grandissima risorsa: un’intervista ufficiale al team leader nonchè creatore e svilippatore della libreria: Valerio Proietti.

Le domande che ho rivolto a Valerio (kamicane per gli amici ) riguardano la sua crescita in qualità di sviluppatore Javascript e di conseguenza la crescita e lo sviluppo di MooTools, per poi passare all’analisi delle novità presenti nell’ultima release (la cui uscita è ormai agli sgoccioli) , fino ad arrivare alle prospettive future.

All’interno dell’articolo dunque, trovate tantissime curiosità e consigli tecnici direttamente da chi ha creato il codice

…

Appuntamento con HTML.it con l’ultimo tutorial dedicato alla versione 1.1 di MooTools, nella quale vengono analizzati gli strumenti che il framework ci offre per effettuare il dragging di elementi.
Come di consueto, descrizioni dettagliate dei costruttori, Drag.Base e Drag.Move, con tutti i parametri, le opzioni ed i consigli di utilizzo costituiscono la parte teorica dell’articolo.
Per la parte pratica ho preparato due applicazioni:

• Drag Events mostra come registrare gli eventi che vengono azionati rispettivamente all’inzio, durante e al completamento del dragging
• Drag&Drop è un’applicazione di drag&drop in cui è possibile trascinare l’elemento all’interno di un contenitore che cambierà

…

Torna l’appuntamento con la mini-guida per usare GeSHi,  un pò in ritardo, dovuto a moltissimi, o meglio innumerevoli impegni (uno di questi è moo.rd).
Ovviamente la potenza di GeSHi sta nella creazione di una sintassi colorata per i nostri file, non solamente per le piccole stringhe.
La funzione che ho creato come esempio permette di aprire un file, che gli viene passato per parametro, e restituire l’istanza del costruttore GeSHi.
Vediamola:

1
2
3
4
5
6
7
8
9

function js_code($name) {
  $file = fopen($name, 'r');
  $txt = fread($file, filesize($name));
  fclose($file);
 
  $language = 'Javascript';
  $code = new GeSHi($txt, $language);
  return $code;
}

In questo modo la funzione restiruisce la variabile $code che altro non è che l’istanza del costruttore …

In questa mini-guida di tre parti vedremo come utilizzare GeSHi (Generic Syntax Highlighter), un software completamente scritto in PHP da Nigel McNie.
GeSHi è un prodotto straordinario che permette di "colorare" una stringa, o meglio ancora un file di testo, secondo le parole chiave che vogliamo e gli stili CSS desiderati: è perfetto per creare il cosiddetto Syntax Highlight.

Potete vedere subito un esempio in tutte le demo di moo.rd, dove utilizzo GeSHi per colorare il codice sorgente.

Download di GeSHi
Per scaricare GeSHi, (ricordo che è rilasciato sotto licenza GNU GPL) recatevi alla pagina principale del sito e cliccate nella sezione download: scaricate l’ultima release stabile da sourceforge.
Ora non vi …

Le Navigation Tabs sono sempre più in voga nei siti di ultima generazione, soprattutto quando sono basate su liste di links orizzontali. Permettono una navigazione semplice ma allo stesso tempo elegante.

La tecnica che vi mostro oggi mette in pratica la creazione di queste liste, le Sliding Fluid Tabs,  ovvero liste a contenuto fluido. Il vantaggio principale è che non ci sono limiti di spazio, il testo delle tabs può essere lunghissimo, corto o variabile: si otterrà sempre lo stesso effetto. In aggiunta, non occorre utilizzare immagini di grandi dimensioni come accade in molte altre tecniche, e le righe CSS necessarie sono davvero poche.

Prima di presentarvi questa tecnica (il cui nome e implementazione sono da me inventati)

…

In questo articolo vediamo come creare degli alert sempre differenti l’uno dall’altro utilizzando il costruttore Custom.Alert di moo.rd.
Per portare a termine questa applicazione correttamente, è necessario creare un foglio di stile css con tanti stili quanti sono i differenti alert che vogliamo creare, nel nostro esempio sei.
Ricordo che per creare degli stili appropriati per i Custom Alert, è necessario creare tre classi: alerthead, alertbox e alertbody. (per maggiori informazioni)

Dato che i nostri alert saranno sei, dovremo creare 18 classi:

• ‘ab1′, ‘ah1′, ‘abd1′ per il primo alert (dove la prima classe è per alertbox, la seconda per alerthead e la terza per alertbody)
• ‘ab2′, ‘ah2′, ‘abd2′ per

…