Progressive enhancement

A volte mi chiedo se le tecniche di buona programmazione siano applicabili nel mondo reale.

Al momento mi sto dedicando a creare un nuovo ramo del mio sito, essendo esso un frutto delle mie personali fissazioni (cfr. “orizzontale è più leggibile”) i requisiti sono:

• la pagina non deve avere alcuno scroll verticale a nessuna risoluzione
• essere integrato con i vari social network
• avere la possibilità di commentare i post (no, non è un blog)
• ajax dappertutto perchè a me non piace ricaricare la pagina
• essere usabile

Questi paletti che ho posto al progetto complicano tutto, perchè se da un lato quello che deve fare la pagina è una banalità (lo vedrete) far interagire tra loro i 5 punti precedenti complica orrendamente la faccenda.

Siccome sono pigro e non voglio perdere un sacco di tempo a correggere bug e ad aggiungere funzionalità a “oggetti” non predisposti a riceverle questa volta ho deciso di non commettere l’errore di farmi trascinare nel programmare la funzione più interessante per poi aggiungervi “metastasi” che per funzionare richiedono trucchetti e difettano di solidità.

E’ qui che entra in scena il “progressive enhancement” di cui si legge tanto in giro e che sto applicando per step:

1. creazione della pagina statica (html/css)
2. dinamicizzazione della pagina lato server (php)
3. aggiunta di ajax (javascript/jquery)

1. creazione della pagina statica (html/css)

Tenendo in mente che la pagina non deve avere alcuno scroll verticale ho scelto di progettare il layout con tutte le dimensioni espresse in em utilizzando font-size:16px ed un’altezza della finestre di 649px in modo che nel punto 3 del progetto con il javascript dovrò cambiare solo il font-size del body per ridimensionare tutto.

E come ben sapete progettare un layout in em è un bagno di sangue (anche se ho trovato un buon sistema che avrà un post in seguito) ed un po’ di tempo è andato.

2. Dinamicizzazione della pagina lato server (php)

Lasciando (ovviamente) inalterato il layout il contenuto della pagina viene creato dinamicamente da funzioni php che restituiscono i dati in base ai parametri ricevuti in $_GET dai link, quindi nella pagina vengono inseriti tutti i necessari controlli di flusso

3. Aggiunta di ajax

A me l’ajax piace tanto, infatti oltre a far figo nel mio curriculum aggiunge una dimensione fluida alla navigazione che a mio avviso migliora la fruibilità (meglio una gif “loading” o la cesoia della pagina bianca con la clessidra che gira?).

Le funzioni richieste al js sono:

• cambiare il font-size del body in funzione della dimensione della finestre (in questo caso: $(window).heigth()/40 (jquery)
• intercettare i click dell’utente sui link e trasformali da “hey browser segui quel link” a “hey browser XMLHttpRequest con questi parametri“.
• segnalare all’utente che le sue azioni intercettate dal js non sono cadute nel niente, ma stanno eseguendosi

Se siamo tutti d’accordo nel dire che un progetto web sviluppato da un professionista richiede (almeno):

• una totale separazione tra layout, contenuto e codice, perchè così ognuno fa il suo mestiere senza disturbare gli altri (l’epoca del one man show sul web è finita assieme agli anni ’90)
• “graceful degradation“, perchè nel 2008 ancora qualcuno gira con javascript e flash disabilitati (paranoici!)
• mantenibilità nel tempo, perchè non vogliamo mettere noi stessi ed in nostri colleghi in difficoltà tra 3 mesi vero?

scopriamo che i 3 step elencati sopra ci consentono di ottenere quasi automaticamente queste 3 caratteristiche, infatti la graceful degradation è garantita dal fatto che ogni strato è stato programmato in maniera da funzionare autonomamente, la mantenibilità è garantita dalla progettazione che abbiamo dovuto per forza fare per separare gli strati mentre la totale separazione è garantita solo se abbiamo fatto i bravi nella costruzione delle funzioni php (se parliamo di me diciamo che ancora non sono un campione in questo).

Ecco descritto quindi il progressive enhancement in salsa lghinelli, nel mio progetto e nel mio tempo libero sta funzionando ed anche bene, ma quanto tempo ci vuole in più a sviluppare un progetto in questo modo?

Non ne ho idea, ma  sono quasi sicuro non ci voglia del tempo in più, a patto che tutte le persone coinvolte nel progetto siano concordi nell’applicare il metodo e perciò non cerchino scorciatoie facili.

Il problema è quindi squisitamente umano piuttosto che tecnico:

saranno disposti i membri del team di sviluppo a modificare le abitudini che si sono incrostate in una vita?

E sarà disposto l’uomo che sgancia i soldi ad investire nella formazione sapendo che sicuramente il primo progetto sviluppato in questo modo avrà degli intoppi?