CSS per ipovedenti?


17

Quindi, mentre stavo imparando l'HTML, ho incontrato i CSS. È interessante perché con CSS puoi rendere una pagina web bella o più bella. Ma dal momento che riguarda più i colori, i disegni, gli stili ecc., Non riesco a conoscere i risultati dei miei codici CSS. Come persona con problemi alla vista, perché dovrei imparare i CSS se le persone vedenti possono sempre progettare una pagina web meglio di me perché possono vedere?

  1. Ci sono programmatori ciechi qui che scrivono CSS? Come hai fatto?
  2. Devo ignorare tutti i CSS e lasciarli ai programmatori vedenti? Oppure ci sono alcune cose nei CSS che posso fare senza chiedere alle persone di guardare la mia pagina per sapere se ha un buon design?

3
Potresti essere interessato all'aspetto auditivo del CSS.

1
Se non sei troppo esigente per i tuoi progetti, puoi prendere in considerazione l'uso di modelli CSS: combinazioni di colori e dettagli predefiniti. Forse prendere in considerazione la possibilità di lavorare con un designer vedente che può crearli. Quindi puoi scegliere scegliere in base a quello da solo.
rpeg,

Dipende se stai creando una pagina web per utenti ipovedenti o meno. Se è per entrambi, dovresti fare squadra.
Ronni Skansing,

Risposte:


12

CSS è un linguaggio di stile generale e include anche proprietà per il markup uditivo . Sebbene nulla di tutto ciò sia implementato dai browser mainstream, potrebbe essere utile per gli screen reader (ma non so se implementarlo, considerando che il markup uditivo non è comune "in the wild").

Come persona che vede, scrivo CSS in un ciclo di feedback stretto in cui cambio un po 'di CSS e poi guardo come cambia la pagina. Se questo feedback non è possibile o molto difficile, dobbiamo ricorrere ai principi di progettazione e speriamo che funzionino bene.

  • Le proporzioni sono più facili da gestire quando pensiamo alla pagina come a una griglia. Una divisione comune è quella di utilizzare la riga superiore per la navigazione e i titoli e la colonna di destra per i contenuti correlati. La colonna di sinistra viene utilizzata per il contenuto principale ed è circa due o tre volte più larga della colonna di destra. Questo è approssimativamente il modo in cui vengono renderizzati i siti di Stack Exchange. In CSS, questo può essere implementato con display: tablee relativi stili di visualizzazione di table-rowe table-cell, o con il nuovo modello di flexbox. I rapporti esatti sono sorprendentemente irrilevanti.

  • Una pagina ha un aspetto migliore quando è centrata orizzontalmente.

  • Uno non deve usare molti colori: c'è un colore di sfondo (di solito qualcosa di luminoso e insaturo) e un colore di testo (di solito qualcosa di scuro e saturo). Siamo in grado di ridurre il contrasto della luminosità per de-enfatizzare testi come note a piè di pagina, righe o altri dettagli. L'uso del modello di colore HSV dovrebbe essere molto più semplice di RGB per questo. Esistono diverse tavolozze di colori che possono essere utilizzate se il grigio normale è troppo noioso. Il colore dovrebbe essere usato, ma con parsimonia.

  • La dimensione del carattere può anche essere usata per indicare l'importanza: passaggi di 2pt e mai inferiori a 9pt sembrano sensati. Per il testo normale, una dimensione del carattere di 14pt non deve essere superata. Insieme, la dimensione del carattere e il contrasto del testo sono simili al volume del parlato.

  • CSS offre non solo unità assolute di misure come pxo cmma anche unità relative come eme parole chiave come thino medium. L'uso di misurazioni relative e queste parole chiave è spesso più semplice.

  • Il testo non dovrebbe essere più ampio di 40em.

  • I browser sono dotati di fogli di stile predefiniti. Non sono belli, ma non devi scavalcare tutto. La scelta di un semplice webfont e l'impostazione di una larghezza massima per gli elementi di testo sono le due cose più importanti. La scrittura di HTML semantico è importante per il funzionamento degli stili predefiniti.

Con questo, dovrebbe essere possibile creare un blog semplice o simile. Tuttavia:

  • Il debug del codice è difficile, tanto più se non riesci a vedere cosa stai facendo. Non riesco a trovare le cose giuste al mio primo tentativo. Ma come faresti a sapere quando le cose sembrano "giuste"?

  • Alcune cose richiedono un posizionamento preciso degli elementi, ad esempio in un menu a comparsa.

  • Immagini e icone possono aggiungere molta profondità a un design, ma sarebbe difficile per te scegliere.

  • Il modello di box CSS è orribile e spesso difficile da simulare nella tua testa.

Suppongo che saresti in grado di scrivere un po 'di CSS, ma sarebbe incredibilmente frustrante. Non so quali tecnologie assistive esistano, ma presumo che il feedback tattile ti consentirebbe di progettare un layout generale. Forse la programmazione in coppia con qualcuno con la vista potrebbe essere una buona soluzione per i dettagli più piccoli?


3
Sono d'accordo con il suggerimento di programmazione della coppia. La vista è solo un'altra abilità da prendere in prestito, come il debug o l'architettura.
Jon Purdy,

5

Se Eşref Armağan sa dipingere , allora i non vedenti dovrebbero essere in grado di creare pagine web. Ma dato quanto è più difficile, dovresti forse considerare altre aree di programmazione. Ho conosciuto diversi programmatori ciechi, erano molto efficaci, in parte perché dovevano tenere sempre presente l'intero programma.

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.