Cos'è un sito accessibile?
Un sito web è accessibile quando fornisce informazioni fruibili da parte di TUTTI GLI UTENTI, compresi coloro che si trovano in situazioni di disabilità.
L’accessibilità per un sito della Pubblica Amministrazione non è un aspetto facoltativo ma OBBLIGATORIO, regolato da una legge specifica, denominata Legge Stanca (Legge dell'ordinamento italiano del 9 gennaio 2004, n. 4).
Quando si creano un sito accessibile bisogna prendere in considerazione che i contenuti devono essere fruibili anche da:
- non vedenti
- ipovedenti
- audiolesi
- persone con disabilità motorie
- persone affette da epilessia
- ecc…
Per creare dei contenuti accessibili ci sono delle linee guida da seguire.
1. Alternative testuali: fornire alternative testuali per qualsiasi contenuto non di testo in modo che questo possa essere trasformato in altre forme fruibili secondo le necessità degli utenti.
Questo vuol dire che le immagini devono avere un testo descrittivo associato che spieghi cosa rappresentano; i video devono avere i sottotitoli e un audio-descrizione di quello che viene visualizzato.
2. Contrasto: I colori dei testi e delle immagini devono avere un rapporto di contrasto sufficiente a garantire una chiara leggibilità da chiunque. Ad esempio scrivere in grigio chiaro su sfondo bianco non garantisce la leggibilità a tutti.
3. Tastiera: tutti i contenuti devono essere fruibili e navigabili da tastiera (e quindi senza l’ausilio del mouse)
4. Testo: tutti i testi importanti devono essere “a carattere” e non inclusi in un’immagine in quanto gli screen-reader utilizzati dai non vedenti per la navigazione non rileverebbero questo testo nascosto
5. Schemi e grafici: queste immagini tecniche devono essere precedute o seguite da del testo che le descriva.
6. Grammatica del web: i testi devono essere scritti correttamente dal punto di vista della grammatica. Questi aspetti verranno presi in esame nel capitolo successivo.
Come scrivere correttamente sul web
Scrivere sul web sembra facile, ma non lo è.
Molto spesso si scrive con disattenzione, in maniera veloce, quasi mai si rilegge ciò che viene scritto… tutte queste cose portano però a degli errori che sarebbe meglio evitare.
Questo capitolo sarà una guida rapida su quali sono gli errori più comuni e a come evitarli.
1. Doppio spazio: è questione di un attimo, ci si distrae ed ecco che compaiono spazi enormi tra le parole! È un errore che non tutti noteranno, ma resta sempre un errore. Quindi attenzione! Se abbiamo un testo in Word, è sufficiente fare un “Trova/Sostituisci” dove nel campo Trova si inseriscono due spazi e nel campo Sostituisci uno solo.
2. Punteggiatura e spazi: lo spazio va messo solo e soltanto dopo la punteggiatura. Nel caso delle parentesi lo spazio va messo prima della parentesi di apertura e dopo quella di chiusura (a meno che dopo la parentesi ci sia della punteggiatura come in questo caso). Stesso discorso per le virgolette.
3. Trattini: se c’è un trattino in una frase, esso va preceduto e seguito da uno spazio.
4. Maiuscole accentate: una cattiva abitudine è quella di scrivere le maiuscole con l’apostrofo per rappresentarle accentate. Ad esempio si scrive E’ invece di È. Questo è forse uno dei peggiori errori di grammatica nel web.
5. Nomi dei file: i nomi dei file (documenti, immagini ecc.) caricati sul sito non devono contenere spazi. Se il nome del file è composto da più parole, al posto dello spazio si deve mettere un “underscore” (cioè il trattino basso). Ad esempio, il file che si chiama “pagina di prova.pdf” deve essere rinominato “pagina_di_prova.pdf”.
Accesso alla sezione amministrativa del sito
Per accedere alla sezione amministrativa, cliccare sul link “Back office” posizionato a fondo pagina. Nella pagina successiva, fare il login inserendo i dati richiesti e cliccando sul pulsante “Accedi”.
Una volta effettuato il login, a fondo pagina compariranno quattro nuove voci:
- Esci: per effettuare il logout
- View: per visualizzare gli articoli che è possibile modificare
- Messaggi: per controllare lo scambio di messaggi tra utenti
Le modifiche effettuate dovranno poi essere revisionate dall’editor e dal publisher i quali possono decidere di approvare o di respingere le modifiche.
Introduzione alla gestione dei contenuti del sito
Il sistema gestisce le tipologie dei contenuti suddividendoli in categorie.
A ciascuna categoria vengono associati gli articoli che rappresentano i singoli contenuti.
Le categorie sono suddivise nelle due macro aree Italiano e English.
Nella pagina con l’elenco degli articoli, il sistema mette a disposizione alcuni strumenti per poter filtrare gli articoli ed essere così agevolati nella ricerca di uno specifico item.
C’è la possibilità di effettuare una ricerca testuale (funziona solo con i termini presenti nei titoli) oppure ci sono i “Filter”. I “Filter” sono una serie di elenchi a discesa tra cui è possibile selezionare delle voci per filtrare gli articoli. È possibile utilizzare insieme la ricerca testuale e i “Filter” per un’azione combinata.
Per modificare un articolo esistente è sufficiente cliccare sul relativo titolo presente nell'elenco.
Le parti fondamentali di questa pagina sono:
Titolo: contiene il titolo della pagina/articolo.
Categoria: la categoria a cui questo articolo è associato.
Lingua: la lingua che identifica la versione del sito a cui è associato l’articolo.
Editor di testo (e pulsanti per la formattazione del testo).
In questa parte della pagina è contenuto il testo dell'articolo che si vuole modificare. Qui è possibile gestire il testo come in un semplice programma di videoscrittura (es. word). Il testo può pertanto venire aggiunto, modificato, tagliato, incollato e formattato a piacimento. Gli strumenti principali per la formattazione sono: B (grassetto), I (corsivo), U (sottolineato), i due pulsanti relativi all'elenco puntato e all'elenco numerato, il pulsante per l'inserimento delle immagini e quello per l'inserimento di link.
Per formattare il testo è sufficiente selezionarlo e cliccare poi sul pulsante della formattazione che si vuole applicare.
!! ATTENZIONE: molte volte i testi vengono ricopiati da altri programmi di scrittura (editor), ad esempio Word, che forzano una loro formattazione al testo. Per evitare di portare questa formattazione nel sito e sovrascrivere quelle che sono le impostazioni di partenza, è buona norma fare un passaggio intermedio. Ci sono due soluzioni.
A. Utilizzare la funzione “Paste as Plain Text” dell’editor.
Invece di incollare il testo direttamente nell’editor, bisogna cliccare su questo pulsante e successivamente incollare il testo nella finestra che si apre.
Cliccando poi su “Insert” il testo comparirà “pulito” da formattazioni nell’editor.
B. Utilizzare un editor senza formattazione, ad esempio il Blocco note di Windows.
La procedura è la seguente:
- selezionare e copiare il testo dal file di Word;
- incollare il testo su un file Blocco note;
- selezionare e copiare il testo appena incollato;
- incollarlo nuovamente nell’editor di testo del sito.
Una volta terminate le modifiche alla pagina, cliccare sul pulsante “Save” (in alto a sinistra della pagina).
Successivamente cliccare su “Version request (Editor)”. In questo modo gli utenti di livello superiore potranno decidere se approvare o meno le modifiche appena create.
A questo punto nell’elenco degli articoli l’icona della colonna “Status” relativa all’articolo modificato passerà da
a
Nel caso in cui uno degli utenti di livello superiore rifiuti la pubblicazione dell’articolo, l’icona diventerà la seguente
Aprendo l’articolo comparirà un box rosso con alcuni dettagli tra cui, alla voce Remark, la motivazione per cui l’articolo non è stato approvato.
Se invece viene approvato dall’editor, l’articolo passerà al publisher e quindi l’icona sarà
La stessa procedura sarà poi seguita dal publisher.
Inserimento di immagini in un articolo
Per inserire le immagini in un articolo, cliccare sull'icona “Insert/Edit image” presente nelle barre degli strumenti dell’editor.
Se l’immagine è già stata precedentemente caricata la si può selezionare dall’elenco presente nella finestra che si apre, altrimenti cliccare sul pulsante apposito (Upload) per il caricamento dei file.
Nella finestra di dialogo che appare, è possibile trascinare semplicemente con il mouse un’immagine dal proprio computer all’interno dell’area “Drop files here” altrimenti cliccare sul pulsante “Browse”, si aprirà una finestra di dialogo in cui si potrà selezionare l’immagine desiderata dal proprio computer.
Una volta selezionate una o più immagini cliccare su “Upload”.
Per chiudere la finestra cliccare su “Close”.
A questo punto selezionare nell'elenco della finestra precedente il file appena caricato.
Verificare che nella parte superiore della finestra di dialogo, alla voce “URL” sia scritto il percorso dell'immagine selezionata.
Il campo “Alternate Text” va compilato con un brevissimo testo descrittivo dell’immagine.
Per allineare l’immagine a destra o a sinistra del testo cliccare sulla linguetta “Advanced” presente nella parte alta della finestra.
Nella casella di testo contrassegnata dalla voce “Classes” scrivere “left” o “right” a seconda che l’immagine debba essere visualizzata rispettivamente alla sinistra o alla destra del testo.
Al termine delle modifiche cliccare su “Insert”.
!! ATTENZIONE: Per le immagini del personale e i pdf relativi ai loro Curriculum è presente una cartella chiamata “Personale”.
!! ATTENZIONE: L’immagine presente nella scheda del personale deve avere le seguenti dimensioni 130x150 pixel
Inserire un collegamento ad una pagina interna o ad un documento
Per creare un link ad un'altra pagina del sito o ad un documento da scaricare, selezionare la frase che identificherà il link e cliccare sul pulsante per la creazione di link.
Si aprirà una finestra in cui sarà possibile inserire il link. Alla voce Text verrà visualizzato il testo a cui si sta assegnando il link.
Cliccare sul “+” accanto a “Content”, e poi ancora sul “+” accanto alle varie categorie e, per finire, sul titolo della pagina ricercata. Se invece, il link va collegato a un documento da scaricare, cliccare sul pulsante “Browse” che aprirà un'ulteriore finestra di dialogo.
Nella nuova schermata saranno elencati tutti i file già disponibili sul server.
Per aggiungerne uno nuovo cliccare sull'icona “Upload” per selezionare un file dal proprio computer e per caricarlo sul server. È possibile trascinare semplicemente con il mouse un file dal proprio computer all’interno dell’area “Drop files here”. Altrimenti cliccare sul pulsante “Browse”, si aprirà una finestra di dialogo in cui si potrà selezionare il file desiderato dal proprio computer.
Una volta selezionati uno o più file cliccare su “Upload”. Per chiudere la finestra cliccare su “Close”.
A questo punto selezionare nell'elenco della finestra precedente il file appena caricato.
Verificare che nella parte superiore della finestra di dialogo, alla voce “URL” sia scritto il percorso del file selezionato.
Al termine delle modifiche cliccare su “Insert”.
!! ATTENZIONE: Se si vuole che il link (indipendentemente dal tipo di link) si apra in finestra nuova (utile nel caso di documenti pdf o link esterni), prima di cliccare su “Insert”, nel riquadro “Attributes”, voce “Target”, selezionare “Open in new window”.
Inserire un collegamento ad una pagina esterna
Per creare un link ad un altro sito, selezionare il testo che identificherà il link e cliccare sul pulsante per la creazione di link.
Si aprirà una finestra in cui sarà possibile inserire il link.
Alla voce Text verrà visualizzato il testo a cui stiamo assegnando il link.
Alla voce URL andrà inserito il link di destinazione.
!! NOTA IMPORTANTE: il link dovrà avere il formato seguente http://www.google.it
!! ATTENZIONE: Se si vuole che il link (indipendentemente dal tipo di link) si apra in finestra nuova (utile nel caso di documenti pdf o link esterni), prima di cliccare su “Insert”, nel riquadro “Attributes”, voce “Target”, selezionare “Open in new window”.
Cliccare poi su “Insert” per completare l’operazione.