progetti web vincenti: 10 requisiti, tra design e normativa, per sviluppare bene servizi web per la...
TRANSCRIPT
Progetti web vincenti: 10 requisiti, tra design e normativa, per sviluppare bene servizi web per la pubblica amministrazione
Digital Strategic Planner - Web Accessibility Expert
Mi occupo di standard, accessibilità e strategie per il web
Membro del Consiglio Direttivo di IWA Italy
Agenzia per l’Italia Digitale Area Architetture, Standard e infrastrutture
Amministratore e fondatore di Akebia società di servizi per il web.
Commissione e-Accessibility Coordinatore del GdL2 "Adozioni e Traduzioni”
About me: Fabrizio Caccavello
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
L’associazione internazionale per la professionalità nel Web
http://www.iwa.it
Associazione professionisti Web (Legge 4/2013), promotrice norme UNI in materia di professionalità ICT.
Dal 1996 (in Italia dal 2000) è il riferimento di chi lavora nel Web, sia nel settore pubblico che privato.
Obiettivo di IWA è creare rete tra i soci, partecipare all'evoluzione della rete e divulgare conoscenza tramite i soci con eventi e iniziative.
partecipazioni internazionali
principali partecipazioni nazionali
International Web Association
Progetti web vincenti: 10 requisiti, tra design e normativa, per sviluppare bene servizi web per la pubblica amministrazione
Fabrizio Caccavello
Gli utenti molto spesso sono critici rispetto ai siti web della Pubblica Amministrazione. Eppure sviluppatori e amministratori pubblici hanno la sensazione di aver fatto tutto il possibile per rendere i loro progetti efficienti e “a misura del cittadino”. Ma c’è un gap evidente tra ciò che si sarebbe voluto offrire e ciò che invece si sta davvero offrendo agli utenti. In questo seminario sarà esposta una checklist in 10 punti attraverso la quale gli amministratori pubblici che commissionano i progetti e gli sviluppatori che li realizzano, potranno valutare la qualità complessiva di un progetto web, in modo che possa essere ridotta quella costante insoddisfazione che hanno, a ragione, gli utenti nei confronti della PA e dei progetti web che espongono sulla rete.
@cfabry #SMAU
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Utente, come ti trovi a navigare su questo sito
web?
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
mah… più o meno…
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Qualità dei siti weboggi parliamo di
marciapiedi
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
questo ambiente è molto familiare
e forse anche rassicurante
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Automobili ordinatamente
parcheggiate
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Pista ciclabile ai margini della
strada
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Un marciapiede protetto per le
persone
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Aiuole per gli alberi
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Marciapiedi con scivoli per agevolare il passaggio
eppure…
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Non sembra esistano strisce per i parcheggi
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
La pista ciclabile è molto stretta
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
La pista ciclabile ha delle buche
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
La cunetta è accidentata e
sconnessa
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
La segnaletica è sbiadita e incerta
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Sugli alberi si notano strani oggetti:
segnali o protezioni?
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Il marciapiede è molto stretto
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Si notano segni non identificabili
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
È tutto un po’ così così, sia per il marciapiede che
per i siti web. Ma perché?
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
COSA VEDREMO
Trasparenza
Accessibilità
Anticorruzione
Privacy
Open Data
1
2
3
4
5
6
9
10
7
8
User Experience
Responsive design
Layout
Tecnologia
Contenuti
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
1 Accessibilità
The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.
Tim Berners-Lee
La forza del Web sta nella sua universalità. Renderlo accessibile a tutti, indipendentemente dalla disabilità, è un aspetto essenziale.
http://www.w3.org/WAI/
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
1 Accessibilità / riferimenti
http://www.w3.org/standards/webdesign/accessibilitypagine accessibilità sul sito W3C
http://www.w3.org/Translations/WCAG20-it/Web Content Accessibility Guidelines (WCAG) 2.0
Accessible Rich Internet Applications (WAI-ARIA) 1.0http://www.w3.org/TR/wai-aria/
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
1 Accessibilità / normativa
http://www.agid.gov.it/agenda-digitale/pubblica-amministrazione/accessibilita/normativaSezione Accessibilità sul sito AgID
http://accessibilita.agid.gov.itPubblicazione obiettivi accessibilità (entro 31 marzo)
Legge 4/2004 http://www.camera.it/parlam/leggi/04004l.htm
http://www.agid.gov.it/dm-8-luglio-2005-allegato-A
DL 179/2012
DM 8 luglio 2005 - Requisiti tecnici e i diversi livelli per l'accessibilità agli strumenti informatici. Allegato A: Verifica tecnica e requisiti di accessibilità delle applicazioni basate su tecnologie internet aggiornato dal DM 20 marzo 2013 - GU Serie Generale n. 217 del 16-9-2013
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
1 Accessibilità - Facciamo un esempio
immaginate che questo sia lo slideshow di un sito web
- ce ne sono tantissimi di questo tipo -
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Per accessibilità web si indica la capacità di un sito web di essere acceduto efficacemente (alla sua interfaccia e al suo contenuto) da utenti diversi in differenti contesti. Rendere un sito web accessibile significa permettere l'accesso all'informazione contenuta nel sito anche a persone con disabilità fisiche di diverso tipo e a chi dispone di strumenti hardware e software limitati.
La Web Accessibility Initiative (WAI)
1 Accessibilità - Facciamo un esempio
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
La Web Accessibility Initiative (WAI)
Web Accessibility Perspectives explores the impact of accessibility for people with disabilities and the benefits for everyone.
1 Accessibilità - Facciamo un esempio
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
che cosa avete letto?che cosa avreste voluto fare?
1 Accessibilità - Facciamo un esempio
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
1chi può dire quanto tempo impiegherà un utente a leggere un testo?
10 secondi? 20 secondi? 1 minuto?
Accessibilità - Facciamo un esempio
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
I contenuti che si aggiornano automaticamente devono avere dei meccanismi per mettere in pausa
anche con comandi da tastiera
WCAG 2.0 - Adeguata disponibilità di tempo - Principio 2.2.2 http://www.w3.org/Translations/WCAG20-it/#time-limits
L.4/2004 - Aggiornamento del 20/03/2013 dell’allegato A - D.M. 8 luglio 2005Punto di controllo 6.2 lettera a http://www.agid.gov.it/decreto-ministeriale-8-luglio-2005
1 Accessibilità - Facciamo un esempio
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
1 Accessibilità / I PRINCIPI
Principio 1: percepibile le informazioni e i componenti dell'interfaccia utente devono essere presentati in modo che possano essere fruiti attraverso differenti canali sensoriali.
Principio 2: utilizzabile i componenti dell’interfaccia utente e i comandi in essa contenuti devono essere utilizzabili senza ingiustificati disagi o vincoli per l’utente.
Principio 3: comprensibile gli utenti devono poter comprendere le modalità di funzionamento dell’interfaccia e le azioni in essa contenute necessarie per ottenere servizi e informazioni.
Principio 4: robusto il contenuto deve essere abbastanza robusto da poter essere interpretato in modo affidabile da una vasta gamma di programmi utilizzati dall’utente, comprese le tecnologie assistive.
Requisiti tecnici di accessibilità e punti di controllo per la valutazione di conformitàhttp://www.w3.org/Translations/WCAG20-it/
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
2 Trasparenza / Amministrazione Trasparente - normativa
LEGGE 6 novembre 2012, n. 190Disposizioni per la prevenzione e la repressione della corruzione e dell'illegalità nella pubblica amministrazione.
Riordino della disciplina riguardante gli obblighi di pubblicita', trasparenza e diffusione di informazioni da parte delle pubbliche amministrazioni.
DECRETO LEGISLATIVO 14 marzo 2013, n. 33
ATTENZIONE Dal 19 maggio 2016
NUOVO DECRETO TRASPARENZA
il cosiddetto Freedom of Information Act (FOIA)
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
ma amministrazione trasparente significa esporre uno di questi loghi in homepage?
2 Trasparenza / Amministrazione Trasparente - normativa
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
oppure accendere le faccine verdi sulla bussola della trasparenza?http://www.magellanopa.it/bussola/
2 Trasparenza / Amministrazione Trasparente - normativa
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
invece avremmo dovuto:• verificare i contenuti • pubblicarli in modo accessibile • accertarci che l’interfaccia d’uso fosse accessibile • che la sezione fosse presente sul sito ufficiale • che la User Experience dell’utente fosse simile al
resto del sito web • che la ricerca delle informazioni fosse attiva anche
in questa area • …
2 Trasparenza / Amministrazione Trasparente - normativa
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
2 Trasparenza / Albo Pretorio - normativa
Disposizioni per lo sviluppo economico, la semplificazione, la competitività nonché in materia di processo civile
LEGGE 18 giugno 2009, n. 69 art. 32 comma 1
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
2 Trasparenza / Albo Pretorio - normativaanche in questo caso avremmo dovuto:• verificare i contenuti • pubblicarli in modo accessibile • accertarci che l’interfaccia d’uso fosse accessibile • che la sezione fosse presente sul sito ufficiale • che la User Experience dell’utente fosse simile al
resto del sito web • che la ricerca delle informazioni fosse attiva anche
in questa area • …
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
2 Trasparenza / Albo Pretorio - normativa
invece spesso con l’albo pretorio online abbiamo nascosto e complicato, invece di usare la tecnologia per semplificare, fornire trasparenza, migliorare il rapporto PA/utenti
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
3 Anticorruzione / normativa
LEGGE 6 novembre 2012, n. 190Disposizioni per la prevenzione e la repressione della corruzione e dell'illegalità nella pubblica amministrazione.
Autorità Nazionale Anticorruzione (ANAC)http://www.anticorruzione.it/portal/public/classic/
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Entro il 30 gennaio invio all’ANAC del file XML
ecco cosa succede
Una grande quantità di file XML è errato. Probabilmente sono tutti errori formali ma dimostrano una scarsa attenzione a questi temi importanti
3 Anticorruzione / normativa
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
4 Privacy
Informativahttp://www.garanteprivacy.it/privacy-e-internet
Non significa solo pubblicare un documento frutto di inconsapevole copia e incolla, ma riflettere sui temi della privacy di un progetto web
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
http://garanteprivacy.it/cookieCookie
Come per l’informativa, riflettere su ciò che significa usare i cookie
4 Privacy
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
5 Open Data
http://www.agid.gov.it/agenda-digitale/open-data
Occasione per riflettere almeno su due punti:
1) si hanno dei dati da poter distribuire in formato open? magari per permettere a terzi la creazione di nuovi servizi?
2) ci sono dati open che possiamo riutilizzare per creare nuovi servizi sul progetto web?
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
6 User Experience
Usabilità Accessibilità Personas Scenari
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Avete mai iniziato la progettazione iniziando a ragionare di Personas e Scenari?
6 User Experience
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
7 Tecnologia
A chi state affidando i vostri contenuti e i
vostri dati?
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Solo un esempio: legittimo fornire servizi agli utenti usando risorse di tipo cloud, ma avete mai controllato, per esempio, se al termine di un contratto i vostri dati potranno essere recuperati e riutilizzati su altre piattaforme web o altri servizi cloud?
7 Tecnologia
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
8 Contenuti / facciamoci un’idea
sito web
normativa
atti
turismo
utilities
Socialnews…
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
8 Contenuti / facciamoci un’idea
sito webnormativa
atti
turismoutilities
Social
news
…
albo pretorio
ammin. trasparente
canali
aree separate
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
accessibili
testi video audio
e strutturati
8 Contenuti / facciamoci un’idea
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
9 Responsive design
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Mobile first?Siamo proprio sicuri che tutti i contenuti e i servizi devono essere ottimizzati per il mobile?
9 Responsive design
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Responsive design / non re-inventiamo la ruota
Foundation Bootstrap
i framework HTML - CSS - Javascript aiutano a creare applicazione web solide con funzionalità multi device già testate
9
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Layout10
è solo una conseguenza
dei ragionamenti fatti fino a qui
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
progettazione web efficace
Contenuti
Tecnologia
Standard e normative
Design
UX di successo
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
eppur si muovein Agenzia per l’Italia Digitale si sta cercando di mettere in piedi delle linee guida per il design dei siti della PA (versione alfa)
http://design.italia.it
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Chi farà tutto questo lavoro?
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
! Information Architect ! Digital Strategic Planner ! Web Accessibility Expert ! Web Security Expert ! Mobile Application Developer ! E-commerce Specialist ! Online Store Manager ! Reputation Manager ! Knowledge Manager ! Augmented Reality Expert ! E-Learning Specialist ! Data Scientist ! Wikipedian
! Web Community Manager ! Web Project Manager ! Web Account Manager ! User Experience Designer ! Web Business Analyst ! Web DB Administrator ! Search Engine Expert ! Web Advertising Manager ! Frontend Web Developer ! Server Side Web Developer ! Web Content Specialist ! Web Server Administrator
http://www.skillprofiles.eu/
UNI 11621-1/4: 2016 Attività professionali non regolamentate – Profili professionali per l’ICT
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
abbiamo parlato mai di aspetto grafico e di homepage?
riflessione finale
;)
Eppure quasi sempre ciò che si richiederà al fornitore sarà di vedere la demo della homepage. E questi 10 punti?
Fabrizio Caccavello
Progetti web vincenti: 10 requisiti, tra design e normativa per sviluppare bene servizi web per la PA
@cfabry #SMAU
Fabrizio Caccavello
@cfabry