Il multimediale online: il contesto tecnologico

Strategia e gestione dei contenuti
multimediali on line
Il contesto tecnologico
28-29 maggio 2012 Eupolis - Regione Lombardia - dott. Claudio Celeghin

Il contesto tecnologico
• Grafica per il web
• Formati file immagine
• Formati file video
• Audio
• Riprese
• Compressioni
• Pubblicazione video
• Video e CMS
28-29 maggio 2012 Eupolis Lombardia - dott. Claudio Celeghin 2

© Rafter | Stock Free Images&Dreamstime Stock Photos
Caratteristiche
della grafica per il web


Il ruolo della grafica
• La grafica identifica un sito o un prodotto mm
• La grafica deve essere coerente in tutte le
sezioni del prodotto
• Deve creare l’idea di un “luogo”
• Parametri da considerare
– “peso” (kb)
– ampiezza (pxl)
– risoluzione monitor


Immagini tipo bitmap

• gif
• jpg
• png Grafica bitmap-
• bmp raster
• tiff
• raw
CONTRO PRO
Se si ingrandisce - immagini reali (jpg-bmp)
l’immagine si evidenziano i - possibile modificare
pixel che la compongono
28-29 maggio 2012
contrasti e luminosità
Eupolis Lombardia - dott. Claudio Celeghin 5

GIF
• Contiene al massimo 256 colori/8 bit (x pixel)
• Meno colori = meno Kb
• Va bene per colori omogenei (loghi e
diagrammi)
• Il formato grafico più diffuso nel web
• interlacciate per progressivo download
• trasparenti: “bucano” un colore dell’immagine
per mostrare lo sfondo


Esempio di GIF


JPEG
• True color/24 bit (x pixel)
• Usate per fotografie
• Compressione con perdita definitiva di dati,
cioè di definizione e colore
• Compressione a ogni salvataggio
• Conservare sempre copie originali


raw – 14.3 MB jpg – 2 MB gif - 3.7 MB


PNG
• Studiata per il web
• Simile alla GIF per compressione
• Loghi e colori piatti
• Visualizza tutti i colori
• Trasparenza
• Interlacciamento
• Scarso supporto dei browser


Grafica vettoriale
• Grafica composta da descrizioni matematiche
di linee e poligoni
• Immagini più facili da modificare
• Facilmente ingrandibili senza perdita di qualità
• Esportabile in gif e png (meno pratico in jpg)
• Sono le immagini create con Flash


Ingrandimento grafica vettoriale


Accessibilità delle immagini
• Alt text: descrivere contenuto e funzione
dell’immagine in poche parole
• Immaginate di leggere il documento ad alta
voce al telefono
• L’obiettivo è far si che la pagina sia compresa,
non tanto l’immagine
• Descrivere l’immagine nel contesto della
pagina


Animazioni da evitare
• No per attirare l'attenzione
• Potenziale elemento disturbatore nei
confronti del contenuto principale
• No intro Flash in home page
• Non basta un tasto skip…


Animazioni consigliate
• Uso mirato delle animazioni sul web
• Una semplice animazione sulla home page
può aumentare l’interesse visivo per il sito
• Può servire per illustrare
concetti o procedure
• Fornire sempre controlli per
avviare/fermare l’animazione


Velocità/peso pagina web

28-29 maggio 2012 Dati: http://www.iwebtool.com/speed_test
Eupolis Lombardia - dott. Claudio Celeghin 17

Audio, caratteristiche e formati


Audio
• L'audio digitale consente di veicolare
efficacemente informazioni
• È più importante della traccia video (es TG)
• La traccia audio stand-alone
• La componente audio migliora la
presentazione
• L'audio può essere registrato, compresso e più
facilmente gestito

Audio
• La registrazione audio deve essere di ottima
qualità
• Eliminare rumori di fondo
(inseparabili dalla traccia audio)
• La compressione per il web può evidenziare
eventuali difetti della registrazione


Formati audio
Formati audio - MIDI
• Estensione: .midi
• MIDI : Musical InstrumentDigital Interface
• Deve essere letto da i dispositivi di musica
elettronica come sintetizzatori e schede audio
• I file MIDI non contengono suono, ma le
istruzioni digitali musicali (note)
• I file MIDI sono estremamente piccole


Formati audio
MIDI - WAVE
• Esempio: 5 minuti di musica
– MIDI = 23KB
– Wave = anche 60 MB

WAVE MIDI
43 secondi 3 minuti
7.8 MB 12 KB


Formati audio
WAVE
• Estensione: .wav
• Formato sviluppato da IBM e Microsoft
• Supportato da tutti i PC Windows, e da tutti i
browser più diffusi (ad eccezione di Google
Chrome)


Formati audio
WMA
• Estensione .wma
• Windows Media Audio è simile per qualità al
formato MP3
• compatibile con la maggior parte dei player,
iPod escluso.
• Può essere un flusso continuo di dati, che lo
rende pratico per l'uso per internet radio o
musica on line.


Formati audio
MP3
• Estensione .mp3 / .mpga
• Compressione con perdita di informazioni
• file MP3 la parte del suono del formato MPEG,
originariamente sviluppato per il video
• Buona compressione / alta qualità
(file di piccole dimensioni)
• Bit rate almeno di 128 kbps, meglio 256 kbits


Studio di registrazione – regia


Studio di registrazione – speaker


Registrazione digitale


Formati video


Formati video
AVI
• AVI (Audio Video Interleave)
• Contenitore multimediale sviluppato da
Microsoft
• Supportato da tutti i computer Windows e dai
browser più comuni
• Molto diffuso su Internet, non sempre
compatibile con computer non-Windows
• Manca il supporto per i sottotitoli

Formati video
Flash
• Estensione: .swf (web)
• Uso prevalentemente grafico per animazioni
complesse vettoriali e multimediali on line
• Richiede un plugin per il browser, preinstallato
nei più diffusi browser (Firefox, IE, Chrome)


Formati video
Flash Video
• Estensioni: .flv / .f4v (più recente)
• audio/video streaming
(con Adobe Flash Player)
• De facto è il formato di default per i video
online

• YT utilizza Adobe Flash
Video per trasmettere i suoi
contenuti

Formati video
Mpeg-4
• Estensione: .mp4
• Mpeg-4 è molto diffuso su internet
• Adatto a videotelefonia e televisione digitale
• Filmati web
• YT converte i video in in flv/mp4 per la
distribuzione
• I video on-line sono sempre più orientati verso
il formato MP4

Formati video
Mpeg-4: funzionamento
• Basato su MPEG-2 (DVD) e Apple QuickTime
technology
• trasmette solamente la variazione
dell'immagine da frame a frame
• Codifica solo le zone dell'immagine che sono
cambiate rispetto a quella precedente
• Esclude il refresh della parte uguale tra i due
frame


Formati video
QuickTime
• estensione: .mov
• Sviluppato da Apple
• Formato comune su Internet
• Non possono essere riprodotti su un computer
Windows senza l’installazione di un extra
componente (gratis)
• QuickTime base per lo standard MPEG-4


Formati video
WMV
• .wmv
• Sviluppato da Microsoft a partire da MPEG-4
• Streaming file video
• Visualizzabile con Windows Media Player
• Video WMV possono essere riprodotti su
computer non-Windows, con l’installazione di
un extra componente gratis (“Flip” per Mac).


Consigli per le riprese


Consigli per le riprese video
• Fare riprese di soggetti ravvicinati
• I dettagli dei campi lunghi finirebbero per
essere invisibili dopo la compressione a bassa
risoluzione


Inquadrature e compressione
• Utilizzare un treppiede per ridurre al minimo il
movimento della videocamera
• Minimizzare al minimo le differenze tra i
fotogrammi e migliorare notevolmente la
compressione video
• Evitare zoom e panning (scorrimento orizzontale):
con basso frame-rate crea confusione nelle
immagini
• Può anche causare una minore compressione
delle immagini

• Evitare movimenti e dettagli
• Selezionare spezzoni che contengano minimo
movimento e pochi dettagli essenziali


• Utilizzare un semplice sfondo monocromatico,
quando possibile per avere immagini video di
dimensioni più contenute e aumentare
l'efficienza della compressione.


Montaggio: no dissolvenze
• No dissolvenze: favorire tagli netti tra le scene
• Utilizzare con parsimonia gli effetti di
transizione
• La transizione non comprime in modo
efficiente e può generare problemi sul web se
visualizzato su monitor di ampie dimensioni


Compressione
• Per la distribuzione sul Web, puntare a file
adatti ad una connessione di media potenza
• Velocità di trasmissione dati (bit rate)
• kilobyte/s (kbps): quantità di dati per un
secondo di filmato
• Evitare inceppamenti del video: impostare
kbps inferiore alla connessione degli utenti


Compressione
• La compressione elimina dati ridondanti e
meno importanti da un video
• Algoritmi, o "codec" (compressori-
decompressori) gestiscono compressione e
decompressione durante la lettura
• Codec con compressione “lossy”: il processo
elimina dati dal materiale originale
• Non comprimere più volte i materiali


Compressioni alternative
• Fornire versioni alternative dei contenuti
• QuickTime può creare diverse versioni di un video
– Diverse compressioni
– Diverse velocità di connessione
– diversi livelli di qualità
• Qualità/connessione


QuickTime esportazione


Pubblicare on line
il progetto multimediale


Trasporto
• Media di rete
– il server
– Rete
– il computer client
– il browser web
– browser plug-ins in uso.
• Larghezza di banda disponibile ?
• Se i file multimediali sono erogati da un high-end
server multimediale -> alto livello di performance
• Possibile prevedere le prestazioni di lettura su PC


Parametri creazione e distribuzione
• Non esistono parametri assoluti a priori
• Intranet aziendale: supporto rete controllato
quindi possibile migliore qualità
• Utile conoscere configurazione utente base
• Verificare le statistiche per sapere velocità di
connessione medie


Informare gli utenti - 1/3
• Non è possibile avere il controllo totale del
progetto on line
• Frustrante ricevere dopo una lunga attesa
un’informazione che non mi interessa o che non
posso visualizzare
• Fornire informazioni all’utente per consentirgli di
decidere prima di agire


Informare gli utenti – 2/3
• I file MM dovrebbero apparire nelle pagine
secondarie del sito, ma collegate con la Home
(dipende dagli obiettivi del sito)
• La pagina principale: semplice html, veloce e
senza richiesta di software aggiuntivo
• Allegare informazioni descrittive sui materiali
con anteprime


Informare gli utenti – 3/3
• Indicare il tempo complessivo
• Dimensione del file in caso di download
• Requisiti software per l'accesso ai materiali
• Fornire link per scaricare i plug-in necessari
• Gli utenti dovrebbero avere una chiara idea
del vostro materiale Mm prima di iniziare a
scaricare il file


Fornire il controllo
• Fornire informazioni di stato e controlli per i
materiali multimediali
• Ad esempio suoni di sottofondo: possibilità di
mute
• Utente non deve essere
obbligato a chiudere la
finestra per far cessare il
suono


Fornire il controllo
• barra di controllo dei media, stop
• Evitare riproduzione automatica: non prendere il
controllo al posto dell’utente
• No riproduzione automatica di file multimediali
quando una pagina web viene caricata.
• Elemento di distrazione
• Progettare l'interfaccia multimediale in modo che
i file video vengano attivati solo quando l'utente
sceglie esplicitamente di avviare la riproduzione


Fornire feedback
• imdb.com
– “Sorry! Looks like we don't have a video format
that your browser knows how to play”
– Manca link a download plug-in
• NASA :
– “You're missing Adobe Flash Player 10 Plugin
needed to view these videos . Please install Adobe
Flash Player Plugin and try again”


Interazione da tastiera
• Accesso universale e usabilità: assicurarsi che
il proprio controller multimediali siano
utilizzabili da tastiera
• Interazione tastiera: selezione + attivazione
del controllo
• Consentire navigazione con tasti Tab + freccie
• Controlli Pausa, Volume anche usando i tasti
freccia


Accessibilità dei video on line
1. Trascrizione: il testo del parlato deve essere
interamente trascritto e reso disponibile sulla
pagina web
2. Descrizione audio: eventuale descrizione dei
cambiamenti di scena più rilevanti
3. Caption: simili ai sottotitoli, possono
includere anche sintetiche descrizioni
dell’audio (ad es: “domanda dal pubblico”)


Video: il testo alternativo
• Contenuti video: l'alternativa più semplice è
trascrizione testuale della traccia audio.
• Utile per l'indicizzazione nei motori di ricerca e
la ricerca video
• Testo come didascalie sincronizzate con il
video
• Includere una descrizione della traccia video,
come testo


Streaming
• Streaming: invia continuamente dati al client
• Non scarica l'intero file
• Contenuto MM erogato da server
multimediale
• Dialogo costante con il client per determinare
il bit/rate supportato
• Il server regola costantemente il flusso di dati
in base alla capacità ricettiva del client

Streaming: i vantaggi
• Accesso a qualsiasi punto del video
• Ad es: visualizzare solo gli ultimi cinque
minuti, utilizzando i controlli per andare avanti
fino al punto di partenza desiderato.
• Minore richiesta di archiviazione per il client: il
video non viene memorizzato nel hard disk


Streaming: gli svantaggi
• Software dell’utente deve poter “girare”
velocemente per elaborare i dati in arrivo
• In caso di difetti di trasmissione rete o PC non
potente i dati multimediali vengono persi
• Riproduzione streaming richiede un elevato
potere di elaborazione, quindi il processore
deve essere potente per elaborare i
fotogrammi video in arrivo.


Live streaming
• Trasmettere un evento in diretta su Internet
– Telecamera / videocamera
– Codificatore per digitalizzare e comprimere i dati
– Un server tramite cui pubblicare i dati
– Rete Internet per la distribuzione
• I dati non vengono salvati nell’hard disk


Criticità dello streaming
• Capacità di trasmissione della rete
• Capacità di elaborazione del PC (client)
• Capacità del software per correggere
interruzioni
• Necessità di istallare un plugin


Live streaming: parametri
Livello
Capacità di
di definizione
trasmissione
del filmato
della rete

Numero degli
utenti collegati


Download
• Scaricare e memorizzare sul disco rigido del
computer
• Il download è progressivo e permette la
riproduzione del video anche se non è stato
scaricato completamente
• Utilizzo protocollo http quindi non è richiesto
nessun server speciale


Download: i vantaggi
• Qualità media del video generalmente
superiore allo streaming
• Non c’e’ elaborazione dati in tempo reale
tramite rete quindi i dati possono essere di
migliore qualità
• E’ possibile che il video scaricato non sia
compresso


Download: gli svantaggi
• Richiede molta memoria su hard disk
• I media scaricabili non permettono l'accesso
casuale, devo scaricare tutto per vedere la
fine.
• Dividere il video in segmenti più piccoli
• Utenti web diversi dai telespettatori: no video
lunghi.
• Web video vanno dritti al punto focale
dell’argomento

68 siti di video hosting
• 56.com (Chinese) • Mail.ru • Tangle.com (formerlyGodtube)
• Archive.org • MaYoMo • Trilulilu (Romanian)
• Afreeca (South Korean) • Mefeedia • TroopTube
• AniBOOM • Megaupload * • Tudou (Chinese)
• Blinkx • Metacafe • Twitvid
• Blip.tv • Mevio • Vbox7 (Bulgarian)
• Myspace • Veoh
• BlogTV
• MyVideo • Viddler
• Brainpop
• Nico Nico Douga (Japanese)
• Break.com • Videojug
• OneWorldTV
• Buzznet • Videolog (Portuguese)
• Openfilm
• Comedy.com • Vidoosh (Iranian)
• Ourmedia
• Crackle • Vimeo
• Photobucket
• Dailymotion
• Podblanc • Vuze
• EngageMedia
• Redtube • Vzaar
• ExpoTV
• Revver • Wildscreen.tv
• Funnyordie.com
• Rambler Vision (Russian) • Wistia
• Flickr
• ReelTime.com • xtube
• Fotki
• RuTube (Russian) • Yahoo! Video
• Gawkk
• SapoVideos (Portuguese) • Youku (Chinese)
• Hulu
•
• YouTube
SchoolTube
• HD share * (focus on HD videos)
• ScienceStage
• Lafango
• Sevenload
• Liveleak • Zoopy
• SmugMug


• Nato nel 2005 in California
• Acquisito da nel 2006
• Terzo sito più visitato al mondo dopo GL e FB
• 2012 - 4 miliardi di video visti ogni giorno
• 35 ORE di video caricate ogni MINUTO


• Visione: utilizza Adobe Flash Video
• Upload video: accetta praticamente tutti i
formati video
• Formati variano da 320x240 a 4096x3072
• Interfaccia in 42 lingue
• Fornisce il codice HTML per includere il video
nel proprio sito


Podcast
• Pod (iPod) + cast (broadCast)
• Servizio Internet Serie di file audio/video
scaricabili tramite tecnologia RSS
• iTunes è il più popolare software per l’ascolto
dei podcast


Come creare un podcast
• un feed RSS
– Titolo: deve essere molto specifico e unico
– Autore
– Descrizione dell’argomento e la programmazione
degli episodi
– Parole chiave: elenco dei termini di ricerca
associati al podcast (eventualmente anche errori
ortografici)
• Illustrazione del podcast
• Caricarlo su un server affidabile

Facciamoci trovare
SEO


SearchEngineOptimization (SEO)
• 48 ore di video caricate ogni minuto su YT
• Occorre effettuare operazioni specifiche per
farsi trovare
• I motori di ricerca non possono indicizzare i
contenuti video senza elementi di contesto
• Nei risultati di ricerca Google mette sempre
più in risalto i video attinenti a un argomento


(SEO) - Lato “social”
• Individuare le 5-10 keywords principali che gli
utenti cercano su un argomento specifico
• Controllare i “suggerimenti” di Google
• Associarle al video
• Incoraggiare gli utenti a vedere e a
condividere il video


(SEO) - Trascrizione del testo
• Trascrivere l’eventuale testo audio del video
sia su YouTube che sul proprio sito
(vedi “accessibilità”)
• Indicare descrizione e la miniatura statica
• Comunicare in tutti i modi alle persone che
esiste un tuo video su un determinato
argomento


Privacy e copyright

Disposizioni normative e consigli pratici


Diritto alla privacy
• Decreto legislativo 30 giugno 2003, n. 196
“Codice in materia di protezione dei dati
personali”
• Provvedimento del Garante del 29 luglio 1998,
in G.U. 3 agosto 1998, n. 179
• “Codice di deontologia relativo al trattamento
di dati personali nell’esercizio dell’attività
giornalistica”


Diritto alla privacy e video
• Esiste quindi un limite all'utilizzo di dati che
riguardano altre persone
• le immagini di un video possono essere
considerati "dati personali" quando ci
forniscono informazioni su qualcuno
(anche indirettamente)


Diritto alla privacy e video
• Lesivo della privacy
– Dare visibilità ai volti delle persone - le persone
ritratte nei video che volete pubblicare devono
darvi sempre il loro consenso
– Riprendere l'interno di un'abitazione e situazioni
famigliari altrui
– Rivelare informazioni sensibili sui soggetti
(salute, politica, religione, sesso)


Eccezioni
• Il diritto alla riservatezza dell'immagine può
essere sacrificato solo a condizione di
rispettare tre principi fondamentali:
– la verità dei fatti
– l'interesse pubblico alla notizia
– l'essenzialità dell'informazione (Art. 6)


Consigli pratici
• Persone comuni riprese in luoghi pubblici è
meglio non siano riconoscibili
• Per i personaggi pubblici non è necessario
chiedere il consenso
• Assicurarsi che ciò che pubblicate non sia
lesivo per la reputazione del soggetto


Cosa si rischia
• La responsabilità penale per video lesivo della
reputazione della persona o interferenza con
la vita privata del soggetto
• Reclusione sei mesi / quattro anni
• Vedi caso “News of the World”


Copyright
• L’uso di opere protette dal diritto d’autore
deve essere sempre autorizzato in via
preventiva dai titolari del diritto
• La licenza SIAE per utilizzazione di musica su
Internet in siti aziendali, industriali,
istituzionali che contengono musica come
complemento
• La licenza deve essere sottoscritta dai soggetti
intestatari dei domini web responsabili del sito

Copyright
• Copyright: sistema “Content ID”, per editori
• Sistema automatico che controlla l’equivalente
di 100 anni di video ogni 24 ore
• http://www.youtube.com/watch?v=9g2U12Ss
Rns


Diritto d’autore
Legge n. 633 del 22 aprile 1941
Sono opere tutelate dalla legge (tra le altre):
• Fotografia
• Disegni/illustrazioni
• Musica
Non è necessario alcun tipo di registrazione
dell’opera per essere tutelati

28-29 maggio 2012 Eupolis Lombardia - Dott. Claudio Celeghin 90

Diritto d’autore: opere fotografiche
Ogni foto pubblicata (non artistica) deve indicare:
• nome del fotografo o agenzia
• anno di produzione della fotografia
• il nome dell'autore dell'opera d'arte fotografata
In caso di mancanza di tali informazioni, la
riproduzione delle foto non si considera abusiva.
Diritto esclusivo: 20 anni dalla data di produzione


Fotografie artistiche
• Sono opere dell'ingegno, non è necessaria
l'indicazione dell’autore e dell'anno di
realizzazione
• Durata della tutela: 70 anni dopo morte
dell’autore


Sanzioni
• La violazione delle norme sul diritto d'autore
comporta sanzioni anche penali e di
particolare gravità, soprattutto se chi utilizza
illegittimamente l'opera altrui lo fa con fini di
lucro.


Royalty-free
• Licenza: utilizzo di una risorsa con limitate
restrizioni sul suo utilizzo e pagando cifra
contenuta
• Acquisita la licenza è possibile utilizzare la foto
(musica ecc) senza limiti di tempo e spazio, e
senza ulteriori costi
• Limitazioni della licenza, ad es 10.000 copie

©Grafphotogpaher | Stock Free Images&Dreamstime Stock Photos

Grazie per l’attenzione!

dott. Claudio Celeghin
celeghin@digitpa.gov.it
Eùpolis– Regione Lombardia
28-29 maggio 2012

95

Il multimediale online: il contesto tecnologico

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Andere mochten auch

Andere mochten auch (20)

Il multimediale online: il contesto tecnologico