Color and accessibility guidelines in Tableau - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to set a color palette that is friendly for colorblind users in Tableau.

Tableau

SET COLOR PALETTE TO [1]

Drag options to blanks, or click blank then click option'

APastel

BRainbow

CNeon

DColorblind Safe

Attempts:

3 left

💡 Hint

Common Mistakes

Choosing 'Rainbow' which is not colorblind friendly.

Using bright neon colors that reduce readability.

The 'Colorblind Safe' palette uses colors that are distinguishable by people with common types of color blindness.

2fill in blank

medium

Complete the code to add alternative text for a Tableau dashboard image for screen readers.

Tableau

ADD ALT TEXT '[1]' TO IMAGE

Drag options to blanks, or click blank then click option'

ADashboard overview

BColor palette

CChart colors

DNo description

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'No description' which leaves screen readers without info.

Describing colors instead of content.

Alternative text should describe the image meaningfully, like 'Dashboard overview'.

3fill in blank

hard

Fix the error in the code to ensure text contrast meets accessibility standards.

Tableau

SET TEXT COLOR TO [1] ON BACKGROUND COLOR #FFFFFF

Drag options to blanks, or click blank then click option'

A#000000

B#CCCCCC

C#FFFFFF

D#FFFF00

Attempts:

3 left

💡 Hint

Common Mistakes

Using white text on white background.

Using light gray text that is hard to read.

Black (#000000) text on white background (#FFFFFF) provides high contrast for readability.

4fill in blank

hard

Fill both blanks to create a color rule that highlights values greater than 100 in red and others in green.

Tableau

IF value [1] 100 THEN COLOR = '[2]' ELSE COLOR = 'green'

Drag options to blanks, or click blank then click option'

A>

Bred

C<

Dblue

Attempts:

3 left

💡 Hint

Common Mistakes

Using '<' instead of '>' causing wrong color assignment.

Using blue instead of red for highlighting.

The rule uses '>' to check if value is greater than 100, then sets color to 'red'.

5fill in blank

hard

Fill both blanks to create a calculated field that returns 'High', 'Medium', or 'Low' based on score thresholds.

Tableau

IF score [1] 80 THEN 'High' ELSEIF score [2] 50 THEN 'Medium' ELSE 'Low'

Drag options to blanks, or click blank then click option'

A>=

B<

C<=

D>

Attempts:

3 left

💡 Hint

Common Mistakes

Using '>=' instead of '>' for the first condition.

Using '<' instead of '<=' for the second condition.

The first condition checks if score is greater than 80 for 'High'. The second checks if score is less than or equal to 50 for 'Medium'. Otherwise, it's 'Low'.