Login
Login

Wikipedia:Color coding music genres

{{essay}}

{{nutshell|Color coding of music genre infoboxes is confusing to those outside of WP:Music and goes against WP:COLORCONTRAST}}

I was actually about to start a discussion on such a change.

All Wikipedia pages should meet the standards of Web Content Accessibility Guidelines (WCAG) 2.0 Level AA, including [http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.htm SC 1.4.3 (contrast.)] As you have noted, many music genre infoboxes do not. In fact, :Category:Articles using Template:Infobox music genre with invalid colour combination is one of the largest extant accessibility tracking categories. This is a not-insignificant issue.

I think equally as important is that differently-colored infoboxes for genres ultimately impart no additional information to the reader. There is no indication on the infobox itself that the color relates to a genre (or in some cases, super-family of genres) or has any particular meaning whatsoever. The only guide to the colors exist on this page.

I believe that for both of these reasons the bgcolor and color parameters in {{:Infobox music genre}} and music genre footers should be deprecated. There's really no reason that they need to be colored other than that's how we've always done it.

  • https://en.wikipedia.org/wiki/Category:Accessibility_issue_tracking_categories
  • https://en.wikipedia.org/wiki/Category:Articles_using_Template:Infobox_music_genre_with_invalid_colour_combination
  • https://en.wikipedia.org/wiki/Wikipedia:WikiProject_Accessibility/Infoboxes
  • https://en.wikipedia.org/wiki/Wikipedia:Colour_contrast
  • https://en.wikipedia.org/wiki/Wikipedia:WikiProject_Music/Music_genres_task_force/Colours
  • these too https://en.wikipedia.org/wiki/Wikipedia:WikiProject_Music/Music_genres_task_force/Footer
  • Some readers of Wikipedia are partially or fully color-blind. Ensure the contrast of the text with its background reaches at least Web Content Accessibility Guidelines (WCAG) 2.0's AA level, and AAA level when feasible (see WCAG's [http://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html "Understanding SC 1.4.3: Contrast (Minimum)"]). To use named CSS colors for text on a white background, refer to Wikipedia:Manual of Style/Accessibility/CSS colors for text on white for recommended colors. For other usage, here is a selection of tools that can be used to check that the contrast is correct:
  • The [http://www.paciellogroup.com/resources/contrastAnalyser#download Colour Contrast Analyser] enables you to pick colors on the page, and review their contrast thoroughly. However, be sure to only use the up-to-date "luminosity" algorithm, and not the "color brightness/difference" which is outdated.
  • You can also use [http://snook.ca/technical/colour_contrast/colour.html Snook's color contrast tool], which is entirely up-to-date {{as of|lc=y|2015|01|11}}.
  • Google's Chrome Canary has a [https://a11ywins.tumblr.com/post/167324368213/google-chromes-color-contrast-debugger color contrast debugger] with visual guide and color-picker
  • Several other tools exist on the web, but check if they are up-to-date before using them. Several tools are based on WCAG 1.0's algorithm, while the reference is now WCAG 2.0's algorithm. If the tool doesn't specifically mention that it is based on WCAG 2.0, assume that it is outdated.
  • Additional tools can be used to help produce graphical charts and color schemes for maps and the like. These tools are not accurate means to review contrast accessibility, but they can be helpful for specific tasks.
  • The [http://ColorSchemeDesigner.com/ color scheme generator] helps to choose a good set of colors for a graphical chart.
  • [http://colorbrewer2.org/ Color Brewer 2.0] provides safe color schemes for maps and detailed explanations.
  • There are some tools for simulating color-blind vision: [https://www.toptal.com/designers/colorfilter toptal] (webpage analysis) and [http://www.color-blindness.com/coblis-color-blindness-simulator/ coblis] (local file analysis). There are also browser extensions for webpage analysis: [https://chrome.google.com/webstore/detail/colorblinding/dgbgleaofjainknadoffbjkclicbbgaa Colorblinding] (Chrome) [https://chrome.google.com/webstore/detail/nocoffee/jjeeggmbnhckmgdhmgdckeigabjfbddl NoCoffee] (Chrome) [https://addons.mozilla.org/en-US/firefox/addon/nocoffee/ NoCoffee] (Firefox)

WCAG Success Criterion 1.4.3 https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-contrast.html