Post on 16-Jan-2015
description
3. SITE BUILDER 2.0
Corso Laboratorio Internet – Prof. Roberto Polillo
Università degli Studi di Milano Bicocca – Anno Accademico 2010-11
R.Polillo - Ottobre 2010
2
Web site builders: tipi
On-line web site builders Off-line web site builders
http://en.wikipedia.org/wiki/Website_builder
R.Polillo - Ottobre 2010
3
On-line Web site builders
Applicazioni proprietarie, che permettono di costruire e pubblicare siti web
Il sito viene costruito interamente on-line, senza necessità di programmazione
Può essere personalizzato in vari modi: scelta del tema grafico, uso di widget, …
A volte si può personalizzare il codice o modificare i CSS
Di solito, servizio base gratuito + servizi “premium” a pagamento mensile
R.Polillo - Ottobre 2010
4
On-line site builders da noi utilizzati
www.weebly.comApplicazione base gratuita, servizi premium
www.webs.comApplicazione base gratuita; servizi premiun
Inoltre, online social network builders: www.ning.com
Solo servizi premium www.socialgo.com
Applicazione base gratuita; servizi premium
R.Polillo - Ottobre 2010
5
www.weebly.com
Facilissimo da usare, personalizzazione con drag&drop Da fine 2006, ora più di un milione di utenti Anche funzioni di blog, e-commerce, adsense È possibile editare il codice HTML e i CSS del sito Problema: non esiste gestione dei ruoli per il
backoffice
http://en.wikipedia.org/wiki/Weebly
R.Polillo - Ottobre 2010
6
Esempi (da questo corso)
www.comproj.weebly.com (Info in http://www.tangonet.it/esempio-di-uso-di-weebly-il-sito-della-cooperativa-comunita-progetto )
R.Polillo - Ottobre 2010
7
Template dimostrativo per ONG http://prototipoong.weebly.com
Semplice sito statico con menu gerarchico a sx Blog (per News) Donazioni online Photo gallery Download documenti PDF Cerca nel sito Google map Share buttons form su mail dell’amministratore Fan page su Facebook e canale Youtube
Descrizione del template in http://www.tangonet.it/profili-e-template-per-i-siti-web-delle-ong
R.Polillo - Ottobre 2010
8
Esempi
http://david.weebly.com Il blog del creatore di Weebly
http://golf4acure.weebly.com/ http://video.weebly.com Mia prova:
http://robertop.weebly.com
R.Polillo - Ottobre 2010
9
www.webs.com
Molto facile da usare Hosting della versione base gratuita:
spazio e banda limitati, non ad-free Servizi premium a pagamento (da 5 a 20
USD al mese circa) Dal 2001, ora più di 20 milioni di siti
R.Polillo - Ottobre 2010
11
www.webs.com: funzioni
Blog Forum Members (semplice social network) Upload di files, foto, video, … E-commerce (shopping cart, pagamento via Paypal) Site statistics Vari widgets Molti temi predefiniti Alcuni temi wireframe (molto importanti per la nostra
metodologia): Blank Centered (navigazione orizzontale centrata) Blank Top (navigazione orizzontale) Blank Left (navigazione verticale sinistra) Blank Right (navigazione verticale destra)
12
Temi: esempio
R.Polillo - Ottobre 2010
R.Polillo - Ottobre 2010
13
Template dimostrativo per ONG http://www.prototipoong.webs.com
Sito piuttosto complesso con menu gerarchico orizzontale Blog (per News) Donazioni online ed e-commerce Eventi Photo gallery Form Rivista on line con issuu Cerca nel sito Google map per i progetti Share buttons Fan page su Facebook , canale Youtube, pagina twitter e flickr Social network con n ning
Descrizione del template in http://www.tangonet.it/profili-e-template-per-i-siti-web-delle-ong
R.Polillo - Ottobre 2010
14
www.ning.com
Template dimostrativo per ONG:http://prototipoong.ning.com
Descrizione del template in http://www.tangonet.it/profili-e-template-per-i-siti-web-delle-ong
R.Polillo - Ottobre 2010
15
Off-line Web site builders
Si deve scaricare il software e installarlo su un server (proprio o di un provider)
Si rivolgono a utenti più esperti, e sono più flessibili
Possonono essere proprietari o open source, gratuiti o a pagamento
R.Polillo - Ottobre 2010
16
Off-line site builders da noi utilizzati
www.wordpress.org Gratuito, open-source, molto semplice da usare, molto ricco di widget e plugin pronti all’usoLo consigliamo per questo corso!
www.joomla.org Gratuito, open-source, più complesso da usare.
R.Polillo - Ottobre 2010
17
WordPress
Blog publishing and content managemet system, open source e gratuito
Nato a fine 2003 sulla base di un precedente sistema nato nel 2001
Probabilmente blog builder più diffuso Facile da usare, può essere personalizzato
anche in modo molto sofisticato http://en.wikipedia.org/wiki/WordPress
R.Polillo - Ottobre 2010
18
WordPress: possibilità
Versione online su www.wordpress.comHosting gratuito, personalizzazioni molto limitateSconsigliabile
Versione scaricabile da www.wordpress.org , da installare su proprio server (o su proprio provider)Completamente personalizzabile, consigliato
Versione multiblog www.mu.wordpress.com Piattaforma sofisticata di multi-blogging
R.Polillo - Ottobre 2010
19
Esempio: http://www.prototipoong.ilbello.com
• Articoli (post)• Pagine
R.Polillo - Ottobre 2010
20
Articoli
Sono i post del blog Possono contenere testi e inserti multimediali (foto, video,
audio, pdf) Presentati in ordine cronologico (di solito), di solito (ma non
sempre) in home Generano feed RSS Commenti abilitabili Categorie e tag Scrivibili da più autori Pubblici, protetti da psw, privati Pubblicazione programmabile (quando) Possono essere usati per le news Un solo blog (nuova versione: multi-blog)
21
Scrittura di articoli: interfaccia
R.Polillo - Ottobre 2010
R.Polillo - Ottobre 2010
22
Pagine
Contenuti statici Più livelli gerarchici Possono contenere testi e inserti multimediali
(foto, video, audio, pdf) Commenti abilitabili Templates (Archivio, Link, personalizzabile)
R.Polillo - Ottobre 2010
23
Temi
Tema: codice predefinito che descrive l’apparenza grafica (e altro) del sito
Numerosissimi temi predefiniti, di ogni tipo, gratuiti o a pagamento
L’adozione di un tema non richiede scrittura di codice
Si può cambiare tema con un clic
Esempi: www.rpolillo.it www.tangonet.it www.labtango.wordpress.com
R.Polillo - Ottobre 2010
24
Temi tipici
Header
Colonna 1 Colonna 2 [Colonna 3]
Footer
[Menu orizzontale]
1, 2 o 3 colonne
Versione base:Blog di default / tema di default
R.Polillo - Ottobre 2010
R.Polillo - Ottobre 2010
26
Widgets
Widget = window gadget
termine generico che denota un elemento grafico dell’interfaccia utente (dal Progetto Athena,1988)
Wordpress fornisce molti widget, tipicamente per personalizzare la barra laterale, senza scrivere codiceEsempi:
• Articoli recenti• Categorie• Link• Archivi• Calendario
• Tag cloud• Cerca• Commenti recenti• Testo• Meta www.tangonet.it
Blog di default / altro tema predefinito
Blog di default / altro tema predefinito
Blog di default / altro tema predefinito
Blog di default / altro tema predefinito
R.Polillo - Ottobre 2010
31
Back-office
Viene personalizzato a seconda dei ruoli dell’utente
Si può scegliere la lingua, fra un insieme molto ampio
R.Polillo - Ottobre 2010
32
Back-office: ruoli
Amministratore (administrator)Può fare tutto (possono esserci più amministratori)
Editore (editor)Ha ampi poteri, ma solo sui contenuti: articoli, pagine, categorie, commenti (non può intervenire su temi, plugin, widget)
Autore (author)Può scrivere, cancellare e modificare articoli e caricare file, e approvare e modificare i commenti agli articoli. Non può intervenire sugli articoli di altri autori.
Collaboratore (contributor)Può creare articoli, ma non può pubblicarli (devono essere approvati da un editore o amministratore)
R.Polillo - Ottobre 2010
33
Plugin
Sono il punto di forza di WordPress Permettono di estenderne le funzionalità
in modo molto facile e ampio Disponibili migliaia (?) di plugin Bisogna cercarli e provarli
R.Polillo - Ottobre 2010
34
Alcuni plugin sperimentati
Authors Widget vers.1.7Widget per selezionare i post per autore
Author exposed ver.1.0Pop-up sul post con scheda autore
Enhanced Categories vers.2.2Widget per selezionare i post per categorie gerarchiche
Flexo Archives vers.1.0.13Widget per selezionare i post per data
SuperTag Widget vers.1.3Widget per gestione di Tag Cloud
R.Polillo - Ottobre 2010
35
Alcuni plugin sperimentati
Google Translator vers.0.0.2Widget per tradurre le pagine in 32 lingue
Google Ajax Translator vers.0.5.1Google translate sui singoli post (funziona?)
Wp Geo vers.3.1.4Localizza il post su una mappa Google Map
PollDaddy Polls&RatingsGestione questionari on-line e user-rating
AddToAny: Share/Bookmarks/Email Button vers.9.9.5Share buttons per moltissimi siti
Fixed social buttons vers.2.4.4.8Social button vari
Dynamic Headers by Nicasio Design vers.3.5.1Immagine di testata variabile
Slickr FlickrPhoto gallery da flickr
R.Polillo - Ottobre 2010
36
Alcuni plugin sperimentati
I Maters WP Faq vers.0.1Per la gestione delle FAQ
Page links to vers.2.3Associa link ai tab del menu principale
Tal.ki Embeddedable Forum vers.1.1.5Forum (con diverse limitazioni)
WP-Contact Form vers.1.5.1.1Form per contatti via email
Wp-User onlineMostra utenti online
Ultimate Google AnalyticsAttiva Google Analytics sul sito
R.Polillo - Ottobre 201037
R.Polillo - Ottobre 2010
38
Altri plugin consigliati
All In One SEO PackDefinizione dei meta-tag per i motori di ricerca
NextGEN GalleryPhoto gallery
WordPress.com StatsAnalisi del traffico semplificata
Contact Form 7Definizione contact form
Bad BehaviorAnti-spam
WordPress Mobile PackInterfaccia mobile (anche per back-office)
GD Star RatingGestione user-rating di articoli, commenti e pagine
Viper’s Video QuicktagsFacilita l’inserimento dei video nei post
SociableShare buttons per post
NB: Questi plugin sono consigliati nel libro:Tiziano Fogliata, Crea il tuo blog con WordPress, HOEPLI Informatica, 2010 (non li ho provati)
R.Polillo - Ottobre 2010
39
Esempi di applicazioni evolute
http://newmusicnation.com http://alexking.org http://mosaic-consulting.com http://b5media.com http://hotair.com http://mommycast.com http://ewebscapes.com
R.Polillo - Ottobre 2010
40
Dove installare il sito
Su un proprio server e dopo? Su un server del cliente lo sa gestire? Utilizzando un servizio di hosting
a pagamento gratuito suggerito
La registrazione di un proprio dominio è comunque a pagamento
R.Polillo - Ottobre 2010
41
Esempio: www.altervista.org Servizio di hosting gratuito, italiano Un milione di siti ospitati Possibile accettare pubblicità, con
revenue sharing www.yourname.altervista.org
R.Polillo - Ottobre 2010
42
Altervista: due tipi di servizi
Massima flessibilitàMassima semplicità(vedi http://it.altervista.org/come-fare-blog.php )
Differenze, vantaggi e svantaggi in http://blog.altervista.org/it/differenze-tra-alterblog-e-altersito-con-wordpress/
R.Polillo - Ottobre 2010
43
Altervista: nome di dominio
Posso registrare un dominio del tipo:www.miosito.it a pagamento (circa 10 Euro all’anno)
http://it.altervista.org/wiki/index.php/FAQ_Domini_di_secondo_livello#Come_faccio_a_registrare_un_dominio.3F
R.Polillo - Ottobre 2010
44
Una introduzione a Wordpress Tiziano Fogliata
Crea il tuo blog con WordPress HOEPLI Informatica, 2010 (€19,90)
Consigliato per questo corso
Queste slides…
R.Polillo – Ottobre 2010
45
Queste slide sono disponibili con licenza Creative Commons (attribuzione, non commerciale, condividi allo stesso modo) a chiunque desiderasse utilizzarle, per esempio a scopo didattico, senza necessità di preventiva autorizzazione.
La licenza non si estende alle immagini fotografiche e alle screen shots, i cui diritti restano in capo ai rispettivi proprietari, che sono stati indicati, ove possibile. L’autore si scusa per eventuali omissioni, e resta a disposizione per correggerle.