poster

Inverse Color Contrast Checker: Automatically Suggesting Color Adjustments that meet Contrast Requirements on the Web

Author:

Frode Eika SandnesAuthors Info & Claims

ASSETS '21: Proceedings of the 23rd International ACM SIGACCESS Conference on Computers and Accessibility

Article No.: 72, Pages 1 - 4

https://doi.org/10.1145/3441852.3476529

Published: 17 October 2021 Publication History

Abstract

Low contrast between text and background and its effect with low vision is relatively well-understood. Many tools exist for helping web designers check contrast limits. Most of these tools identify contrast problems but give limited advice on how to rectify the problems. Moreover, website accessibility audits reveal that insufficient color contrast still is a recurring issue in practice. A framework was therefore developed that automatically proposes color adjustments to problematic text-background color pairs on web pages. These suggestions adhere to contrast requirements and are aligned with the visual design profile. The framework allows the developers to visually inspect the suggestions and amend color definitions in projects.

Supplementary Material

VTT File (PD1022.vtt)

Download
1.45 KB

MP4 File (PD1022.mp4)

Presentation video

Download
19.31 MB

References

[1]

Rafael Almeida and Carlos Duarte. 2020. Analysis of automated contrast checking tools. In Proceedings of the 17th International Web for All Conference (W4A '20). Association for Computing Machinery, New York, NY, USA, Article 18, 1–4.

Digital Library

[2]

Agency for Universal Design of ICT (uu-tilsynet). 2021. Accessibility audit report depository. Retrieved June 16, 2021 from https://www.uutilsynet.no/tilsynsrapporter/tilsynsrapporter/270

[3]

Kristian Brathovde, Mads Brændeland Farner, Fredrik Krag Brun, and Frode Eika Sandnes. 2019. Effectiveness of Color-Picking Interfaces among NonDesigners, In Proceedings of the 16th International Conference on Cooperative Design, Visualization and Engineering 2019 (CDVE 2019), LNCS vol. 11792, Springer, pp. 181-189.

Digital Library

[4]

Ricardo José de Araújo, Julio Cesar Dos Reis, and Rodrigo Bonacin 2020. Understanding interface recoloring aspects by colorblind people: a user study. Universal Access in the Information Society 19.1 (2020): 81-98.

[5]

Sarah A. Douglas and Arthur E. Kirkpatrick. 1999. Model and representation: the effect of visual feedback on human performance in a color picker interface. ACM Trans. Graph. 18, 2 (April 1999), 96-127.

Digital Library

[6]

Berto Gonzalez and Celine Latulipe. 2011. BiCEP: bimanual color exploration plugin. In CHI '11 Extended Abstracts on Human Factors in Computing Systems (CHI EA '11). ACM, New York, NY, USA, 1483-1488.

Digital Library

[7]

Massimo Greco, Natale Stucchi, Daniele Zavagno, and Barbara Marino. 2008. On the portability of computer-generated presentations: The effect of text-background color combinations on text legibility. Human factors 50, 5 (2008), 821-833.

[8]

Fredrik Hansen, Josef Jan Krivan, and Frode Eika Sandnes. 2019. Still Not Readable? An Interactive Tool for Recommending Color Pairs with Sufficient Contrast based on Existing Visual Designs. In The 21st International ACM SIGACCESS Conference on Computers and Accessibility (ASSETS '19). Association for Computing Machinery, New York, NY, USA, 636–638.

Digital Library

[9]

Shashank Kumar, JeevithaShree DV, and Pradipta Biswas. 2020. Accessibility evaluation of websites using WCAG tools and Cambridge Simulator. arXiv preprint arXiv:2009.06526.

[10]

M. L. Mathews. 1989. Visual performance with coloured CRT displays: research update. Appl. Ergon. 20, 58 (1989), 58. https://doi.org/10.1016/0003-6870(89)90011-2

[11]

Barbara J. Meier, Anne Morgan Spalter, and David B. Karelitz. 2004. Interactive color palette tools. IEEE Computer Graphics and Applications 24, 3 (2004), 64- 72.

Digital Library

[12]

Giovanni Moretti and Paul Lyons. 2002. Tools for the selection of colour palettes. In Proceedings of the SIGCHI-NZ Symposium on Computer-Human Interaction (CHINZ '02). ACM, New York, NY, USA, 13-18.

Digital Library

[13]

Richard Nguyen and Connor Geddes. 2019. Exploring Haptic Colour Identification Aids. In The 21st International ACM SIGACCESS Conference on Computers and Accessibility (ASSETS '19). Association for Computing Machinery, New York, NY, USA, 709–711.

Digital Library

[14]

Lasse Apalnes Pedersen, Svavar Skuli Einarsson, Fredrik Arne Rikheim, and Frode Eika Sandnes. 2020. User Interfaces in Dark Mode During Daytime–Improved Productivity or Just Cool-Looking?. In International Conference on Human-Computer Interaction. Springer, Cham. 178-187.

Digital Library

[15]

Gajo Petrovic and Hamido Fujita. 2017. Deep Correct: Deep Learning Color Correction for Color Blindness. SoMeT, pp. 824-834.

[16]

Katharina Reinecke, David R. Flatla, and Christopher Brooks. 2016. Enabling Designers to Foresee Which Colors Users Cannot See. In Proceedings of the 2016 CHI Conference on Human Factors in Computing Systems (CHI '16). ACM, New York, NY, USA, 2693- 2704.

Digital Library

[17]

Luz Rello and Jeffrey P. Bigham. 2017. Good Background Colors for Readers: A Study of People with and without Dyslexia. In Proceedings of the 19th International ACM SIGACCESS Conference on Computers and Accessibility (ASSETS '17). Association for Computing Machinery, New York, NY, USA, 72–80.

Digital Library

[18]

Frode Eika Sandnes and Anqi Zhao. 2015. An interactive color picker that ensures WCAG2. 0 compliant color contrast levels. Procedia Computer Science 67 (2015), 87-94.

[19]

Frode Eika Sandnes and Anqi Zhao. 2015. A contrast colour selection scheme for WCAG2.0-compliant web designs based on HSV-half-planes. In Proceedings of the 2015 IEEE International Conference on Systems, Man, and Cybernetics (SMC 2015). IEEE, 1233-1237.

Digital Library

[20]

Frode Eika Sandnes. 2016. Understanding WCAG2.0 color contrast requirements through 3D color space visualization. Studies in health technology and informatics 229 (2016), 366-375.

[21]

Frode Eika Sandnes. 2017. On-screen colour contrast for visually impaired readers. In: Information Design: Research and Practice. Alison Black, Paul Luna, Ole Lund and Sue Walker (eds.). Routledge, 405-416.

[22]

Frode Eika Sandnes. 2018. An image-based visual strategy for working with color contrasts during design. In Proceedings of the International Conference on Computers Helping People with Special Needs (ICCHP), LNCS Vol. 10896, Springer, Cham, 35-42.

Digital Library

[23]

Garreth W. Tigwell, David R. Flatla, and Neil D. Archibald. 2017. ACE: A Colour Palette Design Tool for Balancing Aesthetics and Accessibility. ACM Trans. Access. Comput. 9, 2, Article 5 (January 2017), 32 pages.

Digital Library

[24]

Garreth W. Tigwell, David R. Flatla, and Rachel Menzies. 2018. It's not just the light: understanding the factors causing situational visual impairments during mobile interaction. In Proceedings of the 10th Nordic Conference on Human-Computer Interaction (NordiCHI '18). Association for Computing Machinery, New York, NY, USA, 338–351.

Digital Library

[25]

Garreth W. Tigwell, Rachel Menzies, and David R. Flatla. 2018. Designing for Situational Visual Impairments: Supporting Early-Career Designers of Mobile Content. In Proceedings of the 2018 Designing Interactive Systems Conference (DIS '18). Association for Computing Machinery, New York, NY, USA, 387–399.

Digital Library

[26]

Garreth W. Tigwell. 2021. Nuanced Perspectives Toward Disability Simulations from Digital Designers, Blind, Low Vision, and Color Blind People. In Proceedings of the 2021 CHI Conference on Human Factors in Computing Systems (CHI '21). Association for Computing Machinery, New York, NY, USA, Article 378, 1–15.

Digital Library

[27]

Luigi Troiano, Cosimo Birtolo, and Maria Miranda. 2008. Adapting palettes to color vision deficiencies by genetic algorithm. In Proceedings of the 10th annual conference on Genetic and evolutionary computation (GECCO '08), Maarten Keijzer (Ed.). ACM, New York, NY, USA, 1065-1072.

Digital Library

[28]

W3C, WCAG2.1. Retrieved June 16, 2021 from https://www.w3.org/TR/WCAG21/

[29]

Ken Wakita and Kenta Shimamura. 2005. SmartColor: disambiguation framework for the colorblind. In Proceedings of the 7th international ACM SIGACCESS conference on Computers and accessibility (Assets '05). Association for Computing Machinery, New York, NY, USA, 158–165.

Digital Library

[30]

Montgomery Webster. 2014. Integrating color usability components into design tools. interactions 21, 3 (May 2014), 56-61.

Digital Library

[31]

Xiaojiao Xie, Fanghao Song, Yan Liu, Shurui Wang, and Dong. 2021. Study on the Effects of Display Color Mode and Luminance Contrast on Visual Fatigue. IEEE Access, 9, 35915-35923.

Cited By

Sandnes FMurad NKhaled MEl Nassani F(2024)A smart handheld magnifier for reflowing printed text notices in public spacesDisability and Rehabilitation: Assistive Technology10.1080/17483107.2024.233390419:8(3153-3165)Online publication date: Apr-2024
https://doi.org/10.1080/17483107.2024.2333904
Sandnes F(2024)“Consent notices are obstructing my view”: Viewing sticky elements on responsive websites under the magnifying glassDisplays10.1016/j.displa.2023.10257981(102579)Online publication date: Jan-2024
https://doi.org/10.1016/j.displa.2023.102579
Sandnes F(2024)How Order and Omission of Web Content Can Vary Unintentionally Across User Cohorts: A ReviewUniversal Access in Human-Computer Interaction10.1007/978-3-031-60881-0_6(80-99)Online publication date: 1-Jun-2024
https://doi.org/10.1007/978-3-031-60881-0_6
Show More Cited By

Index Terms

Inverse Color Contrast Checker: Automatically Suggesting Color Adjustments that meet Contrast Requirements on the Web
1. Applied computing

Index terms have been assigned to the content through auto-classification.

Recommendations

Still Not Readable? An Interactive Tool for Recommending Color Pairs with Sufficient Contrast based on Existing Visual Designs
ASSETS '19: Proceedings of the 21st International ACM SIGACCESS Conference on Computers and Accessibility

Most contrast checking tools allow designers to verify if a set of colors satisfy the minimum contrast requirements for text and background colors. However, such tools usually do not provide the designer with any clues on how the colors should be ...
Illumination Estimation Based Color Contrast Enhancement
IIH-MSP '12: Proceedings of the 2012 Eighth International Conference on Intelligent Information Hiding and Multimedia Signal Processing

We present the framework for a color contrast enhancement using an illumination estimation, color balancing and color dynamic range expansion based on characteristics of a object reflectance, effect of illumination and human face color depending on ...
Color spaces and color contrast

With the introduction of low-cost color graphics systems comes a host of problems specifically concerned with the color aspect of the system. This paper discusses two of these problems: the selection and manipulation of colors by (possibly) ...

Comments

Information & Contributors

Information

Published In

cover image ACM Conferences

ASSETS '21: Proceedings of the 23rd International ACM SIGACCESS Conference on Computers and Accessibility

October 2021

730 pages

ISBN:9781450383066

DOI:10.1145/3441852

Editors:
Jonathan Lazar
University of Maryland, USA
,
Jinjuan Heidi Feng
Towson University, USA
,
Faustina Hwang
Towson University, USA

Copyright © 2021 Owner/Author.

Permission to make digital or hard copies of part or all of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. Copyrights for third-party components of this work must be honored. For all other uses, contact the Owner/Author.

Sponsors

SIGACCESS: ACM Special Interest Group on Accessible Computing

Publisher

Association for Computing Machinery

New York, NY, United States

Publication History

Published: 17 October 2021

Check for updates

Author Tags

Qualifiers

Poster
Research
Refereed limited

Conference

ASSETS '21

Sponsor:

SIGACCESS

ASSETS '21: The 23rd International ACM SIGACCESS Conference on Computers and Accessibility

October 18 - 22, 2021

Virtual Event, USA

Acceptance Rates

ASSETS '21 Paper Acceptance Rate 36 of 134 submissions, 27%;

Overall Acceptance Rate 436 of 1,556 submissions, 28%

Contributors

Other Metrics

View Article Metrics

Bibliometrics & Citations

Bibliometrics

Article Metrics

7
Total Citations
View Citations
164
Total Downloads

Downloads (Last 12 months)44
Downloads (Last 6 weeks)6

Reflects downloads up to 10 Nov 2024

Other Metrics

View Author Metrics

Citations

Cited By

Sandnes FMurad NKhaled MEl Nassani F(2024)A smart handheld magnifier for reflowing printed text notices in public spacesDisability and Rehabilitation: Assistive Technology10.1080/17483107.2024.233390419:8(3153-3165)Online publication date: Apr-2024
https://doi.org/10.1080/17483107.2024.2333904
Sandnes F(2024)“Consent notices are obstructing my view”: Viewing sticky elements on responsive websites under the magnifying glassDisplays10.1016/j.displa.2023.10257981(102579)Online publication date: Jan-2024
https://doi.org/10.1016/j.displa.2023.102579
Sandnes F(2024)How Order and Omission of Web Content Can Vary Unintentionally Across User Cohorts: A ReviewUniversal Access in Human-Computer Interaction10.1007/978-3-031-60881-0_6(80-99)Online publication date: 1-Jun-2024
https://doi.org/10.1007/978-3-031-60881-0_6
Hameed MChaudhry FSabiha FSandnes F(2023)Towards Safe Encounters between Pedestrians and Autonomous Driverless Vehicles: Comparing Adults and Children's Perceptions of External Human Machine Interface Design FeaturesProceedings of the 16th International Conference on PErvasive Technologies Related to Assistive Environments10.1145/3594806.3594827(165-170)Online publication date: 5-Jul-2023
https://dl.acm.org/doi/10.1145/3594806.3594827
Sandnes F(2023)To wrap or not to wrap? A study of how long words are split when reflowed on magnified web pagesUniversal Access in the Information Society10.1007/s10209-023-01066-yOnline publication date: 11-Nov-2023
https://doi.org/10.1007/s10209-023-01066-y
Sandnes F(2023)Exploring the Usability of the LCH Color Model for Web DesignersCooperative Design, Visualization, and Engineering10.1007/978-3-031-43815-8_5(43-55)Online publication date: 1-Oct-2023
https://dl.acm.org/doi/10.1007/978-3-031-43815-8_5
Sandnes FMakedon F(2022)Lost in OCR-Translation: Pixel-based Text Reflow to the RescueProceedings of the 15th International Conference on PErvasive Technologies Related to Assistive Environments10.1145/3529190.3534734(500-506)Online publication date: 29-Jun-2022
https://dl.acm.org/doi/10.1145/3529190.3534734

View Options

Get Access

Login options

Check if you have access through your login credentials or your institution to get full access on this article.

Full Access

Get this Publication

View options

PDF

View or Download as a PDF file.

eReader

View online with eReader.

HTML Format

View this article in HTML Format.

Media

Figures

Other

Tables

View Table of Contents