1 Profili e template per siti Web 2.0 a basso costo per le ONG 1 Fabrizio Maggioni Riassunto Il presente articolo è dedicato alla presentazione di template di siti web 2.0 a basso costo per le ONG, realizzati interamente con strumenti e applicazioni online (SaaS). Nella prima sezione verranno individuati dei profili tipici di siti web per ONG in base ai quali realizzare i template. Nella seconda sezione saranno presentati i prototipi costruiti, con particolare enfasi sull’analisi critica degli strumenti e dei servizi online utilizzati. 1 Questo documento è estratto dalla tesi di laurea magistrale in Teoria e tecnologia della comunicazione di Fabrizio Maggioni: "Realizzazione di template di siti web a basso costo per le Organizzazioni Non Governative", Università degli studi di Milano Bicocca, relatore: prof. Roberto Polillo A.A. 2008/2009. Il testo di questo documento è reso disponibile con licenza Creative Commons “attribuzione, non commerciale, condividi allo stesso modo”: http://creativecommons.org/licenses/bync sa/2.5/it/legalcode . La licenza non si estende alle immagini (screen shot dei siti Web citati, e altro), i cui diritti sono in capo ai rispettivi proprietari.
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
1
Profili e template per siti Web 2.0
a basso costo per le ONG1
Fabrizio Maggioni
Riassunto
Il presente articolo è dedicato alla presentazione di template di siti web 2.0 a basso costo
per le ONG, realizzati interamente con strumenti e applicazioni online (SaaS). Nella
prima sezione verranno individuati dei profili tipici di siti web per ONG in base ai quali
realizzare i template. Nella seconda sezione saranno presentati i prototipi costruiti, con
particolare enfasi sull’analisi critica degli strumenti e dei servizi online utilizzati.
1 Questo documento è estratto dalla tesi di laurea magistrale in Teoria e tecnologia della comunicazione di
Fabrizio Maggioni: "Realizzazione di template di siti web a basso costo per le Organizzazioni Non Governative", Università degli studi di Milano Bicocca, relatore: prof. Roberto Polillo A.A. 2008/2009. Il
testo di questo documento è reso disponibile con licenza Creative Commons “attribuzione, non commerciale, condividi allo stesso modo”: http://creativecommons.org/licenses/by-‐nc-‐
sa/2.5/it/legalcode. La licenza non si estende alle immagini (screen shot dei siti Web citati, e altro), i cui diritti sono in capo ai rispettivi proprietari.
2
Indice
1. Diversi profili per i siti delle ONG italiane pag. 3
1.1 Obiettivi della ricerca pag. 3
1.2 Metodologia dell’analisi funzionale pag. 4
1.3 Risultati: tre profili per i siti delle ONG italiane pag. 6
1.4 Migliorare l’interattività dei siti delle ONG grazie al Web 2.0 pag. 19
2. I template di siti web a basso costo per le ONG pag. 23
Non è un caso che la quasi totalità dei siti classificabili come sociali appartenga ad ONG
di grandi dimensioni, molto spesso divisioni nazionali di importanti organizzazioni con
sedi in tutto il mondo, come Amref, Emergency, Save the Children e il WWF. Non
mancano però esempi di ONG italiane meno conosciute che sono riuscite a realizzare siti
di questo livello, come Soleterre e Mani Tese.
Alla pagina successiva viene riportata una tabella riassuntiva dei set di strumenti
interattivi propri di ciascuna tipologia di sito sopra esaminata. La sezione proseguirà
quindi con la presentazione delle funzionalità dei template che si è deciso di associare ad
ogni livello.
18
SITI STATICI
SITI INTERATTIVI
SITI SOCIALI
Pagine statiche x x x Calendario eventi x x x Pagina link x x x Photogallery x x x Videogallery x x x Download documenti
x x x
Mappe interattive x x x Motore di ricerca x x x Form iscrizione newsletter
-‐ x x
Donazioni dirette -‐ x x Slideshow -‐ x x Contact form -‐ x x Application form -‐ x x Blog -‐ x x Area riservata -‐ x1 x2 Feed RSS -‐ x x Share button -‐ x x Donazioni per progetto
-‐ -‐ x
Profili sulle social network e relativi social button
-‐ -‐ x
1 – Intranet generalista come area riservata
2 – Intranet generalista o specifica per progetto o per sede realizzata su social network linkata
Tabella 1.1 I diversi livelli di complessità funzionale individuati per i siti delle ONG italiane e i relativi set tipici di funzionalità presenti. La X marca la presenza dello strumento, indicato in riga, per il profilo indicato in colonna.
19
1.4 Migliorare l’interattività dei siti delle ONG grazie al Web 2.0
Anche se non sono disponibili precise ricerche in merito, si può ipotizzare che la scarsità
di funzionalità interattive riscontrata nella maggioranza dei siti delle ONG italiane sia
dovuta alle difficoltà che queste incontrano nell’implementarle, non avendo a
disposizione professionisti del settore tra i propri volontari e collaboratori e mancando dei
fondi necessari per rivolgersi ad agenzie specializzate. Si ricorda che queste
organizzazioni sono di tipo non-profit e che la maggior parte di esse realizza i propri
progetti con meno di 11 operatori contrattati4.
Realizzare un sito web interattivo è un’impresa non banale. Oltre a conoscere il codice
html e css, il web designer deve anche possedere competenze informatiche e di
programmazione di base, in linguaggio php e Java, al fine di poter implementare le
funzionalità necessarie, come i form. Anche l’utilizzo dei CMS, come Joomla o Drupal,
che semplifica di molto il compito, non è alla portata di tutti.
Negli ultimi anni la situazione è cambiata, grazie alla nascita e alla moltiplicazione sul
web di servizi online gratuiti, oppure organizzati secondo un modello di business
freemium, dedicati proprio all’implementazione nei siti web di molteplici funzionalità
interattive, tra cui tutte quelle desiderabili per una ONG. Una particolare categoria di
questi servizi, i site builder, è specificamente dedicata all’hosting e alla costruzione di
interi siti, realizzabili da chiunque possieda una minima conoscenza dell’uso del
computer, grazie ad un editor semplice ed intuitivo, che non richiede al designer di
manipolare codice html e css.
Sulla base di queste considerazioni, sono stati delineati tre nuovi profili che aggiungono
funzionalità interattive a quelli individuati in questa sezione (vedi tabella 1.2). La scelta
delle funzionalità da includere in ciascun profilo si basa:
sulla suddivisione in tre livelli di completezza e complessità crescenti,
corrispondenti ai profili dei siti reali delle ONG, individuati in questa sezione;
4 Fonte: Link 2007, rapporto Un mestiere difficile 2008, 2008, pag. 19.
20
sul lavoro di analisi di Magosso dei siti delle charity americane5, che indica come
di primaria importanza le funzionalità di donazione online e la connessione con le
più importanti social network;
su un’analisi esplorativa condotta da Alessio Gattuso sul web per individuare i
servizi online più economici e completi che permettano alle ONG di implementare
le funzionalità desiderate nei loro siti6; mediante questa ricerca sono emersi anche
servizi relativi a funzionalità non individuate nell’analisi presentata in questa
sezione.
Grazie all’utilizzo delle nuove applicazioni online sopra descritte, e di tecniche di mash-
up per aggiungere funzionalità da esse non fornite, sono stati successivamente costruiti tre
diversi template associati ai tre nuovi profili (vedi tabella 1.3 per un’anticipazione degli
strumenti con i quali sono stati realizzati). Nella sezione 2 si passerà alla descrizione di
questi template.
5 Magosso, Paolo, Il web 2.0 per le organizzazioni non-‐profit: best practice delle charity statunitensi, tesi di laurea in Teoria e Tecnologia della Comunicazione, Università Statale di Milano Bicocca, a.a. 2008/2009.
6 Gattuso, Alessio, Selezione di strumenti Web 2.0 per la realizzazione di siti web per Organizzazioni Non Governative, tesi di laurea in Teoria e Tecnologia della Comunicazione, Università Statale di Milano
Bicocca, a.a. 2008/2009.
21
PROFILO BASE
PROFILO
COMPLETO
PROFILO
AVANZATO
Pagine statiche x x x Calendario eventi x x x Pagina link x x x Photogallery x x x Videogallery x x x Download documenti
x x x
Mappe interattive x x x Motore di ricerca x x x Form iscrizione newsletter
x x x
Donazioni dirette x x x Slideshow x x x Contact form x x x Application form -‐ x x Blog x x x Area riservata -‐ x x Feed RSS x x x Share button x x x Donazioni per progetto
-‐ x x
Profili sulle social network e relativi social button
x1 x2 x2
Embedded document (presentazioni, pubblicazioni)
-‐ x x
Videoconferencing3 -‐ -‐ x Audioconferencing3 -‐ -‐ x Document sharing3 -‐ -‐ x Desktop sharing3 -‐ -‐ x 1 – Pagina Facebook e canale Youtube 2 – Facebook, Youtube, Flickr e Twitter
3 – Funzionalità di online meeting destinate agli utenti interni dell’ONG e alla formazione Tabella 1.2 Le funzionalità incluse nei tre nuovi profili delineati per la costruzione dei template di siti per ONG con strumenti Web 2.0. Le “x” rosse indicano un’aggiunta di funzionalità rispetto al profilo corrispondente tra quelli individuati in questa sezione (vedi tabella 2.1).
Profili sulle social network e relativi social button
Facebook e Youtube Facebook, Youtube, Flickr e Twitter
Facebook, Youtube, Flickr e Twitter
Embedded document (presentazioni, pubblicazioni)
-‐ ISSUU (pdf) e Slideshare (ppt)
ISSUU (pdf) e Slideshare (ppt)
Videoconferencing3 -‐ -‐ Dimdim
Audioconferencing3 -‐ -‐ Dimdim
Document sharing3 -‐ -‐ Dimdim
Desktop sharing3 -‐ -‐ Dimdim
Tabella 1.3 Gli strumenti con i quali sono stati costruiti i template associati ai tre profili delineati nella tabella alla pagina precedente. Tali strumenti saranno riepilogati anche all’inizio del paragrafo di descrizione di ciascun prototipo.
23
2. I template di siti web a basso costo per le ONG
2.1 Introduzione e metodologia
La presente sezione sarà dedicato alla descrizione dei template di siti web a basso costo,
realizzati interamente mediante strumenti e servizi reperiti in rete, per le ONG italiane
per la cooperazione allo sviluppo. In questa introduzione metodologica verrà brevemente
riassunto il percorso che ha portato alla creazione di questi prototipi. Successivamente
verranno elencati e descritti gli strumenti utilizzati, quindi si passerà all’analisi dettagliata
di ciascuno dei tre template.
Dopo aver individuato i profili tipici nei quali si declina la presenza sul web delle ONG
italiane (vedi sezione 1), sono state scelte le funzionalità base e quelle interattive da
inserire nei diversi prototipi, ordinati in base al livello di complessità funzionale. Per
l’implementazione di questi strumenti interattivi sono state utilizzate soltanto applicazioni
online offerte come servizi (SaaS), gratuitamente o secondo un modello di business
freemium. La scelta di questi strumenti è stata guidata dai risultati della ricerca
esplorativa effettuata da Gattuso per individuare e confrontare tra loro gli strumenti
ritenuti più adatti allo scopo. I risultati completi di questa ricerca e il confronto dettagliato
tra i vari servizi che forniscono questi strumenti possono essere consultati nell’elaborato
di Gattuso, Selezione di strumenti Web 2.0 per la realizzazione di siti web per
Organizzazioni Non Governative 7.
Il primo passo nella costruzione di ciascun template è stata la scelta di una piattaforma di
site building per la realizzazione delle pagine statiche e per l’hosting del prototipo su un
server web. Sono state utilizzate tutte le piattaforme individuate nella ricerca di Gattuso,
eccezion fatta per quelle che non garantivano sufficienti funzionalità nella versione
7 Gattuso, Alessio, Selezione di strumenti Web 2.0 per la realizzazione di siti web per Organizzazioni Non
Governative, tesi di laurea in Teoria e Tecnologia della Comunicazione, Università Statale di Milano Bicocca, a.a. 2008/2009.
24
gratuita. Tale scelta è stata motivata dalla volontà di mostrare pregi e difetti di ciascuna
piattaforma attraverso un prototipo concreto, interattivo e funzionante.
Le funzionalità interattive non garantite in modo adeguato dal site builder scelto sono
state realizzate mediante strumenti offerti da servizi esterni, anch’essi tutti
dettagliatamente descritti nell’elaborato di Gattuso. Infine tali widget sono stati
incorporati nel sito principale mediante l’embedding del codice html necessario. La figura
sottostante (figura 2.1) mostra lo schema di realizzazione dei template secondo questa
tecnica di mash-up, che vede il sito principale costantemente in contatto con i server sui
quali risiedono fisicamente gli strumenti e i widget realizzati esternamente al site builder.
Figura 2.1 Architettura di mash-‐up dei template presentati in questa sezione. Fonte: slide di Polillo, Roberto, Corso Web 2.0, Università degli Studi di Milano-‐Bicocca, a.a. 2009-‐2010 (rielaborazione personale).
25
2.2 I template
I prototipi di siti per ONG intendono rappresentare dei modelli di riferimento per quelle
organizzazioni che vogliono realizzare un sito interattivo, o migliorare il proprio, senza
avere a disposizione le conoscenze tecniche necessarie o le risorse per rivolgersi a
professionisti del settore. Pertanto, benché la scelta delle sezioni, dell’architettura
informativa e delle funzionalità interattive sia stata guidata dai lavori di ricerca
menzionati nei capitoli precedenti, essi devono essere considerati come semplici esempi,
dal valore puramente indicativo.
Lo scopo dei prototipi è quindi quello di mostrare le possibilità offerte dalle applicazioni
Web 2.0 di nuova generazione per la costruzione di siti interattivi mediante esempi
pratici, che siano anche il più possibile conformi alle reali necessità di organizzazioni di
questo tipo. I contenuti di tutti questi siti sono totalmente fittizi. Le immagini sono state
reperite in rete in modo casuale, ma conservando un legame con l’ambito di competenza
dei siti, la cooperazione allo sviluppo. I testi sono perlopiù sequenze di parole senza senso
(lorem ipsum), con valore puramente riempitivo. Tutti gli strumenti interattivi presenti
sono invece realmente funzionanti, in quanto l’obiettivo principale è proprio quello di
mostrare la loro realizzabilità.
Per ciascun template sarà innanzitutto presentato l’indirizzo web, quindi una tabella che
associa le funzionalità presenti agli strumenti e ai servizi utilizzati per implementarle.
Infine sarà descritta la piattaforma sfruttata per costruire la struttura portante del sito. La
sequenza dei prototipi (base, completo e avanzato) rispecchia la crescente complessità
funzionale rilevata per i profili descritti nella sezione precedente precedente, i quali a loro
volta corrispondono a particolari esigenze e possibilità delle ONG a cui appartengono.
Nelle tabelle iniziali, le funzionalità presenti in ciascun template saranno anche
confrontate con quelle del relativo profilo di partenza. Si può osservare da queste tabelle
la maggiore ricchezza funzionale dei prototipi costruiti grazie all’approccio cloud
computing rispetto ai profili individuati dall’analisi dei siti attuali delle ONG italiane.
Per la costruzione dei prototipi sono stati utilizzati soltanto servizi free o freemium nella
versione base, senza sostenere alcuna spesa. Ciò è stato possibile, in alcuni casi, soltanto
in quanto si tratta di semplici prototipi, privi di reali contenuti. Tutti gli aspetti relativi ai
26
costi da sostenere per realizzare siti simili a questi template, oppure versioni premium
degli stessi, saranno discussi nelle considerazioni finali di ciascun paragrafo, insieme ai
possibili scenari di utilizzo dei relativi prototipi.
2.2.1 Template base: piattaforma Weebly
http://www.prototipoong.weebly.com
Il template base è il più semplice dei prototipi dal punto di vista funzionale. Si tratta di un
sito simile a quelli definiti come statici nella sezione precedente, ma con importanti
aggiunte dal punto di vista funzionale: un blog, funzionalità base per le donazioni online,
semplici form collegati solo con la mail dell’amministratore e profili sulla social network
Facebook e sul più importante sito di condivisione di video, Youtube. Di seguito viene
riportata la tabella che riepiloga gli strumenti utilizzati per realizzare questo prototipo.
FUNZIONALITÀ PRESENTI
STRUMENTO UTILIZZATO
PROFILO DI PARTENZA: SITI STATICI
Pagine statiche Weebly X
Calendario eventi Weebly (pagina statica) X
Pagina link Weebly (pagina statica) X
Photogallery Weebly X
Videogallery Youtube X
Download documenti Weebly X
Mappe interattive Google maps X
Motore di ricerca Google custom search engine X
Form iscrizione newsletter Form creator di weebly Non presente
Donazioni dirette Pulsanti di Paypal Non presente
Slideshow Weebly Non presente
Contact form Form creator di weebly Non presente
Blog Weebly Non presente
Feed RSS Weebly Non presente
Share button Widget di addthis.com Non presente
Profili sulle social network Facebook e Youtube Non presente
Tabella 2.1 Le funzionalità presenti nel template base e gli strumenti utilizzati per realizzarle.
27
La piattaforma di site building utilizzata: Weebly
http://www.weebly.com
Weebly è un servizio online di site building molto intuitivo da utilizzare, basato sulla
metafora del drag-and-drop per la costruzione del layout delle pagine web (vedi figura
2.2).
Figura 2.2 Tipica schermata dell’editor di Weebly. La procedura per inserire un nuovo paragrafo con foto. Gli elementi vengono trascinati dalla barra superiore direttamente nel sito, presentato a tutta pagina.
Rispetto ai site builder utilizzati per i prototipi di complessità maggiore, Weebly si
distingue per semplicità di utilizzo e velocità di esecuzione dei comandi. Allo stesso
tempo però, Weebly non offre pagine specificamente dedicate a funzionalità interattive, a
parte il blog, non dà la possibilità all’amministratore di aggiungere e gestire membri del
sito o altre persone autorizzate ad aggiornarlo e non mette a disposizione template a due
colonne con sidebar fissa e personalizzabile. In realtà, grazie alle opzioni di
personalizzazione del layout delle singole pagine (elementi two-column-layout), sarebbe
possibile creare una struttura di questo tipo, ma soltanto con molte ore di lavoro
28
aggiuntivo e senza ottenere risultati paragonabili a quelli degli altri site builder. Inoltre, i
set di opzioni di gestione del sito e del blog sono decisamente limitati e poco
personalizzabili rispetto agli altri site builder. Pertanto, si è scelto di utilizzare Weebly per
la realizzazione del template più semplice, caratterizzato da una limitata presenza di
funzionalità interattive e privo di un’area riservata.
Un’altra limitazione di questo site builder riguarda la disponibilità di una sola lingua per
l’editor e la gestione del back office del sito: l’inglese. Una buona parte delle ONG non
opera in paesi anglofoni; questa lacuna potrebbe quindi rappresentare un serio fattore di
difficoltà per l’utilizzo di Weebly da parte di queste organizzazioni.
Come si può notare nei diversi screenshot riportati in questo paragrafo, l’impianto grafico
del sito è estremamente semplice. Ciò è dovuto principalmente alla carenza di contenuti
reali, soprattutto loghi e locandine, e alla scelta di un tema semplice. Si ricorda che
l’obiettivo in questo caso è la costruzione di un modello di sito interattivo e funzionante
mediante l’utilizzo di soli strumenti Web 2.0 e applicazioni online: la grafica assume
pertanto un valore secondario.
Tuttavia, in previsione di un utilizzo reale di questo strumento, sono state analizzate
anche le funzionalità di personalizzazione grafica a disposizione dell’amministratore,
rilevando diverse limitazioni. Come già menzionato sopra, questo site builder costringe il
layout delle pagine ad una sola colonna, senza dare la possibilità di inserire una sidebar
con contenuti contestuali o fissi tra le pagine (ad esempio link veloci). Si tratta di una
carenza piuttosto importante, non riscontrata negli altri site builder utilizzati. La scelta di
template grafici in Weebly è piuttosto limitata, anche se viene data la possibilità di
modificarne direttamente i codici html e css. Questo accorgimento consente un’elevata
personalizzazione della grafica del sito, ma soltanto da parte di chi possiede le giuste
competenze di web design.
Home page, pagine statiche e architettura dell’informazione
29
Il sito è organizzato in otto sezioni principali, visibili nel menu a sinistra come
navigazione di primo livello, e undici sottosezioni, raggiungibili anch’esse dallo stesso
menu mediante elenchi a comparsa. La navigazione per l’utente è ulteriormente
supportata dalle cosiddette breadcrumbs, presenti in ogni pagina sopra al titolo, fatta
eccezione per la home, e realizzate come semplici paragrafi di testo con link.
La home page del sito (figura 2.3, alla pagina successiva) si apre con un semplice
paragrafo di testo con immagine, pensato per la presentazione dell’organizzazione e dei
suoi obiettivi e seguito da un link alla pagina interna dedicata a questi argomenti. Questa
scelta non è casuale, in quanto questo tipo di informazioni è stato indicato dalla ricerca di
Estes e Nielsen, già più volte citata precedentemente, come il più importante per
convincere l’utente ad effettuare una donazione online8. Immediatezza e chiarezza
risultano quindi di primaria importanza nella presentazione di questi dettagli sul sito.
Sotto questo primo paragrafo sono presenti il motore di ricerca interno e alcuni pulsanti
per link veloci alle sottosezioni più importanti: le donazioni online, le pagine dedicate ai
progetti e quella per iscriversi alla newsletter. Chiudono la home page i social button per i
collegamenti con il profilo su Facebook e il canale di Youtube.
Per pagine statiche si intende in questa sede tutte quelle pagine del sito nelle quali non
sono presenti strumenti interattivi per l’utente. Tali sezioni sono composte soltanto da
testo, immagini e link ad altre pagine o a siti esterni. Per la realizzazione di tutti questi
elementi è stato usato soltanto l’editor di Weebly. Dopo l’immagine relativa alla home
page si riportano tre screenshot di pagine di questo tipo: quella dedicata alla presentazione
dei progetti (figura 2.4), quella relativa all’organigramma dell’ONG, con link ai profili
dei membri più importanti sulle social network (figura 2.5) e quella contenente la lista dei
siti delle ONG partner con i relativi link (figura 2.6).
Figura 2.3 La home page del template base. Lo zoom è stato diminuito per permetterne la visualizzazione a tutta pagina. Pertanto non è più visibile una linea divisoria tra il link “mission e obiettivi” e il motore di ricerca.
31
Figura 2.4 La pagina dedicata alla presentazione dei progetti dell’ONG nel template base.
32
Figura 2.5 Particolare della pagina “Organigramma” del template base.
Figura 2.6 Particolare della sezione “Sostenitori” nel template base.
33
Considerazioni conclusive sul template base
Per costruire questo prototipo non sono stati utilizzati servizi a pagamento. Weebly nella
sua versione base non pone limitazioni al numero di pagine, ma soltanto al peso totale del
sito; questa limitazione potrebbe comunque essere superata senza acquistare il pacchetto
premium, ma semplicemente affidandosi ad uno o più dei tanti servizi di online storage
system gratuiti disponibili, come Badongo (www.badongo.com) o Divshare
(www.divshare.com).
Weebly Pro è l’unico miglioramento apportabile a pagamento per gli strumenti utilizzati e
costa $4,58 al mese per un abbonamento di sei mesi, oppure $4/mese per uno di un anno o
$3/mese se si sceglie la durata più lunga, di due anni9. La versione premium di Weebly,
tuttavia, non aggiunge funzionalità particolarmente interessanti, eccezion fatta per la
possibilità di proteggere determinate pagine mediante password, utile alle organizzazioni
che vogliono aggiungere un’area riservata al sito.
Un sito costruito come il template base è quindi caratterizzato da un costo nullo e non
richiede alcuna competenza informatica o di web design per essere creato e gestito. Tutte
le funzionalità interattive sono implementabili da chiunque abbia un minimo di
dimestichezza con il web e non è richiesta la conoscenza dei codici html e css, se non per
apportare sostanziali modifiche al tema grafico del sito.
Questo prototipo è stato costruito tenendo conto delle esigenze di ONG di piccolissime
dimensioni, che non solo non dispongono di fondi sufficienti e di volontari con
competenze nel settore, ma che si trovano ad operare con un numero molto esiguo di
collaboratori. Si ricorda infatti che la maggioranza delle ONG italiane per la cooperazione
allo sviluppo può contare su meno di 11 operatori contrattati. Si può ipotizzare che la
maggior parte di queste organizzazioni non abbia la possibilità di curare la propria
presenza sul web e si limiti ora a possedere un sito statico.
9 Prezzi tratti dal sito www.weebly.com, in data 18/01/2010
34
2.2.2 Template completo: piattaforma Wordpress
http://www.prototipoong.ilbello.com
Il template completo è un prototipo di media complessità funzionale, più ricco rispetto al
template base. Oltre alle funzionalità già presenti in quest’ultimo, il template completo
aggiunge un form per permettere agli utenti di effettuare online richieste di lavoro presso
l’organizzazione (application form), la possibilità di elargire donazioni per uno specifico
progetto e un’area riservata dedicata agli utenti interni dell’ONG. Di seguito viene
riportata la tabella che riepiloga gli strumenti utilizzati per costruire questo prototipo; in
rosso le funzionalità e le sezioni non presenti nel template base.
FUNZIONALITÀ PRESENTI
STRUMENTO UTILIZZATO
PROFILO ASSOCIATO: SITI INTERATTIVI
Pagine statiche Wordpress X
Calendario eventi Wordpress (pagina statica) X
Pagina link Wordpress (pagina statica) X
Photogallery Flickr X
Videogallery Youtube X
Download documenti Wordpress X
Mappe interattive Google maps X
Motore di ricerca Wordpress X
Form iscrizione newsletter Zoho Creator X
Donazioni dirette Pulsanti di Paypal X
Slideshow Flickr X
Contact form Jotform X
Blog Wordpress X
Feed RSS Wordpress X
Share button Widget di addthis.com X
Profili sulle social network Facebook, Youtube, Flickr e Twitter X
Application form Zoho Creator X
Embedded document (ppt, pdf) ISSUU (pdf) e Slideshare (ppt) Non presente
Donazioni per progetto Pulsanti di Paypal Non presente
Area riservata Wordpress X
Tabella 2.2 Le funzionalità presenti nel template completo e gli strumenti utilizzati per realizzarle.
35
La piattaforma di site building utilizzata: Wordpress (versione scaricabile)
http://www.wordpress.org
Wordpress è una delle piattaforme più utilizzate per la creazione e la gestione di blog. In
questa sede è stato inserito nella categoria dei site builder in quanto mette a disposizione
anche la possibilità di pubblicare pagine statiche, all’interno delle quali è possibile
inserire qualsiasi tipo di contenuto. Essendo per sua natura un blog builder, Wordpress
offre all’utente un’ampia gamma di opzioni per la personalizzazione, la gestione e la
moderazione del blog, oltre a tutta una serie di widget connessi con l’attività di blogging
(ad esempio tag cloud, blogroll e calendario dei post).
Inoltre, sempre per lo stesso motivo, consente all’amministratore di permettere a più
utenti di pubblicare e modificare i contenuti del sito, assegnando a ciascuno di essi un
profilo e un ruolo che ne specifichi i privilegi. Si tratta di una caratteristica
potenzialmente molto utile per la gestione di un sito da parte di una ONG con sedi
geograficamente distribuite e con un organico composto da volontari e collaboratori con
diverse competenze. Grazie a questa funzionalità è possibile, ad esempio, consentire a
molte persone di pubblicare post sul blog (magari previa moderazione
dell’amministratore), ma solo a un numero ristretto di esse di modificare le pagine
statiche o la grafica del sito. Un altro grande vantaggio derivante dall’utilizzo di
Wordpress, anche questo molto importante nell’ambito delle ONG, è la possibilità di
scegliere tra più di 50 lingue quella in cui visualizzare il back office.
Dalla natura di blog builder di Wordpress non derivano tuttavia soltanto vantaggi per
l’utente intenzionato a costruire con esso un sito interattivo. In questa piattaforma infatti
l’editor delle pagine non differisce quindi di molto da quello di un semplice post (vedi
figura 2.7) e manca di tutti quegli strumenti necessari per l’impostazione del layout,
presenti invece negli altri site builder e particolarmente intuitivi e ben realizzati in
Weebly (elementi per vari tipi di paragrafi). Per effettuare questa operazione viene data la
possibilità di agire sull’html, con un editor di codice facilitato ma comunque molto
difficile da gestire senza competenze in merito. Inoltre, la differenza di dimensioni tra
l’editor e l’effettiva visualizzazione della pagina web rende ancora più difficoltoso il
compito di gestione del layout grafico.
36
Figura 2.7 L’editor del sito e delle pagine di Worpress. Si noti la maggiore complessità rispetto a quello di Weebly e la più nutrita presenza di funzionalità di gestione (sulla sinistra nel menu).
La maggiore complessità di Wordpress porta quindi a una maggiore difficoltà di utilizzo
rispetto a Weebly, soprattutto per utenti alle prime armi con la creazione di siti web.
Un'altra conseguenza di questa complessità è la minore velocità dell’applicazione, che
impiega un tempo decisamente superiore rispetto a Weebly per l’aggiornamento e la
pubblicazione dei contenuti sulle pagine del sito.
Esistono in rete due diverse versioni di questa piattaforma, reperibili su due indirizzi
separati:
http://www.wordpress.com – applicazione di Wordpress completamente online;
per utilizzarla è sufficiente creare un account. Mediante questa versione non è
tuttavia possibile inserire stringhe di codice con contenuto attivo, ad esempio i tag
37
<form>, <iframe> e <script>. Per l’obiettivo di questo lavoro essa risulta quindi
inutile, non consentendo l’importazione nelle pagine di strumenti interattivi
funzionanti.
http://www.wordpress.org – da questo indirizzo è possibile scaricare sul proprio
computer la cartella contenente i file (php) dell’applicazione di Wordpress, i quali
andranno poi installati sul server che ospiterà il sito web con essa creato. Questa
versione consente di superare la limitazione della precedente, ma richiede che sia
eseguita una procedura di installazione su server e di configurazione
dell’applicazione non alla portata di chi non possiede le adeguate competenze
informatiche.
Tuttavia, alcuni siti dedicati all’hosting di pagine web, come Il Bello (www.ilbello.com),
mettono a disposizione gratuitamente sui propri server la piattaforma di Worpress già
installata. Utilizzando questi servizi si può quindi superare lo scoglio delle eventuali
difficoltà di installazione, senza dover rinunciare alla possibilità di inserire widget
interattivi nel proprio sito.
Per la costruzione del template completo è stata scelta quest’ultima soluzione, sfruttando
il servizio di hosting di Il Bello. Oltre ai vantaggi in termini di semplicità di installazione
e configurazione, l’utilizzo della piattaforma scaricabile su un servizio di hosting gratuito
mette anche a disposizione l’accesso in ftp a tutti i file del sito. Tra questi ci sono anche
quelli relativi al tema grafico scelto. Questa opportunità, unita all’editor di css offerto da
Wordpress, consente agli utenti dotati di competenze di web design di personalizzare la
grafica del sito a un livello decisamente superiore rispetto agli altri site builder. Questa
differenza potrà essere apprezzata mediante un confronto tra gli screenshot relativi a
questo prototipo e quelli degli altri due template.
38
Home page, pagine statiche e architettura dell’informazione
Il template completo è organizzato in otto sezioni principali, visibili nel menu a sinistra
come navigazione di primo livello, e 27 sottosezioni, raggiungibili anch’esse dallo stesso
menu mediante elenchi a comparsa. La navigazione per l’utente è ulteriormente
supportata dalle cosiddette breadcrumbs, presenti in ogni pagina sotto al titolo, fatta
eccezione per la home, e realizzate come semplici paragrafi di testo con link.
La home page del sito è dedicata interamente al blog dell’organizzazione, sicuramente lo
strumento più potente messo a disposizione da Wordpress. In previsione di un utilizzo
reale da parte di un’ONG, la maggiore disponibilità di opzioni di personalizzazione e
soprattutto la grande flessibilità offerta da Wordpress nella gestione dei diversi ruoli degli
autori lo rendono uno strumento complesso e versatile.
In tutte le pagine è inoltre presente una sidebar, i cui contenuti rimangono sempre gli
stessi in tutte le sezioni del sito. Come si può notare nell’immagine che ritrae la home
page alla pagina successiva (figura 2.8), nella sidebar sono stati collocati link veloci per le
sezioni più importanti del sito: quelle dedicate al sostegno a distanza, all’iscrizione alla
newsletter dell’ONG e all’area riservata (non visibile nello screenshot riportato). Inoltre,
sempre nella sidebar sono presenti il pulsante per effettuare una donazione libera, lo share
button e i social button, per i link ai profili dell’ONG sulle relative social network.
Per la creazione delle pagine statiche è stato utilizzato l’editor di Wordpress, scontando le
difficoltà menzionate nel paragrafo precedente. I contenuti in esse inseriti non
differiscono da quelli del template base, pertanto non verranno qui riportati ulteriori
screenshot.
39
Figura 2.8 La home page del template completo, dedicata al blog. Il livello di zoom è stato diminuito per permetterne la visualizzazione a tutta pagina, pertanto le proporzioni tra gli elementi testuali e quelli grafici potrebbero risultare alterate.
40
Considerazioni conclusive sul template completo
La costruzione del template completo non ha richiesto l’utilizzo di alcun servizio a
pagamento. Wordpress offre tutte le funzionalità sopra descritte nella sua versione
wordpress.org gratuita. L’unico strumento utilizzato che impone limitazioni nella sua
versione free è Zoho Creator. Più specificamente, la versione base di Zoho Creator
consente un massimo di tre form/database per ogni account, con un totale di tuple che non
superi i 1.000 record.
Questa seria limitazione potrebbe essere superata creando più account, ognuno relativo a
un solo form, o addirittura più account per lo stesso form, se associato ad un database di
grandi dimensioni (si pensi alla lista di contatti della newsletter). Tale accorgimento
potrebbe risultare alquanto laborioso e non sempre praticabile in un contesto reale, in
quanto potrebbe comportare la separazione di dati di pertinenza del medesimo database
(nel caso di più account per lo stesso form). L’alternativa consiste nel sottoscrivere un
abbonamento premium presso Zoho, scegliendo tra le diverse fasce a disposizione (pay-
as-you-go), ma i prezzi risultano molto elevati: $15/mese per la prima, $25/mese la
seconda e così via in crescendo fino ai proibitivi $175/mese dell’ultima fascia10.
Anche se non richiede alcun costo nella sua versione free, il template completo risulta più
complesso da creare e gestire rispetto al prototipo base. Ciò a causa della maggiore
difficoltà d’utilizzo di Wordpress rispetto a Weebly per l’impaginazione dei contenuti
(modifica del codice html) e della presenza di un numero maggiore di funzionalità gestite
tramite strumenti esterni che richiedono un costante monitoraggio.
Per questi motivi, si può ipotizzare l’utilizzo di un sito di questo tipo per ONG di piccole
o medie dimensioni, che non possano permettersi costi aggiuntivi per sostenere la propria
presenza sul web, ma con organici già più numerosi rispetto a quelle per cui è stato
progettato il template base. La presenza in questi organici di volontari o collaboratori con
un minimo di competenze di web design risulterebbe altresì utile per trarre il massimo
profitto dall’utilizzo degli strumenti presentati. Si può ipotizzare che ONG di questo tipo
tendano attualmente già a disporre di un sito definito in questa sede come interattivo.
10 Prezzi tratti dal sito http://creator.zoho.com, in data 19/01/2010.
41
2.2.3 Template avanzato: piattaforma Webs + Ning
http://www.prototipoong.webs.com
Il template avanzato rappresenta il massimo livello di complessità funzionale raggiunto in
questo lavoro di creazione di prototipi. In esso trovano posto tutte le funzionalità
presentate precedentemente, con l’aggiunta di una complessa social network dedicata agli
utenti interni dell’organizzazione e collegata ad un sito dedicato al videoconferencing. La
tabella successiva riepiloga gli strumenti utilizzati per realizzare quest’ultimo prototipo;
in rosso le funzionalità non presenti nel template completo.
FUNZIONALITÀ PRESENTI
STRUMENTO UTILIZZATO
PROFILO ASSOCIATO: SITI SOCIALI
Pagine statiche Webs X
Calendario eventi Webs X
Pagina link Webs X
Photogallery Webs + Flickr X
Videogallery Youtube X
Download documenti Webs X
Mappe interattive Google maps X
Motore di ricerca Google Custom Search Engine X
Form iscrizione newsletter Wufoo X
Donazioni dirette Pulsanti di Paypal X
Slideshow Webs X
Contact form Jotform X
Blog Webs X
Feed RSS Webs X
Share button Widget di addthis.com X
Profili sulle social network Facebook, Youtube, Flickr e Twitter X
Application form Zoho Creator X
Embedded document (ppt, pdf) ISSUU (pdf) e Slideshare (ppt) Non presente
Donazioni per progetto Webs X
Social network dell’ONG Ning X
Audio/video conferencing Dimdim Non presente
Document/desktop sharing Dimdim Non presente
Tabella 2.3 Le funzionalità presenti nel template avanzato e gli strumenti utilizzati per realizzarle.
42
Le piattaforme di site building utilizzate: Webs e Ning
http://www.webs.com e http://www.ning.com
Webs è un servizio per certi aspetti molto simile a Weebly: un site builder specificamente
progettato per la gestione e l’editing di pagine web. Rispetto a Weebly, Webs si distingue
però per una complessità funzionale molto maggiore, a scapito di una minore velocità
nell’esecuzione dei comandi e di un difficoltà di utilizzo leggermente più elevata. Webs
mette a disposizione molte più opzioni di personalizzazione del sito e delle funzionalità in
esso presenti.
La differenza e la novità più interessante rispetto agli altri site builder analizzati è la
possibilità di realizzare pagine specificamente progettate per gestire singole funzioni
interattive, tipiche di un sito web. In questa sede sono state utilizzate quelle relative all’e-
commerce, alla photogallery, al calendario degli eventi, al blog e alla pagina dei link.
Oltre a queste, Webs permette la creazione di guestbook, forum, videogallery e wiki
interne al sito. Il back office per la gestione di tutte queste pagine particolari è unico:
ciascuna funzionalità dispone di un buon numero di opzioni di personalizzazione e
richiede modalità di gestione adatte ai contenuti che ospita. Lo svantaggio derivante
dall’utilizzo di queste pagine specifiche è l’impossibilità di modificarne il layout dei
contenuti, che deve restare quello del tema scelto per la grafica. Inoltre, in queste pagine
non è possibile aggiungere contenuti diversi da quelli per cui sono state create, eccezion
fatta per un paragrafo di testo (arricchibile con html) da posizionare obbligatoriamente
all’inizio.
Le limitazioni riguardanti la personalizzazione di layout e grafica non si esauriscono alle
pagine dedicate alle specifiche funzionalità interattive, ma coinvolgono l’intero impianto
grafico del sito. Webs infatti non dà la possibilità all’utente di modificare il codice css del
tema scelto, se non per pochi elementi predefiniti. Si possono comunque modificare gli
aspetti più evidenti, come la header, il titolo e i colori di sfondo. Un altro limite di Webs è
la mancanza di lingue alternative all’inglese per la gestione del sito e del back office.
Infine, si riportano quelli che probabilmente rappresentano gli svantaggi più grandi
derivanti dall’utilizzo di Webs, ovvero l’impossibilità di creare più di 20 pagine web per
il proprio sito nella versione free e la costante presenza in queste pagine di un
43
ingombrante banner pubblicitario. Entrambi questi problemi possono essere risolti
attraverso l’acquisto del primo pacchetto premium offerto Webs. Questo aspetto sarà
discusso meglio nel paragrafo dedicato alle considerazioni conclusive, ma risulta subito
evidente che si tratta di una seria limitazione, soprattutto se si considera la ricchezza di
contenuti e pagine tipica dei siti delle ONG.
Un’altra grande differenza rispetto a Weebly riguarda la possibilità, per l’amministratore,
di gestire la concessione di privilegi a particolari categorie di utenza, i membri del sito.
L’amministratore decide le modalità con cui gli utenti possono diventare membri (su
richiesta, accettabile anche automaticamente, o solo su invito) e chi può invitarne di
nuovi. Anche se non si possono aggiungere amministratori, ciascun membro dispone di
un proprio profilo e può essere messo in condizione di pubblicare post sul blog e
aggiungere foto e video. Una condizione che si avvicina a quella degli autori multipli del
blog di Wordpress, ma con meno possibilità di personalizzare i ruoli, e a quella degli
utenti di una piccola social network, in quanto Webs mette anche a disposizione per i
membri una chat per comunicare. Per il template avanzato non è stata prevista la
possibilità di registrare membri del sito, in quanto una funzionalità simile è gestita tramite
l’utilizzo di una social network esterna per i membri dell’organizzazione.
Lo strumento utilizzato per la realizzazione di quest’area riservata è Ning, una
piattaforma online per la creazione di social network personalizzate. Oltre a consentire
l’editing di pagine statiche, come un qualsiasi site builder, Ning permette di gestire
attraverso il sito un’intera comunità di utenti.
44
Home page, pagine statiche e architettura dell’informazione
Il template avanzato è composto da 9 sezioni, raggiungibili dal menu principale, e 9
sottosezioni. Con i temi forniti da Webs non è stato possibile creare un sistema di
navigazione che permettesse di raggiungere tali sottosezioni direttamente dal menu.
Pertanto esse sono state gestite tramite menu secondari nelle sezioni principali, creati
come semplici paragrafi di testo con link.
In questo template non sono disponibili breadcrumbs come ausilio alla navigazione, a
causa della rigidità della struttura delle pagine imposta dal site builder. Il sistema di
navigazione consente comunque di mantenere l’orientamento grazie alla combinazione
dei titoli e degli eventuali menu secondari, che crea un effetto simile a quello delle
breadcrumbs.
La home page, mostrata nell’immagine alla pagina successiva (figura 2.9), è molto simile
a quella del template precedente, in quanto ospita anche qui il blog come contenuto
principale. Sopra al blog sono posizionati alcuni link veloci alle pagine interne dedicate
agli obiettivi, ai progetti e ai sostenitori. Altri link veloci sono posizionati nella sidebar e
permettono di raggiungere la pagina dedicata al sostegno a distanza, i profili sulle social
network (social button) e l’area riservata (la social network esterna creata con Ning).
Anche qui, come nel template precedente, nella sidebar sono presenti il pulsante per
effettuare donazioni libere e quello per condividere la pagina visualizzata (share button).
Inoltre, in questo template il form per l’iscrizione alla newsletter è posizionato anch’esso
nella sidebar e rimane visibile in tutte le pagine.
Le pagine statiche sono state realizzate mediante l’editor di Webs e la maggior parte di
esse presenta gli stessi contenuti già mostrati per gli altri template. Tuttavia, per alcune di
queste pagine sono state utilizzate le funzionalità apposite messe a disposizione da Webs.
In particolare, vengono gestite in questo modo la pagina dedicata agli eventi (vedi figura
2.10) e quella riservata ai link dei sostenitori (figura 2.11), che aggiunge ai semplici link
testuali le anteprime dei siti a cui sono collegati (qui fittizie).
45
Figura 2.9 La home page del template avanzato, dedicata al blog. Il livello di zoom è stato diminuito per permetterne la visualizzazione a tutta pagina, pertanto le proporzioni tra gli elementi potrebbero risultare alterate.
46
Figura 2.10 Particolare della sezione “Eventi” nel template avanzato, gestita con l’apposito strumento di Webs.
Figura 2.11 Particolare della sezione “Sostenitori” nel template avanzato, gestita con l’apposito strumento di Webs.
47
Considerazioni conclusive sul template avanzato
La costruzione di questo prototipo non ha richiesto l’utilizzo di alcun tipo di abbonamento
premium. Tuttavia, ciò è dovuto unicamente alla natura dimostrativa del template. Un
utilizzo reale di Webs per la costruzione di un sito per ONG dovrebbe prevedere
l’acquisto del primo pacchetto premium, dal costo di $4,16 al mese11, sia per permettere il
superamento delle 20 pagine web concesse con la versione free, sia per poter rimuovere
gli ingombranti annunci pubblicitari dal proprio sito. Le fasce superiori di abbonamento
premium di Webs forniscono ulteriori vantaggi, come un aumento dello spazio disco a
disposizione o un maggior numero di prodotti inseribili nella propria pagina di
e-commerce. Tali vantaggi sono però ugualmente conseguibili senza dover sostenere
alcun costo, semplicemente utilizzando servizi SaaS appositi, come gli online storage
system per il caricamento dei file e i pulsanti di Paypal per la creazione di una pagina di
e-commerce indipendente da Webs.
Inoltre, anche per questo prototipo valgono le considerazioni espresse al paragrafo
precedente per un’eventuale sottoscrizione di un abbonamento premium per Zoho
Creator, per permettere ai propri database di ospitare un numero maggiore di record. Un
altro strumento che dispone di alcuni pacchetti premium è Dimdim, il software per le
riunioni online. L’unica funzionalità interessante offerta da questi abbonamenti, tuttavia, è
la possibilità di supportare broadcaster multipli (anche se soltanto uno alla volta), quindi
di realizzare un ambiente di lavoro adatto anche alle riunioni, non soltanto alla
formazione online. Il costo dell’abbonamento premium che garantisce questa funzionalità
è proibitivo, di $50 al mese, e decisamente sproporzionato rispetto ai vantaggi che ne
deriverebbero.
Pertanto, si può ipotizzare che l’utilizzo reale di un sito così strutturato possa costare da
un minimo di $4,16 al mese (circa $50 all’anno), per l’acquisto del primo pacchetto
premium di Webs, a un massimo variabile e dipendente dall’eventuale sottoscrizione di
un abbonamento premium con Zoho Creator. Al di là delle considerazioni economiche,
un sito costruito sul modello del template avanzato risulta più complesso da gestire
rispetto ad uno che si ispiri al template completo, a causa del numero maggiore di
11 Prezzo tratto dal sito www.webs.com, in data 20/01/2010.
48
strumenti da monitorare e moderare. In questo prototipo sono infatti presenti anche una
social network e un collegamento ad un sito di online meeting, entrambe funzionalità che
necessitano di essere costantemente supervisionate. Per questo motivo, un’ipotetica ONG
che voglia ispirarsi a questo template come modello per la propria presenza sul web dovrà
possedere un organico abbastanza ampio da includere anche volontari e collaboratori
impegnati a tempo pieno nella gestione delle sue funzionalità più complesse.
L’obiettivo di questo prototipo è permettere la realizzazione di un sito sociale, per certi
aspetti anche più versatile rispetto al profilo così denominato nella sezione 1, non soltanto
per le ONG di grandi dimensioni, che possono investire ingenti capitali in questo campo,
ma per tutte quelle organizzazioni che, disponendo di un numero sufficiente di dipendenti
da allocare alla gestione del sito, intendono sfruttare tutte le opportunità che il Web 2.0
mette attualmente a disposizione con i suoi servizi più innovativi ed economici.