Come nasce un sito web Joomla: piattaforma, struttura e grafica
Sito dinamico o Sito statico? quale scegliere
Il sito statico è amministrabile solo da uno sviluppatore che ha conoscenze di html e altri linguaggi di sviluppo e che accede direttamente ai file per le modifiche tramite un sistema chiamato FTP (File Transfer Protocol). È possibile in tal modo lavorare sul proprio pc per poi trasferire in file in remoto nel server che ospita il sito.
Il sito dinamico è basato su una tecnologia di sviluppo più complessa ma ha il vantaggio di poter essere amministrato direttamente dall'utente finale senza che quest'ultimo abbia conoscenze tecniche particolari. Per la gestione è tuttavia necessaria una competenza informatica di base paragonabile almeno a quella necessaria per la videoscrittura con programmi tipo Microsoft Word.
Noi ci occupiamo principalmente dello sviluppo di siti dinamici. I siti statici sono sostanzialmente in disuso e adatti a rappresentare attività che non richiedono frequenti aggiornamenti e per i quali è comunque necessario rivolgersi ad uno webmaster. Dal web 2.0 in poi, cioè dall'evoluzione del World Wide Web che ha rivoluzionato, soprattutto attraverso i blog e i social network, il modo di interagire con la rete rispetto alla fase storica precedente, è ormai un must poter gestire in prima persona i propri contenuti.
I siti dinamici sfruttano linguaggi di sviluppo e di programmazione come html, xml, php, asp, javasript, css ecc. e possono essere realizzati "da zero" come un abito su misura oppure attraverso dei CMS (content management system) cioè sistemi di gestione dei contenuti.
"Da zero" è inserito tra virgolette perché spesso e volentieri (e quando possibile) gli stessi programmatori utilizzano, o riutilizzano adattandoli, blocchi di codice relativi alle funzionalità più ricorrenti nelle nostre pagine web. I siti dinamici sono amministrabili in remoto, cioè direttamente in rete, attraverso un pannello di controllo che in caso di esigenze particolari può essere realizzato ad hoc da un programmatore mentre nei casi più comuni fa parte del CMS.
Principali cms e Joomla
I CMS più diffusi sono basati su tecnologia "Open source" cioè con il codice "aperto" e ne esistono di diversi tipi liberamente scaricabili dalla rete e "pronti per l'uso" ma i più utilizzati sono sostanzialmente tre:
Wordpress - Drupal - Joomla
WORDPRESS è un CMS particolarmente adatto per i blog anzi possiamo dire che la sua struttura da blog è nativa. Ha una struttura meno complessa degli altri due e un'interfaccia grafica abbastanza intuitiva. È infatti abbastanza utilizzato nel "fai da te" essendo probabilmente il precursore del web 2.0 ma la sua struttura non è particolarmente adatta alla creazione di siti complessi. La sua linearità e snellezza può conferire un aspetto molto elegante alle pagine, soprattutto se la grafica è curata. La veste grafica di un sito wordpress si crea con i template (modelli grafici), liberamente scaricabili dalla rete nelle versioni free o acquistabili nelle versioni pay generalmente più accattivanti.
DRUPAL sinceramente è quello che conosco meno: l'ho provato una volta e ciò che ho sempre letto di questa piattaforma non ha fatto che confermare la sensazione avuta al primo utilizzo: interfaccia grafica ostica. È ritenuto non a caso uno dei CMS meno facili da utilizzare benché dalla grandi possibilità in termini di prestazioni, scalabilità e sicurezza. Adatto per organizzare grandi quantità di dati ma non indicato per siti di una certa complessità.
JOOMLA è probabilmente una sintesi dei due sistemi precedenti oltre ad essere uno dei CMS più diffusi in assoluto. È sicuramente il mio preferito, oltre ad essere quello che conosco meglio, ed è anche per questo che ne parlerò in modo più approfondito e dettagliato. Per inciso, il presente sito è realizzato con CMS Joomla.
Solo alcune delle più importanti caratteristiche di Joomla (fonte Wikipedia): → Alto grado di personalizzazione grazie alle numerose estensioni moduli, componenti e plugin (vedi più sotto) disponibili sia come software libero che con altre licenze;
→ Funzioni di Search Engine Optimization, per facilitare l'indicizzazione dei contenuti da parte dei motori di ricerca;
→ Versione stampabile delle pagine;
→ Esportazione delle pagine in formato PDF;
→ Pubblicazione tipo Blog;
→ Sondaggi;
→ Ricerca testuale su tutti i contenuti inseriti;
→ Localizzazione internazionale, che permette la traduzione di ogni funzionalità del software nella propria lingua;
Ma il vero punto di forza di Joomla sono le estensioni cioè pacchetti di funzionalità aggiuntive che si distinguono tra moduli, plugin e componenti. Solo per citarne alcune: Calendario eventi, Gestione video, Mailing list, Slideshow, Gallery, Google map, Carrello E-commerce, Social bookmarking e tantissime altre di cui avremo modo di parlare più avanti...
Installare e configurare joomla
PREREQUISITI
Per avere un proprio sito web è necessario anzitutto registrare un dominio presso un ISP (Internet Service Provider) e acquistare un pacchetto di hosting cioè uno spazio server in cui caricare il file system di Joomla
REQUISITI DI SISTEMA
→ Server con sistema operativo LINUX e piattaforma server Web installata e funzionante come Apache
→ Linguaggio di scripting PHP
→ Sistema di database MySQLì;
INSTALLAZIONE
Scaricate l'ultima versione del software da Joomla! 3 da joomla.it decomprimete i file nella cartella principale del server web. D’ora in poi, tutto procederà velocemente, perchè l’installer di Joomla! vi guiderà passo dopo passo. Andate all’indirizzo del vostro sito web (ad esempio tuosito.it) e partirà l'installazione guidata.
ACCESSO AL SISTEMA
Joomla ha due modalità di accesso al sistema: uno front-end con accesso diretto alla modifica delle pagine e l'altro back-end tramite pannello di controllo. Entrambe gli accessi richiedono un login di autenticazione che permette l'accesso in base ai privilegi concessi dall'amministratore ad es. Author, Edithor, Publisher, Administrator ecc. che permettono livelli di intervento più o meno esclusivi sulla gestione dei contenuti a seconda che si tratti di pubblicazione, modifica, cancellazione o interventi di sistema più articolati e complessi.
L'accesso front-end è più semplice e intuitivo ma limitato in diverse funzioni ed è generalmente utilizzato dal titolare del sito per amministrarne i contenuti. L'accesso back-end è più impegnativo e oltre a permettere la gestione completa di tutti i contenuti trattabili front-end, consente di intervenire corposamente sulla struttura del sito modificandone l'architettura, l'aspetto e le principali funzionalità. Per questo le funzioni più avanzate come ad es. la modifica del template, la gestione dei menù, l'installazione di un plugin o l'eliminazione di un modulo risulteranno più congeniali ad uno sviluppatore piuttosto che ad un utente novizio.
CONFIGURAZIONE
Poiché questo aspetto è uno dei più complessi si rimanda a questo interessante articolo postato da un utente della Joomla community: configurazione sito joomla
Articoli e video guide su JOOMLA 3
La grafica di un sito Joomla ovvero il suo aspetto estetico
Ed eccoci finalmente - anche se a grandi salti - alla grafica del sito. Croce e delizia del web designer. Oltre che la parte probabilmente più interessante per il cliente e la più gratificante per l'autore. Perché la grafica è come una vetrina: deve valorizzare il tuo prodotto. O se preferisci è come un abito: te lo devi sentir bene addosso.
Per quelli più esperti che volessero andare subito al sodo,
diciamo subito che la grafica di un sito joomla si realizza con il template.
Qui troverete tutto ciò che avreste sempre voluto sapere sui template
e non avete mai osato chiedere.
IL TEMPLATE JOOMLA
Per quelli che invece fossero interessati ad approfondire l'argomento, apriamo prima una parentesi, con una piccola digressione rispetto all'argomento trattato, in cui cercherò di spiegare con l'esempio che segue la fascinazione e al contempo la complessità che sta dietro all'aspetto grafico di un sito web joomla.
Che fate quando dovete comprare una giacca, un paio di pantaloni, una felpa, un cappello, un paio di scarpe? Immaginate prima il modello e poi andate in giro per negozi sperando di trovarlo uguale? Oppure andate da un sarto e gli descrivete l'oggetto del desiderio sperando che lui lo interpreti e lo confezioni tale e quale? Oppure - se siete bravi a disegnare - gli portate uno schizzo con la vostra bozza? Diciamo che in linea teorica è possibile ma nella realtà è abbastanza inusuale. Non mi intendo di moda ma immagino che tale strada sia percorribile per un capo classico come un abito o un tailleur che seguono canoni estetici abbastanza prestabiliti e in cui ciò che sostanzialmente conta è la vestibilità su misura e la scelta della stoffa. Ma non per tutto il resto.
Quindi che fate? Naturalmente andate in giro per negozi per trovare ispirazione... Potete sbirciare le nuove collezioni nelle vetrine del prêt-à-porter o a seconda della capienza della vostra carta di credito negli show-room di alta moda. Oppure informarvi su offerte, promozioni e saldi. In ogni caso, ciò che vi piacerà o meno, è già stato stabilito da altri.
Spero che l'esempio appena riportato renda l'idea di cosa significhi per un web designer creare da zero un concept, cioè un'architettura, un racconto e soprattutto una veste grafica che descrivano al meglio, attraverso un sito web, la personalità del soggetto o l'immagine pubblica dell'attività che intenda rappresentare. E in cui il cliente possa riconoscersi al punto tale da sentirlo suo e indossarlo come un abito.
Layout di un sito Joomla e preparazione bozze - premesse
Esistono diversi metodi per affrontare il concept di un sito e in particolare il layout grafico. Ognuno ha il suo e vedremo in dettaglio quali sono i più comunemente usati. Diciamo subito che predisporre delle bozze da far selezionare al cliente non è l'unico metodo, né a mio avviso il migliore, per agevolarlo nella valutazione di un layout grafico ma questo lo vedremo meglio in seguito. Di sicuro il cliente deve essere messo in grado di orientarsi sulla scelta più appropriata alle proprie esigenze e desideri. Ma se da un lato è corretto illustrare una rosa di possibili soluzioni, dall'altro è ragionevole pensare che tale percorso debba essere snello e produrre in tempi ragionevoli un risultato certo. Ciò per evitare insidiose dispersioni di energie dovute all'indecisione o impreparazione del cliente o a carenze del progettista nell'interpretarle e indirizzarle correttamente.
NOTA: Le proposte grafiche presentate al cliente non potranno che essere necessariamente indicative e dare un'idea di massima del concept che si intende sviluppare. Questo perché l'aspetto grafico del contenitore sarà fortemente influenzato dal tipo e dalla qualità dei contenuti del sito: immagini, testi, elementi grafici, fotografie, animazioni ecc. che fanno parte della progettazione vera e propria non sempre immaginabile nella sua complessità in fase di stesura preliminare delle bozze.
D'altronde pretendere che una bozza sia un'anteprima completa ed esaustiva del risultato finale è come andare in un negozio e farsi disegnare e confezionare una serie di abiti per poi provarli tutti, selezionare quello che si preferisce scartando gli altri che però sono stati ideati, disegnati, cuciti e fatti provare. La cosa tuttavia non è teoricamente impossibile... ma questo lo vedremo dopo se avrete la pazienza di seguirmi ancora.
Redazione bozze layout sito web Joomla - Mockup
MOCKUP: SIMULAZIONE PAGINE WEB CON SOFTWARE GRAFICO
Consiste nel simulare in formato immagine la schermata della homepage, che in un sito web è la pagina più significativa dal punto di vista dell'impatto grafico ed emozionale. Chi crea la bozza non dev'essere necessariamente il web designer. Capita che se non occupi una terza figura, il grafico, il quale dispone gli elementi della pagina secondo il proprio gusto o interpretando quello del cliente. Si crea una grafica per la testata, per i menù, il corpo della pagina, la tipografia, i colori ecc. cercando di caratterizzare la composizione con un stile unitario e coerente.
La realizzazione della bozza ha un impegno intrinseco che può richiedere da una a diverse ore a seconda della padronanza del software di grafica utilizzato (Photoshop, Gimp, Illustrator, Inkscape ecc.) e del talento creativo del grafico. Ma sarà necessariamente "usa e getta" in quanto immagine statica non spendibile in altro contesto. Ovviamente l'impegno si moltiplica per il numero di bozze che si intende presentare al cliente.
Il vantaggio di questo metodo è probabilmente la libertà di creare da zero un idea grafica partendo dal “foglio bianco” salvo poi misurarsi con i vincoli dell'html per trasporla in pagina web. Generalmente è il metodo a cui ci si affida quando il layout grafico è creato da un grafico puro che passa poi il layout ad uno sviluppatore. Il vantaggio è spesso una “freschezza compositiva” che nasce dal fatto di lavorare in libertà senza curarsi delle problematiche relative alla sviluppo web.
Lo svantaggio più importante è spesso la difficoltà del cliente di valutare una simulazione statica di una pagina web che nelle versioni più accattivanti sarà ricca di animazioni ed effetti; sia al passaggio del mouse, sia con lo scrolling (scorrimento) della pagina: slideshow con effetti di transizione, megamenù che si attivano al passaggio del mouse, 
splitmenù, dropdown, box che si ingrandiscono o collassano durante lo scorrimento. Insomma tutti quegli effetti che rendono un pagina web moderna, viva e pulsante.
Un altro svantaggio importante è che se il grafico non conosce le problematiche relative alla sviluppo web, la bozza potrebbe incontrare ostacoli in fase di sviluppo web e richiedere modifiche importanti o interventi di un programmatore per adattarla al codice di sviluppo. Se il grafico che realizza il layout è invece anche uno sviluppatore, farà il possibile per comporre il layout secondo i canoni del web. Compatibile cioè con la struttura modulare di una pagina web.
Un altro svantaggio è il costo che potrebbe incidere in misura importante in base al tempo dedicato alla cura delle bozze e al numero delle stesse. A seconda ad es. che si tratti di una singola proposta per la home e le principali pagine interne o più proposte per entrambi.
Realizzare layout e grafica sito Joomla con un Template Maker
Template maker: Software dedicato
I template maker sono dei software grafici orientati alla progettazione dei template, cioè dei modelli grafici da applicare ai contenuti come delle skyn. Una delle caratteristiche più apprezzate di joomla infatti è la separazione dei contenuti dalla grafica e la possibilità di poterli gestire separatamente senza che le modifiche della veste grafica interferiscano con i contenuti del sito. in joomla è infatti possibile installare un numero indefinito di template e applicare, selezionandolo dal pannello di controllo, il template preferito cambiando con un click l'aspetto grafico dell'intero sito. Non solo, è anche possibile assegnare diversi template a diverse pagine o creare diversi layout, cioè diverse strutture di pagina con lo stesso template e assegnare ad ogni pagina quello preferito.
Di template maker ne esistono diversi, alcuni gratuiti altri a pagamento. Il più noto è sicuramente Artisteer, molto potente e abbastanza intuitivo da utilizzare, permette di modificare praticamente tutte le sezioni di una pagina web (sfondo, layout, foglio, header, menu, articoli, barre laterali, bottoni, etc.) oltre ad offrire diversi modelli di template già pronti per l'utilizzo o modificabili in ogni loro parte.
Questo strumento è sicuramente un'alternativa valida
se non si vuole ricorrere al mockup di un grafico esterno o a lunghe sessioni in photoshop.
Il software è in continua evoluzione anche se a mio avviso
ha ancora dei limiti importanti.
I più importanti vantaggi di Artisteer sono la facilità di utilizzo grazie al suo editor che ha un'interfaccia grafica molto simile a quella di Microsoft Word, la possibilità di creare un template partendo completamente da zero o utilizzando come base dei modelli preconfezionati con la possibilità di trasformarli radicalmente o modificarne selettivamente solo le sezioni interessate. Un'altra funzione importante è la possibilità di esportare i template per diversi cms, ad esempio Wordpress, Drupal oltre che naturalmente per Joomla.
Un' altra possibilità offerta da Artisteer è quella di poter utilizzare un mockup come traccia su cui "ricalcare" le sezioni della pagina. In questo caso si crea prima l'immagine in photoshop, si imposta come sfondo e poi ci si creano sopra i moduli. In questo modo si utilizza Artister per trasporre un'immagine statica nel codice che genererà il file system del template, in particolare i fogli di stile a cascata CSS.
Lo svantaggio che personalmente sento più penalizzante è una certa rigidità compositiva che, nonostante l'infinita combinatoria degli elementi, rende un template creato con Artisteer abbastanza connotato e riconoscibile. Soprattutto se si utilizzano profusamente gli elementi grafici proposti dalle librerie di Artisteer. Effetto in parte superabile se si parte da zero utilizzando come base un template vuoto.
In questo caso però ci si renderà conto che non è così banale (per via della complessità del programma), creare un concept grafico da zero. Perché (è bene sottolinearlo), il software è facile e intuitivo ma le varianti in gioco sono veramente tante. E questo può disorientare i meno "smanettoni".
Cos'è un framework
Un CMS ha una struttura complessa. Basti pensare che una installazione di joomla può contenere decine di migliaia di file e cartelle. Il presente sito contiene circa 5000 cartelle e quasi 19000 file.
La grafica di un sito web è generata dai un cosiddetti fogli di stile a cascata CSS (Cascading Style Sheets). Qualsiasi intervento di modifica della grafica di una pagina web deve passare attraverso la modifica di una pagina di codice particolarmente complessa.
Per non parlare delle animazioni, della dimensione e della struttura della pagina, cioè del layout che deve gestire i contenuti in modo fluido. Potendosi cioè adattare alla geometria e alla dimensione degli schermi di diversi dispositivi: pc, tablet, smartphone. Oltre che al loro orientamento orizzontale/verticale nel caso di periferiche mobili.
Uno degli strumenti finalizzato ad affrontare questa complessità
è certamente il framework.
Una sorta di cassetta degli attrezzi professionale
che semplifica e ottimizza il lavoro del web designer.
"La sua funzione è quella di creare una infrastruttura generale, lasciando al programmatore il contenuto vero e proprio dell'applicazione. Lo scopo di un framework è infatti quello di risparmiare allo sviluppatore la riscrittura di codice già scritto in precedenza per compiti simili.
Ad esempio, il tipo di interazione con l'utente offerto da un menu a tendina sarà sempre la stessa indipendentemente dall'applicazione cui il menu appartiene (o almeno questo è ciò che l'utente si aspetta); in casi come questo un framework, che permette di aggiungere la funzionalità di una finestra con un menu a tendina con poche righe di codice sorgente a carico del programmatore, o magari permettendogli di disegnare comodamente il tutto in un ambiente di sviluppo, permetterà al programmatore di concentrarsi sulle vere funzionalità dell'applicazione, senza doversi far carico di scrivere codice "di contorno" (wikipedia).
Grazie quindi ad un framework possiamo utilizzare pacchetti di funzioni già pronte il cui codice sorgente è stato già scritto da altri programmatori ed è disponibile come risorsa per un libero utilizzo. Il vantaggio è immediatamente intuibile in termini di risparmio di tempo che verrà dedicato principalmente alla parte creativa. Ma il vantaggio più apprezzabile è soprattutto in termini di permormance, in quando, i pacchetti di codice ricorrente sono ormai compilati da programmatori specializzati in competenze specifiche e resi fruibili dagli sviluppatori attraverso il richiamo di apposite librerie di codice.
Uno dei framework più noti e sicuramente degni di menzione è Bootstrap. Eccone alcune definizioni tratte da wikipedia:
"Bootstrap è una raccolta di strumenti liberi per la creazione di siti e applicazioni per il Web. Essa contiene modelli di progettazione basati su HTML e CSS, sia per la tipografia, che per le varie componenti dell'interfaccia, come moduli, pulsanti e navigazione, così come alcune estensioni opzionali di JavaScript."
"Dalla versione 2.0 supporta anche il responsive web design. Ciò significa che il layout delle pagine web si regola dinamicamente, tenendo conto delle caratteristiche del dispositivo utilizzato, sia esso desktop, tablet o telefono cellulare. A partire dalla versione 3.0, Bootstrap ha adottato il responsive design come impostazione predefinita, sottolineando il suo essere nata come libreria multidispositivo e multipiattaforma."
Ma uno degli sviluppi più interessanti dei framework, soprattutto in ambito freelance è indubbiamente il Template Framework
Template framework
I template framework sono appunto framework orientati alla creazione dei template web, cioè dei modelli che definiscono la grafica di un sito.
Uno dei vantaggi più apprezzabili dei template framework è sicuramente la loro relativa semplicità di utilizzo. Infatti grazie ad interfacce grafiche dedicate permettono la creazione e la modifica di gran parte degli elementi che costituiscono l'aspetto di una pagina web, lavorando in un ambiente di sviluppo di tipo visuale. Non quindi (salvo casi particolari) scrivendo o modificando stringhe di codice.
Ma vediamo una panoramica dei primi 10 template framework per joomla, tra i più noti e i meno noti.
-
→ Gantry framework
-
→ T3 framework
-
→ Warp framework
-
→ Exposè framework
-
→ ZO2 framework
-
→ Vertex framework
-
→ Construct framework
-
→ The wight framework
-
→ J6sg framework
-
→ Helix framework
Diciamo subito che i template framework, essendo di fatto dei software, sono comunque strumenti di sviluppo avanzati. Dedicati dunque agli sviluppatori. Naturalmente invito i più curiosi ed eventuali aspiranti "fai da te" a scaricare i framework dai relativi siti di riferimento e a cimentarsi con il loro utilizzo. Sapendo comunque che richiedono una preparazione di base sul CMS joomla.
Scorrendo alcuni tutorial dedicati appare infatti evidente quanto i template framework, siano comunque uno strumento per "specialisti". La loro interfaccia grafica (ogni framework ha la propria) è infatti meno intuitiva rispetto a quella di un template maker.
Se un template maker offre la possibilità di progettare in modo visuale (wysiwyg) i singoli moduli e il layout della pagina, il framework lo fa a partire da blocchi di funzioni.
Per quanto mi riguarda non è facile comporre la grafica di una pagina partendo da un insieme di funzioni.
Almeno per chi, come il sottoscritto, ha un approccio mentale alla progettazione
di tipo visuale-intuitivo piuttosto che analitico-deduttivo.
Uno dei fattori che pesano maggiormente sul grado di facilità o meno di utilizzo dei template framework è infatti la possibilità di includere o meno un modello di base a cui ispirarsi o da modificare per realizzare qualcosa di diverso.
Alcuni di questi framework propongono infatti uno o più modelli, completi e già funzionanti (anche gratuiti), pronti per l'uso o utilizzabili come base per il proprio progetto. Alcuni, per nella loro semplicità, hanno una loro eleganza minimal e tutte le funzionalità di base richieste dal responsive design. Caratteristiche che fanno intuire le loro potenzialità di sviluppo se personalizzati in modo professionale e integrati eventualmente con componenti di terze parti. Insomma una sorta di bonus che permette di ovviare alla difficoltà di comporre un template, e più in particolare le sue varianti stilistiche (temi), iniziando da zero. Tutti generalmente offrono comunque la possibilità di partire da un modello vuoto (blank template), opzione che alcuni invece offrono come unica possibilità. Mi riferisco naturalmente al pacchetto di download, perché in rete si trovano diverse risorse gratuite e a pagamento in merito.
Tutto lascia comunque supporre che il grado di specializzazione ormai raggiunto da questi prodotti, in particolare i template framework professionali, sia frutto di un approccio progettuale avanzato che coinvolge diverse figure specialistiche.
I vantaggi del Template Framework
Riassumendo quanto detto finora possiamo quindi sintetizzare che un framework evita allo sviluppatore la riscrittura di codice già scritto e gli permette di concentrarsi sulla parte grafica del sito.
Un template framework, oltre a modelli grafici completi (temi) - alcuni gratuiti, altri a pagamento - o modelli grafici vuoti (blank template), offre un ambiente di sviluppo che permette la modifica degli stessi attraverso una propria interfaccia grafica.
Ogni produttore di template ha il proprio framework: Joomlart usa T3, RocketTheme usa Gantry framework; YooTheme usa Warp5 ecc. e poiché ogni framework è di fatto un software, ogni volta che si passa da un framework ad un'altro bisogna installarlo, studiarlo e testarlo.
Anche sui template framework, come su tutto lo scibile umano, esistono diverse scuole di pensiero, alcune anche critiche. Io li considero uno strumento di lavoro professionale; non solo utile ma indispensabile. Soprattutto in ambito freelance, dove alla necessità di ricoprire mansioni generalmente demandate a figure professionali diverse, come in una web agency, devi affiancare una politica dei prezzi credibile e in linea col mercato che garantisca al cliente il miglior rapporto qualità/prezzo possibile.
I template framework, non solo offrono le possibilità finora descritte ma delineano, a mio avviso, una tendenza generale nello sviluppo della grafica web, tanto da meritare appieno quell'attenzione che la comunità di sviluppatori e web designer, gli dedicano ormai da tempo.
Ognuno naturalmente ha il proprio modo di lavorare ed è comprensibile che vi sia legato. C'è ad esempio chi progetta i siti dinamici senza utilizzare i CMS e chi crea il proprio template modificando il codice CSS. Ciò è influenzato soprattutto dalle attitudini personali di ognuno che determinano approcci progettuali diversi. Il sottoscritto ha un approccio di tipo visuale che ragione per oggetti, altri preferiscono un approccio di tipo analitico che ragione per stringhe di codice.
Di sicuro, qualunque sia la metodologia di lavoro adottata, questa non potrà prescindere dal fatto che niente, soprattutto in informatica,si progetta da zero. Sia che si utilizzi un framework, sia che si utilizzino routine di codice scritto in precedenza. E questo per tanti motivi di ordine pratico ed economico, oltre che di snellimento e ottimizzazione del flusso di lavoro. Ma soprattutto perché il contrario sarebbe fuori da ogni logica.
Il template framework l'Hi-Tech del web
Lo sapevi che un template framework può essere un prodotto di altissima qualità, che può essere messo a disposizione gratuitamente dal produttore in alcune versioni open source o a pagamento nelle versioni professionali, fornendo assistenza post vendita come per un altro prodotto di serie?
Lo sapevi che un template framework è fondamentalmente un allestimento molto simile a quello di un'auto o di una bicicletta? Che ha cioè una sua filiera produttiva che si avvale spesso di componenti specializzate prodotte da terze parti che il produttore può assemblare e proporre in vari allestimenti?
E che lo stesso template, essendo un framework, è per lo sviluppatore una sorta di officina che gli permette di modificare il modello originario o di smontarlo per costruirne uno nuovo?
E che può proporre il template come quickstart, completo cioè di dati di esempio che permettono di valutare tutte le funzionalità del prodotto finito attraverso demo complete e funzionanti di cui è possibile testare direttamente effetti e funzionalità, e spesso versioni stilistiche diverse?
L'esempio della bicicletta
Lo sapevi che i produttori di biciclette si occupano sostanzialmente di realizzare il solo telaio mentre tutte le altre componenti sono prodotte da aziende specializzate ognuna nel proprio comparto produttivo? Perché? Perché lo sviluppo della tecnologia - in questo come in tanti altri settori - porta necessariamente alla specializzazione.
Così una bicicletta Bianchi può essere dotata di cambio Campagnolo, guarnitura Shimano, ruote Fulkrum o AlexRims, forcella Suntour, Coperture Kenda e via dicendo. Nessuno si sognerebbe di acquistare un cambio da chi è specializzato in telai, una forcella da chi ha esperienza solo di freni o una guarnitura da chi è bravo a progettare e produrre selle.
Ma andiamo subito al sodo per chiarire meglio con un esempio quanto sopra descritto. Prendiamo ad esempio la slideshow utilizzata per la home di questo sito che è un'estensione di terza parte estremamente potente e performante. Spero sia chiaro il perché, non solo un web designer freelance, ma neanche una web agency con uno team super specializzato di programmatori si sognerebbe di investire tempo e denaro per riprogettare da zero una slideshow con queste caratteristiche per il proprio cliente. Talmente potente e completa che la sua configurazione, lo studio dell'interfaccia grafica, l'inserimento dei contenuti e i test, si preannunciano, per il web designer, un compito non proprio banale. Anche in termini di tempo. Ma è tempo finalizzato all'uso dello strumento non alla sua progettazione.
In conclusione possiamo affermare che un template framework si può presentare come una bicicletta (o un'auto se preferite) tecnologicamente avanzata che può essere fornita con un proprio allestimento e dotazioni di serie ma anche una piccola officina che permette un forte grado di personalizzazione; Benché comunque con un suo orientamento originario di cui bisogna tener conto in fase di selezione del template. È fondamentale comunque sottolineare che un template framework non permette di intervenire su tutti gli elementi del tema grafico ma solo su quelli principali. In questo caso è possibile intervenire direttamente sul codice di sviluppo, creando ad esempio un foglio di stile personalizzato (Custom CSS) e qui intervengono le competenze e l'abilità specifica dello sviluppatore nel saper manipolare questo tipo di prodotto.
Possibili obiezioni all'utilizzo dei template framework
DOMANDA: Perché dovrei pagare un web designer per realizzare un sito con un template framework che costa mediamente 50€ o è addirittura gratuito?
RISPOSTA: Ciò che si paga non è il template ma la sua installazione, configurazione e personalizzazione che richiedono una buona conoscenza della piattaforma utilizzata, sia essa joomla o wordpress. Il sottoscritto ha raggiunto la padronanza di Joomla in diversi anni di dedizione.
I template framework non sostituiscono il lavoro del web designer; lo semplificano nella parte sviluppo liberando tempo da dedicare al concept del sito. Cioè alla definizione dell'identità del progetto affinché rappresenti un marchio, un brand o una persona attraverso uno stile unitario e coerente.
DOMANDA: Il mio sito realizzato con un template framework potrebbe essere identico ad un altro sviluppato con lo stesso template?
RISPOSTA: No, a meno che non si utilizzino gli stessi moduli, lo stesso tipo, numero e ordine di sezioni e gli stessi contenuti (grafica, testi, elementi multimediali, logo). Cioè un clone esatto dello stesso sito, possibilità esclusa di per sé dall'ultimo punto, cioè i contenuti che sono unici per ogni sito. Alcuni moduli con animazioni particolari ad es. parallaxe, skylls, gallery lightbox o la google maps potrebbero esser uguali ad altri template perché sono di moda o fanno tendenza ed è il cliente stesso a volerli perché li ha già visti ed apprezzati su un altro sito. Ma sono comunque elementi da personalizzare con i propri contenuti. Inoltre sono componenti prodotti da terze parti, quindi utilizzati da moltissimi sviluppatori, a prescindere dal template utilizzato.