{"id":3444,"date":"2025-08-05T18:31:10","date_gmt":"2025-08-05T18:31:10","guid":{"rendered":"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/?post_type=knowledge_base&#038;p=3444"},"modified":"2026-07-24T17:29:08","modified_gmt":"2026-07-24T17:29:08","slug":"media-library-locating-ada-compliant-contrast-ratio-media","status":"publish","type":"post","link":"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/media-library-locating-ada-compliant-contrast-ratio-media\/","title":{"rendered":"Media Library: Locating ADA-Compliant Contrast Ratio Media"},"content":{"rendered":"<p>StepStone authors are encouraged to follow best practices regarding ADA Accessibility. To help facilitate this goal, the <b>StepStone Media Library<\/b> provides an assortment of media with an ADA-Compliant contrast ratio (when used as a background behind the default StepStone text color and\/or black text).<\/p>\n<p>To utilize the StepStone Media Library, authors should already be familiar with the <b>StepStone Media Manager<\/b>. <a href=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/editing-a-step-adding-media\/\" target=\"_blank\" rel=\"noopener\">View a brief video tutorial and further media information regarding the Media Manager<\/a>.<\/p>\n<p>In the <b>StepStone Path Builder<\/b>, launch the Media Manager by clicking the <b>Choose<\/b> button available on any media block within a loaded Path.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-3467\" src=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant01.png\" alt=\"\" width=\"1616\" height=\"1244\" srcset=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant01.png 1616w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant01-300x231.png 300w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant01-1024x788.png 1024w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant01-768x591.png 768w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant01-1536x1182.png 1536w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant01-710x547.png 710w\" sizes=\"auto, (max-width: 1616px) 100vw, 1616px\" \/><\/p>\n<p>In the Media Manager, use the <b>Launch StepStone Media Library<\/b> button.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-3468\" src=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant02.png\" alt=\"\" width=\"1616\" height=\"1244\" srcset=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant02.png 1616w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant02-300x231.png 300w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant02-1024x788.png 1024w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant02-768x591.png 768w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant02-1536x1182.png 1536w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant02-710x547.png 710w\" sizes=\"auto, (max-width: 1616px) 100vw, 1616px\" \/><\/p>\n<p>The Media Library should launch with all Search and Filtering options empty\/unspecified. Locate the Attributes section in the Media Filters panel. Here, we have hidden all other options and filters for clarity. Enable the <b>ADA Contrast Compliant<\/b> attribute toggle, then use the lit <b>Update Results<\/b> button to view the filtered results.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-3469\" src=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant03.png\" alt=\"\" width=\"1616\" height=\"1244\" srcset=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant03.png 1616w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant03-300x231.png 300w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant03-1024x788.png 1024w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant03-768x591.png 768w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant03-1536x1182.png 1536w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant03-710x547.png 710w\" sizes=\"auto, (max-width: 1616px) 100vw, 1616px\" \/><\/p>\n<p>In the updated results, all of the items with the ADA Contrast Compliant attribute will display with a split, circular badge icon.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-3479\" src=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant04-1.png\" alt=\"\" width=\"1616\" height=\"1244\" \/><\/p>\n<p>This attribute is also indicated in the media details pop-up panel, available via clicking on the thumbnail image on any media result.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-3478\" src=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant05-1.png\" alt=\"\" width=\"1616\" height=\"1244\" \/><\/p>\n<p>To import media into the current Path&#8217;s Media Manager, use the media item checkboxes to select one or more media items. After selecting media, use the <b>Import Selections<\/b> button in the top control strip.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-3472\" src=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant06.png\" alt=\"\" width=\"1616\" height=\"1244\" srcset=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant06.png 1616w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant06-300x231.png 300w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant06-1024x788.png 1024w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant06-768x591.png 768w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant06-1536x1182.png 1536w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant06-710x547.png 710w\" sizes=\"auto, (max-width: 1616px) 100vw, 1616px\" \/><\/p>\n<p>After importing is completed, a confirmation notice will display in the top menu strip. Use the <b>Exit Media Library<\/b> to return to the Media Manager.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-3473\" src=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant07.png\" alt=\"\" width=\"1616\" height=\"1244\" srcset=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant07.png 1616w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant07-300x231.png 300w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant07-1024x788.png 1024w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant07-768x591.png 768w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant07-1536x1182.png 1536w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant07-710x547.png 710w\" sizes=\"auto, (max-width: 1616px) 100vw, 1616px\" \/><\/p>\n<p>The media imported from the Media Library should now display in the Media Manager, ready for placement or further processing\/labeling.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-3474\" src=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant08.png\" alt=\"\" width=\"1616\" height=\"1244\" srcset=\"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant08.png 1616w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant08-300x231.png 300w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant08-1024x788.png 1024w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant08-768x591.png 768w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant08-1536x1182.png 1536w, https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-content\/uploads\/2025\/08\/mediaLibADAContrastCompliant08-710x547.png 710w\" sizes=\"auto, (max-width: 1616px) 100vw, 1616px\" \/><\/p>\n","protected":false},"excerpt":{"rendered":"<p>StepStone authors are encouraged to follow best practices regarding ADA Accessibility. To help facilitate this goal, the StepStone Media Library provides an assortment of media with an ADA-Compliant contrast ratio (when used as a background behind the default StepStone text color and\/or black text). To utilize the StepStone Media Library, authors should already be familiar [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[42],"tags":[],"class_list":["post-3444","post","type-post","status-publish","format-standard","hentry","category-ada-accessibility"],"_links":{"self":[{"href":"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-json\/wp\/v2\/posts\/3444","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-json\/wp\/v2\/comments?post=3444"}],"version-history":[{"count":5,"href":"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-json\/wp\/v2\/posts\/3444\/revisions"}],"predecessor-version":[{"id":3653,"href":"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-json\/wp\/v2\/posts\/3444\/revisions\/3653"}],"wp:attachment":[{"href":"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-json\/wp\/v2\/media?parent=3444"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-json\/wp\/v2\/categories?post=3444"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.tamucet.org\/stepstone\/knowledgebase\/wp-json\/wp\/v2\/tags?post=3444"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}