Introduzione
E' sempre difficile scrivere un articolo in cui si cerca di illustrare un certo lavoro. Come fare per spiegare i miglioramenti che ci sono stati, e che non sono percepibili se non osservando sotto l'apparenza? Iniziamo col ripercorrere brevemente i cambiamenti che hanno portato alla versione precedente a questa (2.2a).

Un po' di storia
C'è sempre un inizio. In questo caso, si chiama www.cicoandcico.atfreeweb.com. La versione 1.0 del mio sito, infatti, era in hosting gratis su Atfreeweb. Lo stile era tutto tranne gradevole, i contenuti riguardavano cazzate, crack e warez. Le pagine erano veramente pesanti, dato che erano generate con Frontpage (il peggior programma esistente per realizzare pagine web, secondo me).
Ad ogni modo, Atfreeweb forniva ottimi server gratis, avevo trovato il modo di scavalcare la pubblicità che mi mettevano, ma dopo un anno hanno deciso di chiudere il servizio. Avevo anche un altro sito, cicoandcico.hypermart.net, ma non supportava l'asp e non avevo voglia di convertire tutto in html.
Dopo più di un anno, ho deciso di creare un nuovo sito, con un nuovo design e nuovi contenuti, nel tentativo di creare uno spazio più ufficiale. Il design era veramente ben fatto secondo me (potete vederlo qui). Come potete vedere, era tutto in vecchio htm, non era assolutamente dinamico, e per ultimo era stato fatto con Dreamweaver, senza toccare, o quasi, il codice "vero". Dreamweaver è un buonissimo programma, ma niente può essere paragonato ad un buon programmatore col suo editor di testo.
Dopo 6 mesi, comunque, ho deciso che era tempo di creare un sito buono sotto tutti i punti di vista, adeguato ad un dominio di primo livello. Così, riprendendo lo stile e i contenuti della versione 2.0, ho messo mano a Kwrite e al manuale di html e di php, ricreando da capo tutte le pagine a mano, con particolare attenzione alla leggerezza e alla compatibilità, senza trascurare lo stile. Ho aggiunto anche, per la prima volta, qualche scriptino php come un contatore da me programmato (CCconter e altro.
Tale versione (2.1), con qualche piccola modifica e correzione, è arrivata alla 2.2a. E' stato nel mese di Febbraio che ho iniziato ad impegnarmi per una nuova radicale modifica, che sicuramente non sarà la definitiva.

Perchè una nuova versione
La versione 2.x del sito non era affatto male, come punto di partenza. C'erano, però, delle lacune abbastanza grandi. Ad esempio, ogni volta che volevo cambiare qualcosina, anche un piccolo particolare, dovevo modificare ogni singola pagina. Figuriamoci fare qualche cambiamento più sostanzioso! Chi ha avuto esperienze con la programmazione, sa quanto sia importante, soprattutto in fase di debug, poter intervenire anche radicalmente sul progetto.
Un'altro motivo, non meno importante, era l'aspetto prettamente estetico. La grafica della 2.x era davvero minimalista; non che questo sia un male, ma alla lunga mi aveva stufato. Ma come cambiare l'aspetto estetico, se dovevo stravolgere ogni singola pagina?

Il progetto - Parte 1: Design
Sono sempre partito con lo scegliere uno stile particolare, e anche questa volta ho fatto così. Ho preso carta e penna e ho disegnato.
Il look con la barra dei menu in alto mi è sempre piaciuto, infatti l'ho sempre adottato in tutte le pagine che ho scritto. Ho deciso perciò di partire dal ridisegnare questa, molto in stile Mac-like.Ho cercato una texture di alluminio in internet e ci ho lavorato sopra.
I primi risultati sono stati abbastanza incoraggianti, quindi ho deciso di percorrere questa strada. Non nego che nella barra ci ho perso un bel po' di tempo, si parla di 2-3 settimane. Il problema, quando si fanno queste cose, è che bisogna sempre stare attenti a:

1. come saranno una volta impaginate
2. come appariranno a risoluzioni diverse: non tutti usano quella per cui la pagina è ottimizzata
3. quanto ci vorrà a caricarle: non tutti hanno il cable!

Usando un bel po' di tabelle nel codice html, comunque, ho raggiunto lo scopo desiderato. Potete vederlo ridimensionando la finestra: la barra si adatta automaticamente alla grandezza della finestra stessa.


Gli elementi che compongono la barra dei menu

Una cosa che odio, infatti, sono quei siti che si vedono decentemente solo a 800x600 o 1024x768, e a risoluzioni superiori occupano neanche 1/10 della pagina in larghezza!
Una volta realizzata la barra ho texturizzato anche il loho Cicoandcico in alto e sono passato ai menu laterali a tendina. Questi erano già stati utilizzati nella 2.0), ma come si può vedere erano davvero pessimi.
Inizialmente ho iniziato con una lunghezza fissa, per poi rendermi conto che stavo facendo il solito errore: come avevo fatto per la barra, li ho resi variabili, di lunghezza pari al 18% della pagina (compromesso tra 1024x768 e 1400x1050, risoluzione di progettazione). Ancora una volta, ho trovato in internet lo spunto decisivo per il disegno della barra che sostiene il menu.
Per quanto riguarda lo sfondo, ho deciso di riprendere il tema principale, preso direttamente dal sito www.apple.com (righe orizzontali grigie), soltanto più scuro. Il risultato mi è davvero piaciuto.
Mi ci è voluto un sacco a far apparire i contorni dei menu in grigio scuro. E' incredibile come le cavolate richiedano un sacco di energie.
Ad ogni modo, sistemato questo, ho proceduto a realizzare la barra in fondo e quel pezzettino in alto che ospita l'accesso per l'amministratore.

Il progetto - Parte 2: Struttura
Una volta terminato il grosso del modello, ho pensato a come renderlo facilmente upgradabile. Chissà perchè non ho pensato prima alla mitica funzione php include();.
L'idea è questa: ogni pagina può essere scomposta in tre parti: un'intestazione, un corpo, e una conclusione. Quello che cambia è il corpo, gli altri due restano quasi fissi. Se in ogni corpo chiamo un include("header"); e un include("footer");, rispettivamente all'inizio e alla fine, questi saranno accorpati al "body", senza che venga meno la possibilità di eseguire codice php in questi ultimi.
Quindi, specificando nel corpo alcune impostazioni, posso passare parametri ai due moduli, che li potranno elaborare.
In questo modo, i due moduli per l'intestazione e la conclusione rimangono sempre gli stessi, per ogni pagina, ed esterni ad ogni pagina! Quindi, modificando questi, modifico tutte le pagine.


Il modello di ogni pagina

Un altro annoso problema, per me, è stata la scelta dei caratteri. Sarebbe bello, infatti, non dover specificare sempre: font size=" ... ", e soprattutto poter cambiare grandezza per tutti i caratteri senza dover cambiare 1000 linee di codice ogni pagina.
Io non ne ero a conoscenza, ma esistono gli Style Sheets (.css). Un unico file contiene informazioni che ogni pagina può usare, specificando:style="..." in un collegamento, tabella, div o cos'altro. Se cambio un numero qui, cambiano tutte le pagine.
Mica scemo chi l'ha inventato.

Qualche strumento utile
Supponiamo che tu non possa usare un client ftp. Come puoi aggiornare qualcosa? Semplice, con un buon site manager, scritto il php e residente sul server. Io uso Invision Power File Manager v1.0.1, che permette quasi ogni sorta di operazione (edit, upload, chmod etc).
E' bello, oltre che utile, sapere cosa usa chi visita il tuo sito, da dove viene, quali sono le pagine più richieste... A tutto questo il mio povero contatore non suppliva (pur faceno egregiamente il suo semplice lavoro), quindi ho cambiato script, scegliendo eKstreme.com PHPCounter VII. Pur non essendo troppo complicato, permette di vedere ogni sorta di informazione.
Due cose molto carine, inoltre sono il Guestbook e il modulo per i sondaggi. Per questi uso Purple Yin Guestbook e SME poll.


La pagina che permette di accedere a queste funzionalità

Prova al banco
Osserviamo quali sono le operazioni da fare per:

1. Creare una nuova pagina
   Prima: prendere il modello, cambiare qua e là alcuni parametri, aggiungere le cose desiderate, uploadare con client ftp.
   Ora: connettersi a internet, entrare nel manager del sito, prendere il modello, cambiare i parametri specificati all'inizio, aggiungere le cose desiderate, salvare il file direttamente on-line.
2. Cambiare lo stile della barra in alto, ad esempio la vorrei più grande
   Prima: per ogni pagina, cambiare alcuni riferimenti (grandezza della nuova immagine, nuovo url etc...), testare il tutto per asicurarsi di non aver fatto errori, updatare ogni pagina via ftp.
   Ora: connettersi a internet, entrare nel manager del sito, uploadare le nuove immagini, modificare i file di intestazione e conclusione, assicurarsi che una pagina funzioni, salvare il file direttamente on-line.
3. Cambiare grandezza dei caratteri
   Prima: per ogni pagina, cambiare ogni font size=" ... ", testare il tutto, updatare ogni pagina via ftp. Ora: connettersi a internet, entrare nel manager del sito,modificare il file .css, salvare il file direttamente on-line.

Un bel risparmio di tempo, credo...!

Compromessi... non tutto è come si vorrebbe
E' la legge che governa tutto. Non tutto è come si vorrebbe, perchè se si fa in quel modo ci potrebbero essere altre conseguenze.
Ad esempio, sarebbe bello poter usare immagini grandi a piacere, senza complicarsi troppo la vita scrivendo codice su codice per ricrearle, ma non tutti hanno il cable.
Sarebbe bello poter mettere un'immagine nello sfondo a tema, ma il problema resta il solito: quanto tempo per caricare?
Sarebbe bello non preoccuparsi della sicurezza, tralasciare autenticazioni etc, ma ci sono bastardi che si divertono a rovinare il lavoro altrui.
Sarebbe bello che tutti avessero lo stesso monitor, mettere grandezze fisse senza preoccuparsi che risultino troppo grandi o piccole.
Sarebbe bello poter usare lo stesso font su tutti i sistemi, ma tanti usano windows, e i font sono a pagamento, quindi non ci sono su linux.
Sarebbe bello poter adattare i font alla risoluzione, ma non si può, quindi si va per la via di mezzo.
Sarebbe bello che tutti parlassero la stessa lingua, almeno non dovrei tradurre ora questo articolo in inglese, e mantenere due versioni linguistiche separate.

Conclusioni
Le mie conclusioni non possono essere che positive... lo sviluppo di questo sito mi ha richesto circa 3 mesi, e seguendo la filosofia Debian (sarà pronto quando sarà pronto)non l'ho messo online finchè non era come lo volevo. E' stato lo sviluppo più longo che mo mai incontrato.
Ma non sono tanto le mie conclusioni che contano, quanto le vostre. E' presente un sondaggio proprio su questo tema, se non avete troppa fretta vi prego di votare.
Per ultimo, eccovi la possibilità di ammirare contemporaneamente le varie versioni (in ordine, 1.0 - 2.0 - 2.x - 3.0)