Leer Best Practices voor Duidelijke en Toegankelijke Visualisaties

Bij het maken van datavisualisaties is het doel om informatie zo duidelijk en effectief mogelijk over te brengen. Om dit te bereiken, dienen verschillende best practices te worden overwogen die zowel duidelijkheid als toegankelijkheid bevorderen. Belangrijke principes zijn onder andere het waarborgen van sterk kleurcontrast zodat grafieken leesbaar zijn voor iedereen, inclusief mensen met kleurenblindheid; het gebruik van beschrijvende titels, aslabels en legenda's zodat kijkers begrijpen wat elk element voorstelt; en het minimaliseren van overbodige elementen door onnodige rasterlijnen, overmatige tekst of overlappende onderdelen te vermijden. Consistente labeling en het gebruik van toegankelijke kleurpaletten zorgen ervoor dat grafieken zowel visueel aantrekkelijk als eenvoudig te interpreteren zijn voor alle doelgroepen.


              1234567891011121314151617181920212223242526272829303132333435363738394041424344
            
import plotly.express as px
import pandas as pd
from IPython.display import display, HTML

# Sample data
data = {
    "Category": ["A", "B", "C", "D"],
    "Value": [120, 90, 60, 30]
}
df = pd.DataFrame(data)

# Use a colorblind-friendly palette
color_sequence = px.colors.qualitative.Safe

fig = px.bar(
    df,
    x="Category",
    y="Value",
    color="Category",
    color_discrete_sequence=color_sequence,
    title="Well-Labeled and Colorblind-Friendly Bar Chart",
    labels={
        "Category": "Group Category",
        "Value": "Measured Value"
    }
)

# Add clear annotations
fig.update_traces(
    text=df["Value"],
    textposition="outside"
)

# Adjust layout for clarity
fig.update_layout(
    xaxis_title="Group Category",
    yaxis_title="Measured Value",
    legend_title="Category",
    font=dict(size=14),
    plot_bgcolor="white"
)

html = fig.to_html(full_html=False, include_plotlyjs="cdn")
display(HTML(html))

De bovenstaande grafiek toont verschillende toegankelijkheidskenmerken. Het kleurpalet is gekozen uit Plotly's Safe-reeks, die ontworpen is om onderscheidend te zijn voor gebruikers met kleurenblindheid. Elke staaf is duidelijk gelabeld met zowel de categorie als de waarde, waarbij de tekstlabels buiten de staven zijn geplaatst voor betere leesbaarheid. De grafiek bevat een beschrijvende titel en expliciete astitels, zodat direct duidelijk is wat wordt weergegeven. De legenda gebruikt dezelfde toegankelijke kleuren en heeft een duidelijke titel. De achtergrond is wit ingesteld om het contrast te maximaliseren en de lettergrootte is vergroot voor betere leesbaarheid.

Door deze best practices toe te passen op al je Plotly-grafieken, blijven je visualisaties toegankelijk en effectief, ongeacht het publiek. Wanneer je lay-outs, kleuren of stijlen aanpast — zoals in eerdere hoofdstukken — kies dan altijd voor kleurenpaletten die geschikt zijn voor kleurenblinden, zorg voor duidelijke en beschrijvende labels en vermijd overbodige visuele elementen. Deze stappen zorgen ervoor dat je data het verhaal helder en inclusief vertelt, waardoor je visualisaties waardevolle hulpmiddelen worden voor communicatie en besluitvorming.

Was alles duidelijk?

Bedankt voor je feedback!

Sectie 1. Hoofdstuk 9

Vraag AI

Vraag wat u wilt of probeer een van de voorgestelde vragen om onze chat te starten.

Veeg om het menu te tonen


              1234567891011121314151617181920212223242526272829303132333435363738394041424344
            
import plotly.express as px
import pandas as pd
from IPython.display import display, HTML

# Sample data
data = {
    "Category": ["A", "B", "C", "D"],
    "Value": [120, 90, 60, 30]
}
df = pd.DataFrame(data)

# Use a colorblind-friendly palette
color_sequence = px.colors.qualitative.Safe

fig = px.bar(
    df,
    x="Category",
    y="Value",
    color="Category",
    color_discrete_sequence=color_sequence,
    title="Well-Labeled and Colorblind-Friendly Bar Chart",
    labels={
        "Category": "Group Category",
        "Value": "Measured Value"
    }
)

# Add clear annotations
fig.update_traces(
    text=df["Value"],
    textposition="outside"
)

# Adjust layout for clarity
fig.update_layout(
    xaxis_title="Group Category",
    yaxis_title="Measured Value",
    legend_title="Category",
    font=dict(size=14),
    plot_bgcolor="white"
)

html = fig.to_html(full_html=False, include_plotlyjs="cdn")
display(HTML(html))

Was alles duidelijk?

Bedankt voor je feedback!

Sectie 1. Hoofdstuk 9