| Date post: | 22-Jan-2018 |
| Category: |
Social Media |
| Upload: | paolo-sordi |
| View: | 350 times |
| Download: | 1 times |
PIACERE DI CONOSCERVI
PAOLO SORDI
Mail: [email protected] Web: www.ipertesti.me Twitter: @sordip Instagram: psordinsta LinkedIn: it.linkedin.com/in/paolosordi
Digital Communication & New Media Manager presso LUISS Guido Carli
1
PROGETTAZIONE E REALIZZAZIONE DI SITI WEB
A.A 2016/2017
CORSO DI LAUREA MAGISTRALE IN SCIENZE DELL’INFORMAZIONE, DELLA COMUNICAZIONE E DELL’EDITORIA UNIVERSITÀ DI ROMA TOR VERGATA
2
ARCHITETTARE L’INFORMAZIONE IN HTML
BACKEND
49
PRIMA DI HTML5
L’ARCHITETTURA DI UNA PAGINA WEB IN HTML
<div id=“header”>…</div>
<div class=“nav”>…</div>
<div class="entry"> …</div>
<div id="footer"> …</div>
55
56
HTML5
<HEADER>
Informazioni introduttive o di supporto alla navigazione.
57
HTML5
<NAV>
Collegamenti per la navigazione.
58
HTML5
<MAIN>
Il contenuto principale dell’elemento ‘body’.
59
HTML5
<SECTION>
Raggruppamenti tematici di contenuto, unificati e identificati preferibilmente da un titolo.
60
HTML5
<ARTICLE>
Contenuto autosufficiente di un documento, di una pagina o di un sito, potenzialmente usabile e distribuibile al di fuori del contesto originario.
61
HTML5
<ASIDE>
Sezione di pagina con un contenuto separato dal contenuto principale.
62
HTML5
<FOOTER>
Informazioni sulla sezione (attenzione: non sul documento) cui appartiene, come l’autore, la data o il copyright.
63
ARCHITETTARE L’INFORMAZIONE
UN SABATO AL CENTRO COMMERCIALE
64
QUOTIDIANITÀ
LA VIA CHE PORTA ALL’ABBIGLIAMENTO
Come è organizzato il tuo armadio?
65
STRUTTURE CHIARE
INFORMATION ARCHITECTS
L’architetto dell’informazione è la persona che
1) organizza ciò che è intrinseco nei dati, rendendo chiaro ciò che è oscuro,
2) crea la struttura o la mappa delle informazioni tramite la quale gli altri possono trovare la via che porta alla conoscenza.
(Richard Saul Wurman)
66
CONTESTO, CONTENUTI, UTENTI
IA SUL CAMPO: IL MONDO REALE
67
Contesto
Contenuti Utenti
WEB DESIGN
LE AREE GRIGIE DELL’IA
Design grafico
Usabilità
Content Management
Web Writing
Sviluppo software
...
68
IA
ARCHITETTARE L’INFORMAZIONE
1. Strutturare,
2. organizzare,
3. etichettare.
69
1
STRUTTURARE
Determinare il livello di approfondimento e granularità dei singoli componenti informativi del sito e decidere come metterli in relazione tra loro.
70
2
ORGANIZZARE
Raggruppare i singoli componenti informativi in categorie significative e distinte tra loro.
71
3
ETICHETTARE
Assegnare un nome alle categorie e ai collegamenti che portano alle categorie.
72
È IL WEB, BELLEZZA
RELAZIONI IPERTESTUALI
Diversi angoli di lettura e differenti strade di accesso alle tue informazioni: ciò significa che le relazioni da costruire non sono uniche e monodirezionali ma molteplici e multidirezionali.
73
METTERE ORDINE
CRITERI DI ORDINAMENTO
★ Tassonomico
★ Gerarchico
★ Cronologico
★ Alfabetico
★ Geografico
★ Tipologico
★ Utente
★ Azione
74
UGUALI PER TUTTI
ESATTI
★ Cronologico
★ Alfabetico
★ Geografico
75
DIPENDE
AMBIGUI
★ Argomento
★ Azione
★ Utenti
★ Metafora
76
8 PARAMETRI DI ANALISI DEI CONTENUTI
PER UNA PROGETTAZIONE CONSAPEVOLE DELL’ARCHITETTURA DELLE INFORMAZIONI.
77
1
COLLOCAZIONE
I contenuti riconducibili a un solo argomento vanno raggruppati in una stessa sola area.
78
2
DIFFERENZIAZIONE
I contenuti di natura diversa vanno distribuiti in diverse sezioni del sito (o della pagina).
79
3
CONTENUTO INFORMATIVO
Quando assembli informazioni, assicurati che le nomenclature e le soluzioni di presentazione che scegli di assegnare a quelle informazioni siano un segnale semantico forte sul contenuto.
80
4
CONFINI
L’organizzazione dei tuoi contenuti deve evidenziare l’ampiezza e la profondità del sito e delle sue articolazioni.
81
5
PERCORSI DI ACCESSO MOLTEPLICI
Non uno, ma molteplici sentieri di accesso ai tuoi contenuti, perché molteplici possono essere le tracce che i tuoi visitatori decidono di seguire nella loro navigazione.
82
6
STRUTTURA APPROPRIATA
L’organizzazione delle informazioni e la determinazione delle loro relazioni deve riflettere le specificità del contesto, del contenuto e dei navigatori.
83
7
COERENZA
Una volta che si è scelta una struttura per un contenuto, questa struttura deve essere ripetuta per tutti i contenuti simili.
84
8
RILEVANZA RISPETTO AL VISITATORE
Quando i target di riferimento del sito sono diversi, organizzare i contenuti in ragione dei visitatori può agevolare l’individuazione dei contenuti di interesse.
85
LE DOMANDE PER L’IAUNA VERIFICA
86
A DOMANDA
RISPONDI
▸Dove sono?
▸Dove vado?
▸Cosa succede qui?
▸Cosa ho a disposizione?
▸So cosa cercare: dove posso farlo?
▸Posso parlare con qualcuno?
87
DOVE TROVARE LE RISPOSTE? SEMPLICE, NELL’ARCHITETTURA (VISUALE).
88
DAL WEB AL WEB 2.0
http://oreilly.com/pub/a/web2/archive/what-is-web-20.html
96
NETSCAPE VS GOOGLE2.0/1
97
DOUBLECLICK VS ADSENSE2.0/2
98
L’AGO NEL PAGLIAIO
(PARENTESI: COME FUNZIONA IL PAGE RANK DI GOOGLE)
99
Google Secret
Performance storica
Frequenza di aggiornamento
Link in entrata
Rilevanza Parole Chiave
EDITORIA VS PARTECIPAZIONE2.0/3
100
TASSONOMIE VS FOLKSONOMY2.0/4
101
SITO PERSONALE VS BLOG2.0/5
102
VUOI COMMENTARE?
INVIA
INTERAZIONE 104
ORGANIZZAZIONEPERMALINK
105
DISTRIBUZIONEFEED RSS
106
BLOGGERIN PRINCIPIO FU
107
WORDPRESSOGGI È
108
BIG DATA
I NUMERI DI WORDPRESS
▸ 1 sito su 4 usa WordPress
▸ 1/3 dei siti top 1000 usa WordPress
▸ Ogni 74 secondi un sito inizia a usare WordPress
▸ Chi lo usa? Sony, Microsoft, The Wall Street Journal, The New York Times, Time Magazine, The New Yorker, Mashable, TechCrunch, Coca Cola, Mercedes Benz, Samsung, Star Wars, PlayStation, General Motors, NFL, Bloomberg, MTV, Facebook, eBay, Google, LinkedIn, Flickr, NASA, and TED, Jay Z, Beyoncé, Katy Perry, Justin Timberlake, Kobe Bryant, The Rolling Stones, Sylvester Stallone…
▸ Più di 42000: i plugin per estendere le funzionalità
▸ Più di 2000: i temi per personalizzare l’interfaccia
▸ 18: i post al secondo prodotti da un sito che usa WordPress
109
110
.COM? .ORG?
WORDPRESS CONTRO WORDPRESS
VANTAGGI .COM
▸ Manutenzione in outsourcing
▸ Aggiornamenti automatici
▸ Semplicità di gestione
▸ Immediatezza d’uso
▸ Indifferenza al nome di dominio
111
VANTAGGI .ORG
▸ Proprietà
▸ Libertà
▸ Scalabilità
▸ Personalizzazione
▸ Costi
.ORGAND THE WINNER IS
112
10 BUONE MOTIVAZIONI
1. il blog è tuo
2. nessun termine di servizio.
3. i plugin.
4. 2000 temi grafici a disposizione
5. una bella scarica di dopamina
6. una tua libreria permanente
7. ottimizzazione per i motori di ricerca
8. Google Analytics
9. creatività
10. il blog è tuo
CHE COSA SIGNIFICA SELF-HOSTING
IN 5 MINUTI (PIÙ O MENO)
113
INSTALLARE WORDPRESSIN 5 MINUTI (DAVVERO)
114
LA BASE DI DATI
IL MIO SITO, DINAMICO
115
PRONTI PER IL LOG INGIÀ FATTO!?!
116
BENVENUTI
BACHECA
117
IMPOSTARE IL SITO/1
GENERALITÀ
118
IMPOSTARE IL SITO/2
QUANDO SCRIVI
119
IMPOSTARE IL SITO/3
QUANDO QUALCUNO LEGGE
120
IMPOSTARE IL SITO/4
QUANDO DISCUTI
121
IMPOSTARE IL SITO/5
QUANDO INSERISCI FOTO E IMMAGINI
122
IMPOSTARE IL SITO/6
QUANDO I LETTORI SI COLLEGANO
123
