CSS pour les malvoyants?

17

Donc, pendant que j'apprenais le HTML, j'ai rencontré le CSS. C'est intéressant car avec CSS, vous pouvez rendre une page Web cool ou plus belle. Mais comme il s'agit davantage de couleurs, de designs, de styles, etc., je ne peux pas connaître les résultats de mes codes CSS. En tant que personne malvoyante, pourquoi devrais-je apprendre le CSS si les personnes voyantes peuvent toujours concevoir une page Web mieux que moi parce qu'elles peuvent voir?

  1. Y a-t-il ici des programmeurs aveugles qui écrivent du CSS? Comment avez-vous fait?
  2. Dois-je ignorer CSS tous ensemble et le laisser aux programmeurs voyants? Ou il y a des choses en CSS que je peux faire sans demander aux gens de regarder ma page pour savoir si elle a un bon design?
user1815810
la source
3
Vous pourriez être intéressé par l' aspect auditif du CSS.
1
Si vous n'êtes pas trop pointilleux sur vos conceptions, vous pouvez envisager d'utiliser des modèles CSS - des schémas de couleurs et des détails prédéfinis. Peut-être envisagez-vous de travailler avec un designer voyant qui peut les configurer pour vous. Ensuite, vous pouvez choisir vous-même en fonction de cela.
rpeg
Cela dépend si vous créez une page Web pour les utilisateurs malvoyants ou non. Si c'est pour les deux, vous devriez faire équipe.
Ronni Skansing

Réponses:

12

CSS est un langage de style général et comprend également des propriétés de balisage auditif . Bien que rien de tout cela ne soit implémenté par les navigateurs traditionnels, il pourrait être utile de filtrer les lecteurs (mais je ne sais pas s'il en existe un, étant donné que le balisage auditif n'est pas courant "à l'état sauvage").

En tant que personne voyant, j'écris du CSS dans une boucle de rétroaction étroite où je change un peu de CSS, puis regarde comment la page change. Si cette rétroaction n'est pas possible ou très difficile, nous devons nous rabattre sur les principes de conception et espérons qu'ils fonctionnent bien.

  • Les proportions sont plus faciles à gérer lorsque nous considérons la page comme une grille. Une division commune consiste à utiliser la ligne supérieure pour la navigation et les titres, et la colonne de droite pour le contenu associé. La colonne de gauche est utilisée pour le contenu principal et est environ deux à trois fois plus large que la colonne de droite. Voici à peu près comment les sites Stack Exchange sont rendus. En CSS, cela peut être implémenté avec display: tableet les styles d'affichage associés de table-rowet table-cell, ou avec le modèle Flexbox plus récent. Les ratios exacts sont étonnamment sans importance.

  • Une page est plus belle lorsqu'elle est centrée horizontalement.

  • Il n'est pas nécessaire d'utiliser beaucoup de couleurs: il y a une couleur d'arrière-plan (généralement quelque chose de clair et insaturé) et une couleur de texte (généralement quelque chose de sombre et saturé). Nous pouvons réduire le contraste de luminosité pour atténuer le texte comme les notes de bas de page, les bylines ou d'autres détails. Pour cela, l'utilisation du modèle de couleurs HSV devrait être beaucoup plus facile que RVB. Il existe un certain nombre de palettes de couleurs qui peuvent être utilisées si le gris uni est trop ennuyeux. La couleur doit être utilisée, mais avec parcimonie.

  • La taille de la police peut également être utilisée pour indiquer l'importance - des étapes de 2 pt et jamais en dessous de 9 pt semblent raisonnables. Pour le texte normal, une taille de police de 14 pt ne doit pas être dépassée. Ensemble, la taille de la police et le contraste du texte sont similaires au volume de la parole.

  • CSS propose non seulement des unités de mesure absolues comme pxou cmmais aussi des unités relatives comme emet des mots clés comme thinou medium. L'utilisation de mesures relatives et de ces mots clés est souvent plus facile.

  • Le texte ne doit pas être plus large que 40em.

  • Les navigateurs sont livrés avec des feuilles de style par défaut. Ils ne sont pas jolis, mais vous n'avez pas à tout remplacer. Choisir une simple police Web et définir une largeur maximale pour les éléments de texte sont les deux choses les plus importantes. L'écriture de code HTML sémantique est importante pour que les styles par défaut fonctionnent.

Avec cela, il devrait être possible de créer un blog simple ou autre. Pourtant:

  • Le débogage du code est difficile, d'autant plus si vous ne voyez pas ce que vous faites. Je ne réussis pas du premier coup. Mais comment sauriez-vous même quand les choses semblent «correctes»?

  • Certaines choses nécessitent un placement précis des éléments, par exemple dans un menu contextuel.

  • Les images et les icônes peuvent ajouter beaucoup de profondeur à un design, mais il vous serait difficile de choisir.

  • Le modèle de boîte CSS est horrible et souvent difficile à simuler dans votre tête.

Je suppose que vous seriez en mesure d'écrire un peu de CSS, mais ce serait incroyablement frustrant. Je ne sais pas quelles technologies d'assistance existent, mais je suppose que la rétroaction tactile vous permettrait de concevoir une disposition générale. Peut-être que la programmation en binôme avec une personne ayant une vue pourrait être une bonne solution pour de plus petits détails?

amon
la source
3
Je suis d'accord avec la suggestion de programmation par paire. La vue n'est qu'une autre compétence à emprunter, tout comme le débogage ou l'architecture.
Jon Purdy
5

Si Eşref Armağan peut peindre , les aveugles devraient pouvoir créer des pages Web. Mais étant donné à quel point c'est plus difficile, vous devriez peut-être envisager d'autres domaines de programmation. J'ai connu plusieurs programmeurs aveugles, ils étaient très efficaces, en partie parce qu'ils devaient garder le programme entier à l'esprit à tout moment.

Ross Patterson
la source