{"id":60,"date":"2020-11-05T21:56:13","date_gmt":"2020-11-05T21:56:13","guid":{"rendered":"http:\/\/sites.msudenver.edu\/accessible-design\/?page_id=60"},"modified":"2020-11-17T16:10:42","modified_gmt":"2020-11-17T16:10:42","slug":"color-indicator","status":"publish","type":"page","link":"https:\/\/sites.msudenver.edu\/accessible-design\/color-indicator\/","title":{"rendered":"Color As Indicator"},"content":{"rendered":"<p class=\"p1\"><span style=\"font-family: verdana, geneva, sans-serif;font-size: 14pt\">When designing for interactivity with a document or website,<span class=\"Apple-converted-space\">\u00a0 <\/span>be sure to add icons that indicate where actions are needed. Doing so would prevent a percentage of your audience not getting confused with \u201chighlighted\u201d fields with colors they can\u2019t distinguish.<\/span><\/p>\n<p><strong><span style=\"font-family: verdana, geneva, sans-serif;font-size: 14pt\">Example of color indicators<\/span><\/strong><\/p>\n<p><span style=\"font-family: verdana, geneva, sans-serif;font-size: 14pt\">Accessible:<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-142\" src=\"http:\/\/sites.msudenver.edu\/accessible-design\/wp-content\/uploads\/sites\/467\/2020\/11\/StickersArtboard-1.png\" alt=\"Form with accessible color indicators use, providing icons where missing fields are\" width=\"355\" height=\"397\" srcset=\"https:\/\/sites.msudenver.edu\/accessible-design\/wp-content\/uploads\/sites\/467\/2020\/11\/StickersArtboard-1.png 355w, https:\/\/sites.msudenver.edu\/accessible-design\/wp-content\/uploads\/sites\/467\/2020\/11\/StickersArtboard-1-268x300.png 268w\" sizes=\"auto, (max-width: 355px) 100vw, 355px\" \/><\/p>\n<p><span style=\"font-size: 14pt;font-family: verdana, geneva, sans-serif\">Inaccessible:<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-141 size-full\" src=\"http:\/\/sites.msudenver.edu\/accessible-design\/wp-content\/uploads\/sites\/467\/2020\/11\/StickersArtboard-4.png\" alt=\"Form indicating a missing field just by highlighting a thin salmon line\" width=\"352\" height=\"389\" srcset=\"https:\/\/sites.msudenver.edu\/accessible-design\/wp-content\/uploads\/sites\/467\/2020\/11\/StickersArtboard-4.png 352w, https:\/\/sites.msudenver.edu\/accessible-design\/wp-content\/uploads\/sites\/467\/2020\/11\/StickersArtboard-4-271x300.png 271w\" sizes=\"auto, (max-width: 352px) 100vw, 352px\" \/><\/p>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>When designing for interactivity with a document or website,\u00a0 be sure to add icons that indicate where actions are needed. Doing so would prevent a percentage of your audience not getting confused with \u201chighlighted\u201d fields with colors they can\u2019t distinguish. Example of color indicators Accessible: [&hellip;]<\/p>\n","protected":false},"author":860,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_exactmetrics_skip_tracking":false,"_exactmetrics_sitenote_active":false,"_exactmetrics_sitenote_note":"","_exactmetrics_sitenote_category":0,"footnotes":""},"class_list":["post-60","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/sites.msudenver.edu\/accessible-design\/wp-json\/wp\/v2\/pages\/60","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sites.msudenver.edu\/accessible-design\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sites.msudenver.edu\/accessible-design\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sites.msudenver.edu\/accessible-design\/wp-json\/wp\/v2\/users\/860"}],"replies":[{"embeddable":true,"href":"https:\/\/sites.msudenver.edu\/accessible-design\/wp-json\/wp\/v2\/comments?post=60"}],"version-history":[{"count":0,"href":"https:\/\/sites.msudenver.edu\/accessible-design\/wp-json\/wp\/v2\/pages\/60\/revisions"}],"wp:attachment":[{"href":"https:\/\/sites.msudenver.edu\/accessible-design\/wp-json\/wp\/v2\/media?parent=60"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}