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.
1

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
2.1
Introduzione
e
metodologia
pag.
23
2.2
I
template
pag.
25
2.2.1
Template
base:
piattaforma
Weebly
pag.
26
2.2.2
Template
completo:
piattaforma
Wordpress
pag.
34
2.2.3
Template
avanzato:
piattaforma
Webs
+
Ning
pag.
41
2

3. 1.
Diversi
profili
per
i
siti
delle
ONG
italiane
1.1
Obiettivi
della
ricerca
Dall’analisi di Donato Francavilla2 è emerso come i siti delle ONG italiane risultino
carenti sotto diversi aspetti e particolarmente dal punto di vista delle funzionalità: nella
maggior parte di essi mancano gli strumenti che permettono all’utente di interagire con
l’organizzazione direttamente attraverso il sito, ad esempio effettuando donazioni online,
iscrivendosi a newsletter periodiche o RSS feed e interagendo con i profili dell’ONG su
diverse social network.
Partendo da queste considerazioni, nella presente sezione verrà approfondita l’analisi
degli aspetti funzionali dei siti delle ONG italiane. Non sono disponibili in letteratura
ricerche su questo argomento, essendo il campo di interesse molto ristretto e specifico.
Per questo motivo è stata effettuata dall’autore di questa tesi, in collaborazione con
Alessio Gattuso, una breve analisi qualitativa, il cui scopo è quello di individuare i diversi
livelli di complessità funzionale ai quali è possibile ricondurre, in maniera
approssimativa, i siti analizzati. I profili così ricavati, caratterizzati ciascuno dal proprio
set tipico di strumenti interattivi, saranno quindi utilizzati per guidare la progettazione di
template di siti per ONG, costruiti sfruttando le opportunità offerte dai servizi in rete e dal
cloud computing, al minor costo possibile. A ciascun livello, corrispondente a particolari
esigenze per una ONG, sarà associato un template di simile complessità.
2
Francavilla,
Donato,
Analisi
dei
siti
web
delle
ONG
italiane,
tesi
di
laurea
in
Teoria
e
Tecnologia
della
Comunicazione,
Università
Statale
di
Milano
Bicocca,
a.a.
2008/2009.
3

4. 1.2
Metodologia
dell’analisi
funzionale
I siti di cui sono state analizzate le funzionalità sono quelli dell’elenco delle ONG idonee
(http://www.cooperazioneallosviluppo.esteri.it/pdgcs/italiano/Partner/ONG/ONG.asp).
Per ciascun sito è stato stilato un elenco degli strumenti interattivi presenti e, se
necessario, sono state aggiunte alcune considerazioni generali in merito al loro utilizzo e
alla qualità del sito e delle informazioni in esso presenti.
Sono stati considerati come interattivi tutti quegli strumenti che permettono all’utente di
interagire direttamente con l’organizzazione e con gli altri utenti del sito; ad esempio la
funzionalità di donazioni online, il blog, il forum e i diversi form per l’invio di messaggi,
per l’iscrizione alla newsletter o per le offerte di collaborazione.
Inoltre, sono stati inclusi nella definizione anche gli strumenti che consentono
all’organizzazione di collegare ed integrare il sito con le principali social network
(Facebook, Twitter, Flickr e molti altri), sfruttando le loro funzionalità e la loro capacità
di connettere reti di persone anche molto eterogenee tra loro. Fanno parte di questa
categoria strumenti quali i pulsanti per la condivisione dei contenuti della pagina
visualizzata (share button) e i social button, collegamenti diretti dal sito ai profili
dell’organizzazione sulle diverse social network.
Infine, per meglio caratterizzare anche i siti più poveri dal punto di vista interattivo,
accanto agli strumenti sopra descritti è stata valutata anche la presenza di alcune
funzionalità tipiche di un sito statico, ad esempio la photogallery, la videogallery, il
calendario degli eventi e la presenza di mappe cliccabili per la localizzazione di
informazioni e per i contatti.
Alla pagina seguente è riportato un esempio di risultato dell’analisi di un sito di media-
bassa complessità funzionale:
4

5. AIFO
-­‐
Associazione
Italiana
Amici
di
Raoul
Follereau
www.aifo.it
Funzionalità
presenti:
 Pagina link;
 Search;
 Donazione online (tramite Vpos di Banca popolare Etica);
 Photogallery;
 Videogallery.
Osservazioni:
versione in inglese;
home = news + link veloci;
approfondimenti utili su argomenti correlati;
testi molto lunghi non adatti al web e non introdotti da adeguati abstract.
Come si può vedere nell’esempio sopra riportato, per motivi di tempo e per il fatto che
questa valutazione, per quanto utile, non è centrale rispetto all’obiettivo di questa tesi,
l’analisi è stata effettuata in modo molto veloce, con metodi qualitativi e soggettivi.
Riteniamo comunque che questo approccio risulti adeguato alla raccolta delle
informazioni necessarie per il presente lavoro, il cui scopo principale è quello di
individuare dei profili in qualche modo tipici in relazione alle necessità delle ONG
italiane, e costruire poi dei template che mostrino come i siti corrispondenti a questi
profili possano essere realizzati a basso costo con strumenti e servizi disponibili in rete.
In particolare, l’obiettivo di questa analisi è l’individuazione di profili con diversi livelli
di complessità funzionale nella presenza online delle ONG italiane. Ciascun profilo sarà
definito tramite il set tipico di strumenti interattivi che i siti mettono a disposizione
dell’utente e rappresenterà la base di partenza per progettare il relativo template.
5

6. 1.3
Risultati:
tre
profili
per
i
siti
delle
ONG
italiane
Per ragioni di spazio non è qui possibile riportare tutte le analisi dei siti dell’elenco; ci si
limiterà dunque ad esporre le conclusioni di questa breve ricerca qualitativa. Dopo aver
raccolto ed analizzato le funzionalità dei siti, nel modo esemplificato alla pagina
precedente, sono stati distinti e caratterizzati i diversi approcci alla presenza web delle
ONG, in termini di numero e complessità delle funzioni interattive offerte all’utente,
individuando tre livelli di complessità funzionale. In ordine crescente:
 siti statici;
 siti interattivi;
 siti sociali.
Questi tre profili rappresentano una categorizzazione approssimativa dei siti delle ONG
italiane. La denominazione dei tre livelli è totalmente arbitraria. Di seguito saranno
descritti i profili corrispondenti e per ognuno di essi si fornirà qualche esempio; una
tabella riassuntiva chiuderà questa rassegna.
Profilo
1:
siti
statici
Il livello di complessità più basso: in questa categoria rientrano tutti quei siti
sostanzialmente privi di funzionalità interattive. Gli unici strumenti interattivi
rintracciabili anche a questo livello, presenti quindi nella maggior parte dei siti analizzati,
sono le mappe interattive e il motore di ricerca interno.
Risultano invece assenti molte delle funzionalità desiderabili: in primo luogo le donazioni
online e l’integrazione con profili su diverse social network, quindi la presenza di form
per lasciare messaggi in modo facile e veloce o per presentare online proposte di
collaborazione e lavoro volontario. In siti di questo tipo è comunque presente una sezione
per le donazioni, ma consiste semplicemente nell’elenco dei modi per donare una somma
di denaro tramite i canali tradizionali, ad esempio bonifico bancario o bollettino postale
(vedi le figure 1.1 e 1.2 per le sezioni dedicate alle donazioni e al reclutamento di
volontari dell’ONG Movimento Africa ‘70).
6

7.
Figura
1.1
La
tipica
sezione
dedicata
alle
donazioni
in
un
sito
statico.
Fonte:
http://www.africa70.org,
04/01/2010.
Figura
1.2
La
tipica
sezione
per
il
reclutamento
dei
volontari
in
un
sito
statico.
Fonte:
http://www.africa70.org,
13/01/2010.
7

8. A dispetto della scarsità di funzionalità interattive, questi siti, come quasi tutti quelli
analizzati, si distinguono per la grande ricchezza di contenuti, sia testuali sia
multimediali, principalmente immagini e documenti scaricabili in formato pdf. Spesso
questi contenuti sono organizzati mediante un’architettura dell’informazione scadente e
ambigua e non sono redatti in un formato adatto al web, presentandosi come lunghi testi
non adeguatamente suddivisi in paragrafi e non introdotti da abstract. La figura
sottostante (figura 1.3) ritrae una pagina di testo tipica di un sito che non cura
adeguatamente la presentazione dei contenuti, tratta da www.iahm.org.
Figura
1.3
Esempio
di
testo
non
adatto
al
web,
troppo
lungo
e
non
introdotto
da
adeguati
abstract.
Fonte:
www.iahms.org,
13/01/2010
8

9. L’approccio comunicativo tipico di questa categoria di siti è dunque quello del sito
vetrina, caratterizzato dalla presentazione delle informazioni su pagine statiche, con
l’aggiunta di immagini, eventualmente raccolte in una photogallery, di video, di link ad
altri siti associati e di documenti scaricabili. Lo scopo di un approccio di questo tipo è
quello di aumentare la visibilità dell’organizzazione sul medium Internet, senza
particolare attenzione per gli aspetti più interattivi e di amplificazione sociale che possono
rendere il web un mezzo di comunicazione unico e molto redditizio, in termini sia
economici che di reputazione.
Si propone qui sotto un breve elenco di siti web che possono essere considerati
rappresentanti tipici di questo livello di complessità funzionale:
 www.abcsverona.it;
 www.africa70.org;
 www.africamission.org;
 www.puntoapunto.org;
 www.iahm.org;
 www.icei.it;
 www.icsitalia.org;
 www.lvia.it;
 www.nuovispazialservire.it.
Per chiudere questa rassegna sui siti statici, viene riportata una tipica home page di un sito
di questo tipo, appartenente all’ONG Azione per un Mondo Unito (vedi figura 1.4 alla
pagina successiva). Le varie sezioni raggiungibili dalla home, pur essendo molto ricche di
contenuti, risultano composte solo da pagine statiche.
9

10.
Figura
1.4
La
home
page
del
sito
dell’ONG
Azione
per
un
Mondo
Unito.
Fonte:
http://www.azionemondounito.org,
04/01/2010.
Profilo
2:
siti
interattivi
Questo livello di complessità funzionale rappresenta un’evoluzione del sito statico, con
l’aggiunta di alcuni utili strumenti interattivi. Per quanto riguarda la quantità e il tipo di
contenuti, questi siti rimangono sugli standard di quelli del primo livello, anche qui
spesso con problemi di architettura delle informazioni e di impaginazione. La differenza
fondamentale è invece data dalla presenza di un buon numero di funzionalità aggiuntive.
Tipicamente si possono trovare, oltre a quelli già presenti nei siti statici, i seguenti
strumenti:
 strumenti per donazioni online, con transazioni gestite da terze parti (solitamente
Paypal o Vpos di Banca Etica); in figura 1.5 è riportato un esempio di pagina
dedicata alle donazioni online, dell’organizzazione OAF-I;
 form per inviare messaggi all’ONG o per sottoporle offerte di collaborazione;
 feed RSS per la sezione dedicata alle notizie;
10

11.  share button, per permettere all’utente di condividere in modo facile e veloce il
contenuto della pagina visualizzata;
 area riservata a collaboratori e volontari dell’organizzazione.
Figura
1.5
Il
pulsante
per
le
donazioni
online,
messo
a
disposizione
da
Paypal,
su
un
tipico
sito
interattivo.
Fonte:
www.oafi.org,
13/01/2010
Come già osservato in precedenza, questo elenco rappresenta soltanto
un’approssimazione degli strumenti tipici di questo grado di complessità funzionale. In
realtà, molti dei siti analizzati si collocano su un livello intermedio tra questo e quello che
è stato definito come sito statico, possedendo soltanto alcune delle caratteristiche
interattive sopra elencate. Il sito interattivo offre dunque all’utente un buon livello di
interattività, elevandosi da semplice vetrina per l’organizzazione a luogo di incontro e
scambio con potenziali donatori e collaboratori.
L’immagine alla pagina successiva (figura 1.6) ritrae la tipica home page di un sito
interattivo, dell’organizzazione AIFO. In alto a destra, il collegamento alla sezione di
donazioni online. Nella figura seguente (figura 1.7), tratta dal sito dell’ONG Ibo Italia,
viene invece mostrato un esempio di form per il reclutamento online di volontari.
11

12.
Figura
1.6
Home
page
tipica
di
un
sito
interattivo,
il
sito
dell’ONG
AIFO.
Fonte:
http://www.aifo.it,
04/01/2010
Figura
1.7
Esempio
di
form
per
il
reclutamento
online
di
volontari.
Fonte:
http://www.iboitalia.org,
04/01/2010.
12

13. Tuttavia, si rileva in questi siti una mancanza di attenzione per quanto riguarda le nuove
possibilità offerte dagli strumenti del Web 2.0: benché vengano utilizzati gli share button,
che offrono la possibilità all’utente di aumentare la visibilità dell’organizzazione sulle
principali social network, l’ONG solitamente non possiede, a questo livello, profili propri
su tali reti, collegati ed integrati con il sito web. Tale accorgimento, tipico invece delle
charity statunitensi, è infatti considerato in questa sede come il requisito per il passaggio
al livello di complessità funzionale successivo.
Si propone qui sotto un breve elenco di siti web che possono essere considerati
rappresentanti tipici di questo livello di complessità funzionale:
 www.aispo.org;
 www.actionaid.it;
 www.aifo.it;
 www.icu.it;
 www.oafi.org.
Profilo
3:
siti
sociali
La grande maggioranza dei siti delle ONG italiane esaminati si situa nei primi due livelli
di complessità funzionale, oppure su posizioni intermedie; sono state individuate poche
organizzazioni che cercano di trarre beneficio anche dagli strumenti del Web 2.0, come i
profili sulle più popolari social network. Ancora più rari sono i casi in cui questi profili
sono integrati correttamente e coerentemente con il sito web principale. I siti di quelle
ONG che riescono a garantire questo tipo di presenza web a 360 gradi, offrendo nel
contempo tutte o quasi le funzionalità proprie di un sito interattivo, rientrano nell’ultimo
livello di complessità funzionale, qui definito come sito sociale.
Il set di funzionalità tipico per quest’ultimo livello di complessità comprende, oltre a
quelle già osservate per i livelli precedenti:
 profili sulle più popolari social network, come Facebook, Twitter, Youtube e
Flickr, collegati con il sito istituzionale e da lì accessibili attraverso social button;
 integrazione delle informazioni presenti sui diversi profili, ad esempio tramite
l’importazione nel sito delle immagini caricate su Flickr e i video di Youtube;
13

14. L’immagine sottostante (figura 1.8) offre un esempio di come questi social button siano
integrati nella home page del sito italiano di AMREF. Le figure successive, 1.9 e 1.10,
mostrano invece i profili di Amref Italia su Facebook e Youtube.
Oltre ad offrire queste funzionalità aggiuntive, i siti sociali presentano un sistema di
donazioni online più articolato rispetto ai precedenti livelli, che non si limita alla
donazione libera e diretta, ma comprende anche la possibilità di donare per specifici
progetti o addirittura per specifici materiali necessari per la loro realizzazione (si veda la
figura 1.11 per un esempio di pagina per le donazioni di questo tipo, tratta dal sito
dell’associazione Soleterre). Si tratta di un modo molto efficace per rendere l’utente
consapevole della destinazione dei fondi di una potenziale donazione, una variabile
indicata anche da Estes e Nielsen come fondamentale per convincere i potenziali donatori
a sostenere l’organizzazione3.
Figura
1.8
Home
page
del
sito
italiano
di
AMREF,
ottimo
esempio
di
sito
sociale.
Fonte:
http://www.amref.it,
04/01/2010
3
Estes,
Janelle;
Nielsen,
Jakob,
Donation
Usability,
Fremont,
Norman
Nielsen
Group,
2009,
pagg.
11-­‐13
.
14

15.
Figura
1.9
La
pagina
Facebook
di
Amref
Italia.
Fonte:
http://www.facebook.com/pages/AMREF-­‐Italia,
13/01/2010.
Figure
1.10
Il
canale
Youtube
di
Amref
Italia.
Fonte:
www.youtube.com/user/amrefitalia,
13/01/2010.
15

16.
Figura
1.11
La
sezione
dedicata
alle
donazioni
del
sito
dell’associazione
Soleterre.
Fonte:
http://www.soleterre.it,
04/01/10
Un’altra importante differenza rispetto ai siti appartenenti al livello precedente riguarda la
gestione dell’area riservata, una sorta di intranet per l’ONG. Per i siti interattivi è stata
riscontrata la presenza sul sito di pagine accessibili soltanto agli utenti autorizzati. I siti
sociali affrontano la questione in modo diverso, ovvero mediante l’utilizzo di una social
network apposita, aperta soltanto ai membri, nella quale vengono caricati, gestiti ed
utilizzati i materiali elettronici relativi all’organizzazione. Alcune ONG impiegano anche
più di una social network, ciascuna relativa a una sezione territoriale dell’organizzazione
oppure a un particolare progetto, a volte parzialmente accessibili anche per utenti esterni.
Infine, l’analisi ha evidenziato come i siti che riescono a raggiungere questo livello di
eccellenza per le funzionalità interattive e l’approccio al Web 2.0 siano anche quelli con
l’architettura delle informazioni meglio organizzata e i contenuti testuali e multimediali
più fruibili, nonostante la mole di informazioni resti inalterata dai due livelli precedenti o
sia addirittura maggiore.
16

17. Si propone qui sotto un breve elenco di siti web che possono essere considerati
rappresentanti tipici di questo livello di complessità funzionale:
 www.acra.it;
 www.amref.it;
 www.emergency.it;
 www.manitese.it;
 www.savethechildren.it;
 www.soleterre.it;
 www.wwf.it.
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.
17

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
x
x
x
documenti
Mappe
interattive
x
x
x
Motore
di
ricerca
x
x
x
Form
iscrizione
-­‐
x
x
newsletter
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
-­‐
-­‐
x
progetto
Profili
sulle
social
-­‐
-­‐
x
network
e
relativi
social
button
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.
18

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.
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.
20

21.
PROFILO
PROFILO
PROFILO
BASE
COMPLETO
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
x
x
x
documenti
Mappe
interattive
x
x
x
Motore
di
ricerca
x
x
x
Form
iscrizione
x
x
x
newsletter
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
-­‐
x
x
progetto
Profili
sulle
social
x1
x2
x2
network
e
relativi
social
button
Embedded
-­‐
x
x
document
(presentazioni,
pubblicazioni)
Videoconferencing3
-­‐
-­‐
x
3
Audioconferencing
-­‐
-­‐
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).
21

22.
TEMPLATE
BASE
TEMPLATE
COMPLETO
TEMPLATE
AVANZATO
(PROFILO
BASE)
(PROFILO
COMPLETO)
(PROFILO
AVANZATO)
prototipoong.weebly.com
prototipoong.ilbello.com
prototipoong.webs.com
Pagine
statiche
Weebly
Wordpress
Webs
Calendario
eventi
Weebly
(statico)
Wordpress
(statico)
Webs
Pagina
link
Weebly
(statica)
Wordpress
(statica)
Webs
Photogallery
Weebly
Flickr
Webs
+
Flickr
Videogallery
Youtube
Youtube
Youtube
Download
Weebly
Wordpress
Webs
documenti
Mappe
interattive
Google
Maps
Google
Maps
Google
Maps
Motore
di
ricerca
Google
CSE
Wordpress
Google
CSE
Form
iscrizione
Form
creator
Zoho
Creator
Wufoo
newsletter
di
Weebly
Donazioni
dirette
Pulsanti
Paypal
Pulsanti
Paypal
Pulsanti
Paypal
Slideshow
Weebly
Flickr
Webs
Contact
form
Form
creator
Jotform
Jotform
di
Weebly
Application
form
-­‐
Zoho
Creator
Zoho
Creator
Blog
Weebly
Wordpress
Webs
Area
riservata
-­‐
Wordpress Ning
Social
Network
Feed
RSS
Weebly
Wordpress
Webs
Share
button
Widget
addthis.com
Widget
addthis.com
Widget
addthis.com
Donazioni
per
-­‐
Pulsanti
Paypal
Webs
progetto
Profili
sulle
social
Facebook
e
Youtube
Facebook,
Youtube,
Facebook,
Youtube,
network
e
relativi
Flickr
e
Twitter
Flickr
e
Twitter
social
button
Embedded
-­‐
ISSUU
(pdf)
e
ISSUU
(pdf)
e
document
Slideshare
(ppt)
Slideshare
(ppt)
(presentazioni,
pubblicazioni)
Videoconferencing3
-­‐
-­‐
Dimdim
3
Audioconferencing
-­‐
-­‐
Dimdim
3
Document
sharing
-­‐
-­‐
Dimdim
3
Desktop
sharing
-­‐
-­‐
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.
22

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.
23

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).
24

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
25

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.
PROFILO
DI
PARTENZA:
FUNZIONALITÀ
PRESENTI
STRUMENTO
UTILIZZATO
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.
26

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
27

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
28

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).
8
Estes,
Janelle;
Nielsen,
Jakob,
Donation
Usability,
Fremont,
Norman
Nielsen
Group,
2009,
pagg.
11-­‐12.
29

30.
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.
30

31.
Figura
2.4
La
pagina
dedicata
alla
presentazione
dei
progetti
dell’ONG
nel
template
base.
31

32.
Figura
2.5
Particolare
della
pagina
“Organigramma”
del
template
base.
Figura
2.6
Particolare
della
sezione
“Sostenitori”
nel
template
base.
32

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
33

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.
PROFILO
ASSOCIATO:
FUNZIONALITÀ
PRESENTI
STRUMENTO
UTILIZZATO
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.
34

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.
35

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
36

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.
37

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.
38

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.
39

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.
40

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À
PROFILO
ASSOCIATO:
STRUMENTO
UTILIZZATO
PRESENTI
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.
41

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
42

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.
43