Wordpress accessibile
<ul><ul><li>Web e disabilità </li></ul></ul>Il Web : · è la tecnologia che si è diffusa più  rapidamente  di tutte  · è un...
Web accessibility <ul><li>Accessibilità  vuol dire soprattutto  e-partecipation ,  cioè la  rimozione delle barriere infor...
Web accessibility <ul><li>L'  accessibilità   è un elemento irrinunciabile
L' accessibilità non è un  costo aggiuntivo , ma un elemento di qualità del sito
Un sito può essere  tecnicamente accessibile , ma di fatto  non fruibile  per un disabile </li></ul>
Legge Stanca e suoi requisiti  La legge   n. 4 del 9 gennaio 2004 , comunemente chiamata  &quot;Legge Stanca&quot;   <ul><...
garantisce il completo accesso anche a tutti coloro che necessitano di   tecnologie assistive
Le norme tecniche della legge 4/2004 sono state definite tenendo presenti gli  standard internazionali
Gli obblighi di legge comportano  responsabilità precise
Esistono tutti gli strumenti e le indicazioni per realizzare siti accessibili  </li></ul>Decreto ministeriale 8 luglio 200...
Tecnologie assistive <ul><li>Sono soluzioni hardware e software per consentire ai disabili di utilizzare un normale computer
Valorizzano le capacità residue  di un individuo sia dal punto di vista motorio che cognitivo, permettendogli di  riconqui...
Quali sono? </li><ul><li>Lettori di schermo (sceen reader)
Browser vocali
Tastiera baille
Monitor di grandi dimensioni
Ingranditori dello schermo (magnifier) </li></ul></ul>
Wordpress <ul><li>WordPress   è un  CMS
(Content Management
Upcoming SlideShare
Loading in …5
×

Il mio blog accessibile

813
-1

Published on

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
813
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
5
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Il mio blog accessibile

  1. 1. Wordpress accessibile
  2. 2. <ul><ul><li>Web e disabilità </li></ul></ul>Il Web : · è la tecnologia che si è diffusa più rapidamente di tutte · è una risorsa chiave per le attività quotidiane · impatta su diversi tipi di disabilità : · visive · uditive · fisiche · cognitive o neurologiche · può diventare elemento di integrazione o di ulteriore emarginazione
  3. 3. Web accessibility <ul><li>Accessibilità vuol dire soprattutto e-partecipation , cioè la rimozione delle barriere informatiche . Con questo termine si indicano le difficoltà che i disabili incontrano nell’usare un sistema per: </li><ul><li>carenze nella progettazione del software e dei contenuti dei siti web, che non tengono conto dei principi della progettazione universale e dell’ usabilità </li></ul><li>Usabilità è definita come l' efficacia , l' efficienza e la soddisfazione con le quali determinati utenti raggiungono determinati obiettivi in determinati contesti . Definisce il grado di facilità e soddisfazione con cui l'interazione uomo-strumento si compie. </li></ul>
  4. 4. Web accessibility <ul><li>L' accessibilità è un elemento irrinunciabile
  5. 5. L' accessibilità non è un costo aggiuntivo , ma un elemento di qualità del sito
  6. 6. Un sito può essere tecnicamente accessibile , ma di fatto non fruibile per un disabile </li></ul>
  7. 7. Legge Stanca e suoi requisiti La legge n. 4 del 9 gennaio 2004 , comunemente chiamata &quot;Legge Stanca&quot; <ul><li>definisce i soggetti che devono garantire l'accessibilità dei propri siti e sistemi informatici
  8. 8. garantisce il completo accesso anche a tutti coloro che necessitano di tecnologie assistive
  9. 9. Le norme tecniche della legge 4/2004 sono state definite tenendo presenti gli standard internazionali
  10. 10. Gli obblighi di legge comportano responsabilità precise
  11. 11. Esistono tutti gli strumenti e le indicazioni per realizzare siti accessibili </li></ul>Decreto ministeriale 8 luglio 2005: definisce i 22 requisiti che i siti devono rispettare per ritenersi accessibili
  12. 12. Tecnologie assistive <ul><li>Sono soluzioni hardware e software per consentire ai disabili di utilizzare un normale computer
  13. 13. Valorizzano le capacità residue di un individuo sia dal punto di vista motorio che cognitivo, permettendogli di riconquistare degli spazi di decisione autonome e dunque un maggior grado di benessere
  14. 14. Quali sono? </li><ul><li>Lettori di schermo (sceen reader)
  15. 15. Browser vocali
  16. 16. Tastiera baille
  17. 17. Monitor di grandi dimensioni
  18. 18. Ingranditori dello schermo (magnifier) </li></ul></ul>
  19. 19. Wordpress <ul><li>WordPress è un CMS
  20. 20. (Content Management
  21. 21. System) rilasciato con la
  22. 22. Licenza GPL (General Public License)
  23. 23. Consente la creazione di
  24. 24. blog personale, ma anche di
  25. 25. siti piccole e medie
  26. 26. dimensioni </li></ul>
  27. 27. Il mio blog accessibile Blog è l'abbreviazione di Weblog , termine che si usa per definire particolari siti web in forma di diario personale che hanno una forte connotazione cronologica delle informazioni.
  28. 28. Com'è nato “Linee d'espressione” <ul><li>Registrazione sull' hosting provider gratuito Altervista
  29. 29. Scelta del tema: permette di rendere unico il proprio spazio personalizzandolo con file di immagine (*.jpg, *.png), fogli di stile (*.css), oltre agli indispensabili file di codice (*.php)
  30. 30. Modifica del linguaggio di marcatura da Transitional a Strict come richiesto dal requisito n. 1 per l'accessibilità </li></ul>
  31. 31. Verifica tecnica per l'accessibilità <ul><li>riscontro con sistemi di validazione automatica della rispondenza alla sua definizione formale del linguaggio a marcatori utilizzato
  32. 32. verifica delle differenze di luminosità e di colore tra il testo e lo sfondo
  33. 33. redazione di un rapporto: si indica la conformità, la non conformità o l’eventuale non applicabilità di ogni singolo requisito della pagina esaminata </li></ul>
  34. 34. La barra dell'accessibilità per Internet Explorer <ul><li>La barra dell'accessibilità è un software freeware che supporta il validatore esperto nella verifica tecnica di un sito web
  35. 35. Nessun software automatico può verificare l'accessibilità di un sito, ma questo strumento permette comunque di facilitare la verifica e di automatizzare alcuni controlli </li></ul>
  36. 36. Altri validatori utilizzati <ul>Validare sempre il codice <li>(X)HTML: http://validator.w3.org/
  37. 37. CSS: http://jigsaw.w3.org/css-validator/
  38. 38. VaMoLà: http://polo-rer.polocesena.unibo.it/vamola-validator/checker/index.php </li></ul>
  39. 39. Strutturare i contenuti di una pagina Analisi della struttura della pagina web di un articolo pubblicato secondo il tema in adozione. Inserire le intestazioni in una pagina: <ul><li>aprire un nuovo articolo (Bacheca > Articoli > Aggiungi nuovo)
  40. 40. selezionare il testo da marcare come sottotitolo
  41. 41. scegliere dall’elenco a discesa del formato “Testata 3” : in questo modo il sottotitolo sarà associato al tag h3, mantenendo la gerarchia dei titolo corretta
  42. 42. nel caso i sottotitoli ammettano un titolo con un ulteriore livello di profondità, utilizzare Testata 4 </li></ul>
  43. 43. Testo alternativo Deve SEMPRE essere presente il testo alternativo ( alt ) ad ogni elemento multimediale (immagini, audio, video, ecc)
  44. 44. Immagini <ul><li>Evitare di usare immagini quando si può usare il testo : in caso di loghi contenenti testo, è opportuno riportare l’esatto testo (che ha un evidente contenuto informativo) come valore dell’attributo alt
  45. 45. Non descrivere le immagini “decorative”: esse, infatti, non hanno contenuto informativo, ma solo decorativo. Se l'immagine, però, ha la funzione di aprire una nuova pagina, questa informazione va riportata nel title del link, oppure nell’alt dell’immagine </li></ul>
  46. 46. <ul><ul><ul><li>Inserire un'immagine </li></ul></ul></ul>Attraverso l’ attributo alt del tag img è possibile fornire una descrizione dell’immagine: <img src=”img/immagine.jpg” alt=”alternativa testuale dell’immagine” /> Per inserire un’immagine in un articolo: <ul><li>aprire un nuovo articolo (Bacheca > Articoli > Aggiungi nuovo)
  47. 47. cliccare su Carica/Inserisci immagine
  48. 48. selezionare l’immagine dal proprio computer
  49. 49. una volta caricata l'immagine, inserire un testo alternativo nell'apposito campo
  50. 50. cliccare sul pulsante Inserisci nell’articolo </li></ul>
  51. 51. Gestire i link <ul><li>I collegamenti ipertestuali e gli eventuali attributi “title” devono essere leggibili.
  52. 52. Informare, in caso di link ad allegati, sul formato e il peso .
  53. 53. Inserire salta menu in modo da consentire di saltare aree ripetitive. </li></ul>
  54. 54. Inserire i link I nserire l’attributo title al link <ul><li>aprire un nuovo articolo (Bacheca > Articoli > Aggiungi nuovo)
  55. 55. scrivere il testo e selezionare quello da linkare a un sito esterno
  56. 56. cliccare su Inserisci/Modifica link
  57. 57. scrivere l’indirizzo web della risorsa e, a fianco di Titolo, la descrizione del link evitando di inserire pop-up o aperture di finestre indipendenti
  58. 58. in caso di documenti , ripetere la procedura, caricando prima l’immagine e copiando ed incollando l’indirizzo del link a fianco di Titolo in Inserisci/modifica link. Ricordarsi di aggiungere anche formato e dimensione del file </li></ul>
  59. 59. Inserire un video L’inserimento di video è facilitato dall’uso di appositi plugin come ad esempio Wordpress Video Plugin . Per inserire un video: <ul><li>aprire la pagina di Youtube contenente il video da
  60. 60. pubblicare e copiare l’indirizzo web
  61. 61. inserire un nuovo articolo e spostarsi nel punto in cui si desidera inserire il video
  62. 62. scrivere [ youtube id_video] (al posto di id_video inserire l’identificativo del video) </li></ul>
  63. 63. Accesskey: navigazione agevolata Accesskey (t asti di accesso rapido): permettono di richiamare direttamente una pagina mediante una combinazione di tasti (shortcut: scorciatoie) <ul><li>importante aiuto alla navigazione in particolare per i non vedenti
  64. 64. agli utenti di screen reader questi tasti offrono la possibilità di navigare in maniera più efficiente all'interno di un sito o di una singola pagina
  65. 65. funzionano anche con i browser normali. Il loro impiego dipende dal browser e dal sistema operativo </li></ul>
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×