cassionAnalyse de données

Retour à la leçonLeçon 5 sur 8La page qu'il doit survivre

Imprimez-le en gris et voyez ce qu'il reste

Le même diaporama que les téléchargements, rendu sous forme de page. Lancez le diaporama pour le présenter en plein écran — les flèches ou un clic avancent d'une diapositive, Échap quitte.

Diapositives · PDFDiapositives · PowerPoint

  1. Diapositive 1 / 25

    Ce que couvre cette leçon

    • Les quatre affichages qu'un graphique doit survivre
    • Le test du niveau de gris, qui prend dix secondes
    • La déficience de la vision des couleurs
    • Le corps, les traits et la taille à laquelle le graphique est réellement lu
    • Tout ce qui peut être supprimé
    • Le texte alternatif, qui est une légende faisant un second travail
    • Rapportez-le en entier
    • La suite
    Notes du présentateur
    Un graphique qui fonctionne sur votre écran a été testé sur le seul affichage où il ne sera jamais lu. Le document est en niveaux de gris, le vidéoprojecteur écrase les demi-teintes, la salle est éclairée, et environ un homme sur douze ne sépare pas votre rouge de votre vert.
  2. Diapositive 2 / 25

    Les quatre affichages qu'un graphique doit survivre

    AffichageCe qu'il faitCe qui lâche en premier
    Une imprimante laserSupprime toute teinteDeux séries distinguées par la seule couleur
    Un vidéoprojecteur en salle éclairéeÉcrase les demi-teintes, relève les noirsGris clairs, traits fins, ombrages subtils
    Un téléphone sur connexion facturéeRétrécit toutCorps sous 9 pt, étiquettes d'axe denses
    Un lecteur daltonienFusionne rouge et vertLa palette de signal, et toute paire rouge/vert
    Notes du présentateur
    Un graphique de programme est composé une fois et lu sur des affichages que son auteur ne voit jamais.
  3. Diapositive 3 / 25

    Les quatre affichages qu'un graphique doit survivre

    • Chacun de ces cas est le cas normal dans ce secteur — non un cas limite d'accessibilité
    Notes du présentateur
    Chacun de ces cas est le cas normal dans ce secteur, non un cas limite d'accessibilité. Le document est photocopié, le vidéoprojecteur est vieux, le lecteur est sur un téléphone dans un bureau de terrain, et la salle a une fenêtre.
  4. Diapositive 4 / 25

    Le test du niveau de gris, qui prend dix secondes — En Python

    import matplotlib.pyplot as plt
    
    fig.savefig("chart.png", dpi=150)
    grey = plt.imread("chart.png").mean(axis=2)     # crude luminance
    plt.imsave("chart-grey.png", grey, cmap="gray")
  5. Diapositive 5 / 25

    Le test du niveau de gris, qui prend dix secondes — En R

    # ggsave(), then open it in any viewer and desaturate. Or just print it.
  6. Diapositive 6 / 25

    Le test du niveau de gris, qui prend dix secondes

    • Faites-le sur chaque graphique avant qu'il parte — Si deux séries n'en font plus qu'une, le graphique encodait une…
    • Le remède n'est jamais « choisir de meilleures couleurs » — C'est d'ajouter un second canal :
    Notes du présentateur
    Faites-le sur chaque graphique avant qu'il parte. Si deux séries n'en font plus qu'une, le graphique encodait une distinction dans la seule teinte. Le remède n'est jamais « choisir de meilleures couleurs ». C'est d'ajouter un second canal :
  7. Diapositive 7 / 25

    Le test du niveau de gris, qui prend dix secondes

    DistinguerComment
    Deux lignesÉtiquettes directes au bout des lignes, plus trait plein et pointillé
    Des barres dont une mise en évidenceContraste de clarté, non de teinte
    Des catégoriesPetits multiples, ainsi rien n'a besoin d'être distingué
    Des points d'un nuageLa forme autant que la couleur
  8. Diapositive 8 / 25

    Le test du niveau de gris, qui prend dix secondes

    • La clarté survit au niveau de gris par définition — Les figures de la plateforme emploient un vert sapin foncé contre…
    Notes du présentateur
    La clarté survit au niveau de gris par définition. Les figures de la plateforme emploient un vert sapin foncé contre un gris ardoise moyen, qui sont deux gris distinguables avant d'être deux couleurs — et c'est pourquoi la mise en évidence de chaque figure de ce site se lit encore sur une photocopie.
  9. Diapositive 9 / 25

    La déficience de la vision des couleurs

    • La palette de signal est le cas problématique et il est incontournable — parce que vert, ambre et rouge sont la…
    Notes du présentateur
    Environ 8 % des hommes et 0,5 % des femmes d'ascendance nord-européenne en présentent une forme, et les plus courantes fusionnent le rouge et le vert. La palette de signal est le cas problématique et il est incontournable, parce que vert, ambre et rouge sont la convention du secteur et ne peuvent pas être simplement remplacés.
  10. Diapositive 10 / 25

    La déficience de la vision des couleurs — En Python

    SIGNAL = {"normal": "#2f8f5b", "moderate": "#d9a02b", "severe": "#c0442f"}
  11. Diapositive 11 / 25

    La déficience de la vision des couleurs — En R

    # Keep the hues. Add a second channel so the hue is not load-bearing.
  12. Diapositive 12 / 25

    La déficience de la vision des couleurs

    • Trois façons de garder la convention tout en restant lisible
    • Ordonnez les catégories — Normal, modéré, sévère dans cet ordre signifie que la position porte la sévérité même quand…
    • Étiquetez directement — Le mot « sévère » sur la barre ne coûte rien et supprime entièrement la dépendance
    • Faites varier la clarté délibérément — Les trois couleurs de signal de cette plateforme ne sont pas également claires :…
    Notes du présentateur
    Trois façons de garder la convention tout en restant lisible. Ordonnez les catégories. Normal, modéré, sévère dans cet ordre signifie que la position porte la sévérité même quand la teinte ne le fait pas. Étiquetez directement. Le mot « sévère » sur la barre ne coûte rien et supprime entièrement la dépendance. Faites varier la clarté délibérément. Les trois couleurs de signal de cette plateforme ne sont pas également claires : le vert est plus foncé que l'ambre, si bien qu'ils se séparent en niveaux de gris autant qu'en teinte. Vérifiez-le ; une palette choisie pour la seule teinte comporte souvent deux couleurs de clarté identique, qui fusionnent en un seul gris.
  13. Diapositive 13 / 25

    Le corps, les traits et la taille à laquelle le graphique est réellement lu — En Python

    plt.rcParams.update({
        "font.size": 10,          # 9 pt is the floor for a printed figure
        "axes.labelsize": 10,
        "axes.titlesize": 11,
        "xtick.labelsize": 9,
        "lines.linewidth": 1.6,   # 1 pt disappears on a projector
    })
    fig.set_size_inches(6.5, 4)   # the width of a text column, not of a monitor
  14. Diapositive 14 / 25

    Le corps, les traits et la taille à laquelle le graphique est réellement lu — En R

    theme_set(theme_minimal(base_size = 11))
  15. Diapositive 15 / 25

    Le corps, les traits et la taille à laquelle le graphique est réellement lu

    • Composez à la taille d'impression — Un graphique conçu sur 30 centimètres de large et déposé dans une colonne de 16 a…
    • 9 pt est le plancher pour l'impression et 18 pt pour une diapositive projetée — Les diaporamas de leçon que produit…
    • Les traits fins et les gris clairs sont les premières victimes d'un vidéoprojecteur — Employez 1,5 pt ou plus, et ne…
    Notes du présentateur
    Composez à la taille d'impression. Un graphique conçu sur 30 centimètres de large et déposé dans une colonne de 16 a un corps de moitié, et le remède n'est pas de redimensionner l'image — c'est de le redessiner à la largeur cible. 9 pt est le plancher pour l'impression et 18 pt pour une diapositive projetée. Les diaporamas de leçon que produit cette plateforme font 1280×720 ; en dessous d'environ 18 pt à cette taille, rien n'est lu depuis le fond d'une salle. Les traits fins et les gris clairs sont les premières victimes d'un vidéoprojecteur. Employez 1,5 pt ou plus, et ne confiez aucune information à un gris plus clair qu'environ 40 %.
  16. Diapositive 16 / 25

    Tout ce qui peut être supprimé

    SupprimezParce que
    La légende, pour deux sériesLes étiquettes directes se lisent sur place
    La plupart des lignes de grilleQuatre suffisent ; douze font une texture
    Le cadre et les axes haut et droitIls ne portent rien
    Les unités répétées à chaque graduation« % » sur l'étiquette d'axe, non sur chaque nombre
    Le titre, quand la légende le ditDeux en-têtes se concurrencent
    Les décimales42,9 % et non 42,94 % ; l'intervalle est plus large que la décimale
    Notes du présentateur
    La mesure d'accessibilité la plus forte consiste à avoir moins de choses sur le graphique.
  17. Diapositive 17 / 25

    Tout ce qui peut être supprimé — En Python

    plt.rcParams.update({"axes.spines.top": False, "axes.spines.right": False})
    ax.grid(axis="x", alpha=0.3)
    ax.set_axisbelow(True)              # gridlines behind the bars
  18. Diapositive 18 / 25

    Tout ce qui peut être supprimé — En R

    theme(panel.grid.minor = element_blank(), panel.border = element_blank())
  19. Diapositive 19 / 25

    Tout ce qui peut être supprimé

    • Les lignes de grille passent derrière les données — Une grille tracée par-dessus une barre se lit comme une division…
    Notes du présentateur
    Les lignes de grille passent derrière les données. Une grille tracée par-dessus une barre se lit comme une division dans la barre, marque qui ne signifie rien.
  20. Diapositive 20 / 25

    Le texte alternatif, qui est une légende faisant un second travail — Exemple

    ![Malnutrition aigue globale par commune avec intervalles de confiance a 95 %.
    Les trois communes mises en evidence sont les seules dont l'intervalle depasse
    la mediane du district.](/figures/muac-gam-by-commune.fr.svg)
    Notes du présentateur
    Chaque figure de cette plateforme porte une légende assez longue pour énoncer son constat, et c'est cette légende qu'annonce un lecteur d'écran.
  21. Diapositive 21 / 25

    Le texte alternatif, qui est une légende faisant un second travail

    • « Graphique de la MAG par commune » décrit le fichier, non le constat — Un lecteur qui ne voit pas le graphique n'en…
    • Une légende qui énonce le constat sert quatre lecteurs à la fois — l'utilisateur de lecteur d'écran, le lecteur du…
    • C'est pourquoi la plateforme l'exige au lieu de le recommander — figures.test.ts fait échouer une figure dont la…
    Notes du présentateur
    « Graphique de la MAG par commune » décrit le fichier, non le constat. Un lecteur qui ne voit pas le graphique n'en tire rien. Une légende qui énonce le constat sert quatre lecteurs à la fois : l'utilisateur de lecteur d'écran, le lecteur du document imprimé, le formateur qui travaille depuis le PowerPoint où la figure est une légende et non un dessin, et la personne qui parcourt le rapport en quête du point. C'est pourquoi la plateforme l'exige au lieu de le recommander. figures.test.ts fait échouer une figure dont la légende fait moins de vingt caractères, et la raison n'est pas le rangement.
  22. Diapositive 22 / 25

    Rapportez-le en entier — Exemple

    Figure accessibility conventions
    
      All figures are readable in greyscale: emphasis is carried by lightness
      contrast rather than hue, and series are labelled directly rather than
      through a legend.
    
      Signal colours (green/amber/red) are used only where the categories are
      ordered by severity, so position carries the meaning independently of hue.
    
      Figures are drawn at the width they are printed. Minimum type size is 9 pt
      in the report and 18 pt on slides.
    
      Every figure carries a caption stating its finding, which is also its
      alternative text.
  23. Diapositive 23 / 25

    Rapportez-le en entier

    • Quatre lignes, et elles sont vérifiables par quiconque dispose d'une imprimante — Une déclaration d'accessibilité qu'on…
    Notes du présentateur
    Quatre lignes, et elles sont vérifiables par quiconque dispose d'une imprimante. Une déclaration d'accessibilité qu'on ne peut pas vérifier depuis l'artefact est une affirmation plutôt qu'une convention.
  24. Diapositive 24 / 25

    La suite

    • Une figure est rarement lue là où elle a été écrite.
    Notes du présentateur
    Une figure est rarement lue là où elle a été écrite. La leçon suivante porte sur la légende qui doit survivre à un collage dans un rapport de situation par quelqu'un qui n'a pas fait l'analyse.
  25. Diapositive 25 / 25

    La suite

    Lire la leçon complète, avec le code exécutable Retour à la leçon