Alcune segnalazioni e suggerimenti per migliorare l'accessibilità sulle pagine web del portale IAPS
Ciao @carmelo.magnafico ,
sono Gabriele Tramonti, tirocinante del Master Comris (in comunicazione della Scienza) presso INAF/IAPS. Ti scrivo in seguito al nostro colloquio in merito ad alcune possibili strategie da attuare per migliorare l'accessibilità del sito web di IAPS e quindi la fruizione delle pagine anche per gli utenti con problemi di visibilità.
Ho notato che la costruzione di qualunque paragrafo e di qualunque pagine sul sit IAPS può esser facilmente gestita tramite questo parametro: 
Presente in tutte le tipologie di pagine da pubblicare, sia pagine di blog che pagine "statiche", cioè che presentano contenuti di presentazione con una bassa frequenza di aggiornamento.
Questo concetto è fantastico e molto innovativo! E' davvero difficile trovarlo all'interno di altri CMS, anche di quelli enterprise che costano migliaia di euro.
Ho notato, però, che i colori sono stati usati in maniera non sempre accessibile su alcune pagine. La visualizzazione di quei contenuti non risulta quindi conforme alle regole WCAG per l'accessibilità: https://www.w3.org/Translations/WCAG22-it/#use-of-color
Ti riporto alcuni esempi:
Ora per evitare in futuro che gli utenti che utilizzano il portale e creano i contenuti possano creare "blocchi" di testo non accessibile, come già si discuteva a riguardo, si può implementare un upgrade della funzionalità "appeareance" dei vari blocchi in maniera tale che a seconda del background scelto, si possano selezionare solo i colori che soddisfano i criteri di WCAG.
Ora, aiutandomi con ChatGPT, ho chiesto all'AI di crearmi uno script python che ti riporto qui: bg_color_contrast_check.py (avrei voluto inserirlo come snippet ma non posso crearne di nuovi)
Questo script crea una tabella che associa lo sfondo ai colori da utilizzare per mostrare il testo e che sicuramente sono accessibili:
| Background Color | Text Color | Contrast Ratio | Small Text (4.5:1) | Large Text (3:1) |
|---|---|---|---|---|
| white | white | 1.00 | Fail | Fail |
| white | blue | 8.79 | Pass | Pass |
| white | dark-blue | 13.58 | Pass | Pass |
| white | yellow | 1.44 | Fail | Fail |
| white | cyan | 2.60 | Fail | Fail |
| white | green | 2.69 | Fail | Fail |
| white | pink | 2.16 | Fail | Fail |
| white | orange | 3.27 | Fail | Pass |
| white | pale-yellow | 1.16 | Fail | Fail |
| blue | white | 8.79 | Pass | Pass |
| blue | blue | 1.00 | Fail | Fail |
| blue | dark-blue | 1.32 | Fail | Fail |
| blue | yellow | 5.88 | Pass | Pass |
| blue | cyan | 2.66 | Fail | Fail |
| dark-blue | white | 13.58 | Pass | Pass |
| dark-blue | yellow | 8.96 | Pass | Pass |
| yellow | blue | 5.88 | Pass | Pass |
| yellow | dark-blue | 8.96 | Pass | Pass |
| cyan | white | 4.51 | Pass | Pass |
| cyan | blue | 1.69 | Fail | Fail |
| cyan | dark-blue | 2.26 | Fail | Fail |
| green | white | 4.60 | Fail | Fail |
| pink | white | 5.20 | Pass | Pass |
| orange | white | 5.97 | Pass | Pass |
| orange | dark-blue | 4.82 | Pass | Pass |
| pale-yellow | dark-blue | 8.96 | Pass | Pass |
| transparent | dark-blue | 13.58 | Pass | Pass |
Ora in base a questa tabella, posso farlo anche io se mi dici come, è possibile modifcare il file di configurazione che gestisce l'appereance dei blocchi per avere una modalità di scelta del colore del testo e dei link anche condizionata al BG scelto?
Naturalmente se ti serve supporto per implementare la modifica rimango a disposizione.
A presto
Gabriele