Università degli Studi di Milano BicoccaDipartimento di Informatica, Sistemistica e Comunicazione

Corso di Strumenti e applicazioni del Web

8. Il vostro blog: che cosa

fare e come farlo bene

Roberto Polillo

Edizione 2014-15

2

Queste slides fanno parte del corso “Strumenti e applicazioni del Web”. Ilsito del corso, con il materiale completo, si trova inwww.corsow.wordpress.com . Data la rapida evoluzione della rete, il corsoviene aggiornato ogni anno.

Il presente materiale è pubblicato con licenza Creative Commons“Attribuzione - Non commerciale - Condividi allo stesso modo – 3.0”(http://creativecommons.org/licenses/by-nc-sa/3.0/it/deed.it ):

La licenza non si estende alle immagini provenienti da altre fonti ealle screen shots, i cui diritti restano in capo ai rispettivi proprietari,che, ove possibile, sono stati indicati. L'autore si scusa per eventualiomissioni, e resta a disposizione per correggerle.

R.Polillo - Marzo 2015

Queste slides

Wordpress: elementi base

Articoli (post)Titolo, autore, data, categorie, tag, [commenti]

Pagine (pagine statiche)

PluginPermettono di aggiungere funzionalità (es. widget) in modo immediato, senza programmazione

TemiCodice che descrive l’apparenza grafica (e altro) del sito; possono essere cambiati con un clic

3

R.Polillo - Marzo 2014

ArticoliR.Polillo -

Marzo 20144

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

Hanno categorie e tag

Commenti abilitabili

Scrivibili da più autori

Pubblici, protetti da psw, privati

Pubblicazione programmabile (quando)

Generano feed RSS

PagineR.Polillo -

Marzo 20145

Contenuti statici

Più livelli gerarchici

Possono contenere testi e inserti multimediali (foto, video, audio, pdf)

Commenti abilitabili

R.Polillo - Marzo 20146

TemiR.Polillo -

Marzo 20147

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

Temi: strutture tipicheR.Polillo -

Marzo 20158

Header

Colonna 1 Colonna 2 [Colonna 3]

Footer

[Menu orizzontale]

1, 2 o 3

colonne

Anche:

Struttura a

tiles

Responsive designR.Polillo -

Marzo 20159

I “blocchi” che compongono una pagina vengono “impaginati” in modo diverso in funzione delle dimensioni e geometria dello schermo:

R.Polillo - Marzo 201510

Media query (HTML5)

Da HTML si può identificare il device che riceve la pagina, e comporre layout diversi a seconda dei casi: responsive design

Una sola pagina per tutti i device

R.Polillo - Marzo 2015

11

Responsive design (segue)R.Polillo -

Marzo 201512

…o possono essere selezionati blocchi diversi. Ad esempio, menu di

diverso tipo:

Esempi

Sito responsive:

http://thenextweb.com

www.rpolillo.it

Non confondere i siti responsive con i siti cosiddetti a layout liquido (in uso da molti anni):

http://www.governo.it

R.Polillo - Marzo 2015

13

PluginR.Polillo -

Marzo 201414

Sono il punto di forza di WordPress

Permettono di estenderne le funzionalità in modo molto facile e ampio

Ce ne sono migliaia, bisogna cercarli e provarli

Plugin: esempiR.Polillo -

Marzo 201415

Authors Widget Widget per selezionare i post per autore

Author exposed Pop-up sul post con scheda autore

Enhanced Categories Widget per selezionare i post per categorie gerarchiche

Flexo Archives Widget per selezionare i post per data

SuperTag Widget Widget per gestione di Tag Cloud

WP-Contact Form Form per contatti via email

Plugin: esempiR.Polillo -

Marzo 201416

Ultimate Google AnalyticsAttiva Google Analytics sul sito

All In One SEO PackDefinizione dei meta-tag per i motori di ricerca

Google TranslatorWidget per tradurre le pagine in 32 lingue

Wp Geo Localizza il post su una mappa Google Map

PollDaddy Polls&RatingsGestione questionari on-line e user-rating

AddToAny: Share/Bookmarks/Email Button Share buttons per moltissimi siti

Dynamic Headers by Nicasio Design Immagine di testata variabile

Slickr FlickrPhoto gallery da flickr

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)

NB: Il backoffice è disponibile in moltissime lingue

17R.Polillo -Marzo 2014

Dove installare il vostro blogR.Polillo -

Marzo 201418

Potete usare per esempio www.altervista.org

Servizio di hosting gratuito, italiano

www.yourname.altervista.org

Altervista: due tipi di serviziR.Polillo -

Marzo 201419

Massima flessibilitàMassima semplicità

L’obiettivo del vostro progetto

Realizzare un blog che contenga informazioni utilie aggiornate sull’argomento scelto

Non dovete fare i redattori (o i giornalisti…), ma i “curatori di contenuti”

R.Polillo - Marzo 2015

20

Content curation

“L’atto di identificare, selezionare e condividere con continuità i contenuti online migliori e più rilevanti e le altre risorse online su uno specifico soggetto, per soddisfare le necessità di una specifica audience”

(Ann Handley)

R.Polillo - Marzo 2015

21

Il processo della content curation

R.Polillo - Marzo 2015

22

Da Beth Kanter

Esistono degli strumenti per farlo in modo efficienteEs.: scoop.it

In sostanza

Cercate le fonti più valide sul vostro tema, e monitorale con una certa continuità

Selezionate gli articoli più rilevanti (con juicio!)

Segnalateli con poche, efficienti righe di testo:

titolo chiaro

Brevissimo sommario (che cosa e perché)

Link

R.Polillo - Marzo 2015

23

Esempi da discutere (non tutti ok)

Alcuni blog realizzati dagli studenti dello scorso anno:

https://corsow.wordpress.com/2014/06/23/i-blog-realizzati-dagli-studenti/

Esempi di content curation:

http://www.thinkinnovation.org

http://humanfoundation.it

R.Polillo - Marzo 2015

24

Tools di content curation

Ne esistono diversi

Sperimentate http://scoop.it !

R.Polillo - Marzo 2015

25

Demo di Google Analytics

R.Polillo - Marzo 2015

26