Accessibility Evaluation Report

Transcription

1 BEYOND EXPECTATION Accessibility Evaluation Report SAMPLE CLIENT This report describes the conformance of the Sample Client Web site with W3C s Web Content Accessibility Guidelines (WCAG) 2.0. The review process is described in Section 5 below and is based on the W3C s Conformance Evaluation method as described in Evaluating Web Sites for Accessibility. Based on this evaluation, the Sample Client Web site does not meet WCAG 2.0, Conformance Level Double A. Detailed review results are available in Section 6 below. Resources for follow-up study are listed in Section 7 below. Feedback on this evaluation is welcome.

2 Evaluation Background Conformance evaluation of Web accessibility requires a combination of semi-automated evaluation tools and manual evaluation by an experienced reviewer. The evaluation results in this report are based on evaluation conducted on the following date(s): July 11 July 14, The Web site may have changed since that time. Additional information on the evaluation process is available in Evaluating Web Sites for Accessibility. WEB SITE REVIEWED: Sample Client URL: conncoll.edu REVIEWED BY: Gregg Nakamura Web Developer REVIEW PROCESS: WCAG 2.0 Level for which conformance was tested, e.g. WCAG 2.0 Level A, Level AA Automated Testing Conducted With: n Tenon.io n WAVE n axe n pa11y n tota11y Manual testing process: n Keyboard testing with Tab key n Check for hidden focus (mobile navigation) n Navigate using screen reader: NVDA (Windows) and VoiceOver (Mac) n Check for alt text on images n Zoom in (up to 200%), zoom out n Confirm custom controls interact with screen reader using tab and/or arrow keys n Headings - correct usage of h1 - h6 tags n Landmarks - correct usage of landmarks (i.e. - labels on all ARIA landmarks)

3 Recommended Results & Actions Based on the audit of Sample Client s conncoll.edu website, the following results and actions are recommended in order to become compliant with the WCAG 2.0, Conformance Level Double A. See section one and section two for the results. SECTION 1: MANUAL TESTING PROCESS GLOBAL No Skip links present on site n Recommended that this be added to allow users to bypass to headers or landmarks or any other notable section on the page n Focus n Order does not follow visual layout / flow ( n Some focus indicators are missing n Search n Odd character announced - appears to be the inserted search icon in before css rule n n Consider adding a text alternative to make more clear Hidden main navigation elements are focusable n Seems to work correctly via keyboard in Safari, but not in Chrome n Links that are visually hidden, should also be removed from tab focus, and added back into tab focus when navigation is expanded n Main navigation n When active, utility navigation is accessible, but hidden when focused n n Should not be focusable while navigation is active

4 Document Structure n Homepage: Missing <h1> tag n More than one h1 tag on subpages n n Landmarks n Labels should be added to Landmarks n n All external links n Recommendation: Let user know they are opening link in new tab / window n SUBPAGES Tab order issues with two column right layouts n Should go through main content, then aside n Document Structure n More than one h1 tag on most pages Horizontal items (scrollers) n left/right buttons are not accessible via keyboard n Only accessible items (focusable) should be one in view, not all n Hide non-, un-active elements from assistive technologies n Tabbing through items seems to affect the page, making it impossible to scroll back to the main content of the page Dropdown selects n Hidden item elements when tabbing through links on page n n Items not accessible via directional pad

5 HOMEPAGE Search Areas of Study n Departments: departments have an opacity of 1, while the in have an opacity of.4 n Unable to activate next grouping of results via keyboard n In departments should not be accessible unless activated Information & Resources for n Focus should move to content of active tab; currently does not Roll-over (Hero) n Tabbing into an item seems to break the designs View event by Category dropdown n Add ARIA to describe name, role, and state of dropdown since this is not constructed with semantic HTML elements Horizontal items: See Subpages section above for more details n Search Areas of Study n Departments: departments are have an opacity of 1, while the in have an opacity of.4 n In departments should be noted as such for screen readers users Tabbed content headers announced as link. Should be announced at Tab n Document Structure n Missing <h1> TECHNOLOGY SERVICES Roll-over (Hero) n Tabbing into an item seems to break the designs

6 STUDENT ACCESSIBLITY SERVICES n Horizontal items: See Subpages section above for more details COLLEGE CALENDAR n Horizontal items: See Subpages section above for more details n Featured Events left/right buttons are not accessible nor functionable via keyboard ALUMNIN n Horizontal items: See Subpages section above for more details MAGAZINE HOME n Inconsistent focus indication COMMENCEMENT n Horizontal items: See Subpages section above for more details n Order does not follow visual layout / flow n NEWS n Horizontal items: See Subpages section above for more details n View event by Year dropdown n Add ARIA to describe name, role, and state of dropdown since this is not constructed with semantic HTML elements n Button has indiscernible text n View News by Year button is announced as: n Not clear what 2017 is in reference to

7 TODAY AT CONN n Announcements n Background colors are random; some text fails color n <aside class= callout_body truncate message > n Horizontal items: See Subpages section above for more details n Event Calendar Tabs (below horizontal slider) n Focus should move to content of active tab; currently does not n Off-Campus Events n n Tab order issues n Event items not expandable via keyboard n RSS Subscribe not accessible n Faculty, Staff and Student Achievements Tabs n Focus should move to content of active tab; current does not n Modal items have color issues. MEET OUR PRESIDENT n Document Structure issues ( n Horizontal items: See Subpages section above for more details REUNION SCHEDULE n Document Structure issues ( n Horizontal items: See Subpages section above for more details

8 SECTION: GLOBAL Zooming and scaling must not be disabled head > meta[name= viewport ] <meta name= viewport content= width=device-width, initial-scale=1, maximumscale=1, user-scalable=no > <meta> tag disables zooming on mobile devices com/rules/axe/2.3/metaviewport?application=axechrome WCAG 2.0 (AA) Resize text Update to: <meta name= viewport content= width=device-width, initialscale=1.0, shrink-to-fit=no > Certain ARIA roles must contain particular children #selecter_resources (mobile navigation) <select> Required ARIA children role not present: menuitem menuitemradio menuitemcheckbox com/ rules/axe/2.2/aria-requiredchildren?application=axefirefox WCAG 2.0 (A) Info Fix at least one (1) of these issues: Form elements must have labels #selecter_resources (mobile navigation) <select name= selecter_ resources id= selecter_ resources class= js-select selecter_resources selecterelement data-selecter-op tions= {"customcla ss":"resource_ handle"} tabindex= -1 > - Form element does not have an implicit (wrapped) <label> - Form element does not have an explicit <label> - Element has no title attribute or the title attribute is empty com/rules/ axe/2.3/label?application=axechrome WCAG 2.0 (A) Info WCAG 2.0 (A) Labels or Instructions Form does not contain a submit button Mobile navigation, Specialized Resources dropdown <form action= # method= GET class= specres label= Specialized Resources > <div class= selecter re...</form> Creates issues for those who cannot submit the form using the keyboard. Submit buttons are INPUT elements with type attribute submit or image, or BUTTON elements with type submit or omitted/invalid WCAG 2.0 (A) On input Main site logo text (<span> element) <span class= logo_text visually_hidden >Sample Client</span> (select with #header > div > div > a > span ) Expected a ratio of at least 4.5:1, but text in this element has a ratio of 1:1. Recommendation: change text colour to #fefeff com/rules/axe/2.3/color?application=axechrome Text input does not have an accessible name Mobile search <input type= text class= text mobile_ search_query mobile-2 name= q placeholder= autocomplete= off label= Search query > (select with html > body > div:nthchild(7) > div > form > div > input:nth-child(1) ) Valid names are: label element, title attribute. WCAG 2.0 (A) Name, Role, Value Form field should be labelled in some way Mobile search <input type= text class= text mobile_ search_query mobile-2 name= q placeholder= autocomplete= off label= Search query > (select with html > body > div:nthchild(7) > div > form > div > input:nth-child(1) ) Use the label element (either with a for attribute or wrapped around the form field), or title, aria-label or aria-labelledby attributes as appropriate. WCAG 2.0 (A) Info

9 Anchor element found with no link content and no name and/or ID attribute Footer Example: <a id= d. en ></a> <a class= href= > </a> (select with #page > section > div > article > div > footer > a:nth-child(2) ) WCAG 2.0 (A) Name, Role, Value SiteManager?ctfn=template&fnno=110&tid= 221&tfMT=text%2Fnew-responsive-contact SECTION: SUBPAGES Breadcrumbs <a href= / admission/ >Admission & Financial Aid</a> Element has insufficient color of 1.81 (foreground color: #c0c0c0, background color: #ffffff, font size: 12.0pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Contact Card <a class= department_link button button_small contact_card_link single-link color_blue_5 href= /financialaid/ >View Office Page</a> Element has insufficient color of 3.99 (foreground color: #66829f, background color: #ffffff, font size: 10.5pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Contact Card light blue text (IT Service Desk, Mailing Address, Today s Hours, etc) Element has insufficient color of 3.99 (foreground color: #66829f, background color: #ffffff, font size: 10.5pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Social media links Twitter, Instagram, Facebook links Element has insufficient color of 3.74 (foreground color: #848484, background color: #ffffff, font size: 10.5pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Hero title, Student Accessibility Services <h1 class= heading_2 color_ white text_shadow no_margin header_image_title >Student Accessibility Services</h1> (select with #master_banner > div:nth-child(1) > div > h1 ) Expected a ratio of at least 3:1, but text in this element has a ratio of 1:1. Recommendation: change text colour to # com/rules/axe/2.3/color?application=axechrome SECTION: HOME PAGE Hero fig caption ( Middle Passage ) <figcaption class= label label_image label_image_top color_white text_shadow supporting_story_ caption >Middle Passage</ figcaption> Element has insufficient color of 4.37 #108875, font size: 12.0pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome

10 Hero fig caption ( After Commencement ) <figcaption class= label label_image label_ image_top color_white text_shadow supporting_ story_caption >After Commencement</figcaption> Element has insufficient color of 4.04 #ab7318, font size: 12.0pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Hero ( 99th Commencement ) <h2 class= featured_story_ heading heading_1 color_white text_shadow bar_decoration_ bottom bar_decoration_ padded none >99th Commencement</h2> (select with #page > header > section > div > article > div:nth-child(1) > h2 ) Expected a ratio of at least 3:1, but text in this element has a ratio of 1:1. Recommendation: change text colour to # Links must have discernable text #page > header > section >.home_feature_content > article >.wallpaper_content. featured_story_content > p > a[href$= commencement/ ] <a class= featured_story_link heading_4 color_white text_shadow href= / commencement/ ></a> - Element does not have text that is to screen readers overridden with role= none com/rules/axe/2.3/linkname?application=axechrome WCAG 2.0 (A) Nontext Content WCAG 2.0 (A) Name, Role, Value Search areas of study item, Featured Integrative Pathway <div class= label label_image label_image_top color_white text_shadow >Featured Integrative Pathway</div> (select with #page > main > section:nth-child(4) > div > div:nth-child(2) > div:nthchild(2) > article > div > header > div ) Expected a ratio of at least 4.5:1, but text in this element has a ratio of 1:1. Recommendation: change text colour to # com/rules/axe/2.3/linkname?application=axechrome Search areas of study item, Public Health <h3 class= callout_heading_1 color_white >Public Health</ h3> (select with #page > main > section:nth-child(4) > div > div:nth-child(2) > div:nth-child(2) > article > div > div > h3 ) Expected a ratio of at least 3:1, but text in this element has a ratio of 1:1. Recommendation: change text colour to # com/rules/axe/2.3/linkname?application=axechrome Search areas of study item, From vaccines to climate change... <p class= callout_ body_large text_shadow color_white >From vaccines to climate change...</p> (select with #page > main > section:nth-child(4) > div > div:nth-child(2) > div:nthchild(2) > article > div > div > p ) Expected a ratio of at least 4.5:1, but text in this element has a ratio of 1:1. Recommendation: change text colour to # com/rules/axe/2.3/linkname?application=axechrome

11 SECTION: STUDENT ACCESSIBILITY SERVICES Links must have discernable on twitter All reply,favorite, and retweet - Element does not have text that is to screen readers overridden with role= none com/rules/axe/2.3/linkname?application=axechrome WCAG 2.0 (A) Nontext Content WCAG 2.0 (A) Name, Role, Value AND Fix the following: - Element is in tab order and does not have accessible text Twitter feed Tweet time (x days ago) Element has insufficient color of 3.99 #66829f, font size: 10.5pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Links must have discernable text Twitter feed Tweeted Element has insufficient color of 3.99 #66829f, font size: 12.0pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Twitter feed All links in feed Element has insufficient color of 3.99 #66829f, font size: 12.0pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Anchor element found with no link content and no name and/or ID attribute. Contact Card content com/t/iqem4l3kwq <a class= department_link button button_small contact_card_link single-link color_blue_5 href= ></a> (select with #page > header > section:nth-child(7) > div > div > header > div > a:nthchild(1) ) WCAG 2.0 (A) Name, Role, Value Missing Title / Text value? Fig caption, aside, Service Request <figcaption class= label label_image label_image_top color_white text_shadow bar_decoration_top bar_decoration_full bar_decoration_transparent_ white > Service Reques...</ figcaption> (select with #page > header > div:nthchild(5) > div:nth-child(1) > div > article > a > figure > figcaption ) Expected a ratio of at least 4.5:1, but text in this element has a ratio of 1:1. Recommendation: change text colour to # com/rules/axe/2.3/color?application=axechrome

12 Fig caption, aside, Report a Physical Access Issue <h3 class= callout_heading_4 color_blue_6 style= color:#!important >Report a Physical Access Issue</h3> (select with #page > header > div:nth-child(5) > div:nthchild(1) > div > article > a > div > div > h3 ) Expected a ratio of at least 4.5:1, but text in this element has a ratio of 1.43:1. Recommendation: change text colour to #63798a. com/rules/axe/2.3/color?application=axechrome SECTION: LIBRARIES, COLLECTIONS AND SERVICES Main content Facebook, , and phone link text Element has insufficient color of 3.99 (foreground color: #66829f, background color: #ffffff, font size: 10.5pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Headings must not be empty Main Content (right above Other Services ) <h3> </h3> - Remove element if not needed - Element does not have text that is to screen readers overridden with role= none com/rules/axe/2.3/emptyheading?application=axechrome WCAG 2.0 (A) Info Unable to remove element. Able to find both page and layout used, but specific element marked for removal Img element missing an alt attribute Thumbnails <img class= thumbnail_ image src= /media/newmedia/library-site/shainlibtinybio.jpg > (select with #page > header > div:nthchild(4) > main > section > article > a:nth-child(1) > figure > img ) Use the alt attribute to specify a short text alternative com/rules/axe/2.3/imagealt?application=axechrome WCAG 2.0 (A) Nontext Content On further review, issue has been fixed by client or is a false positive SECTION: TECHNOLOGY SERVICES Headings must not be empty Main Content ( Technology Blogs ), decorative bar <h4 class= label label_block bar_decoration_top ></h4> - Element does not have text that is to screen readers overridden with role= none com/rules/axe/2.3/emptyheading?application=axechrome WCAG 2.0 (A) Info

13 Images must have alternate text Main Content ( Technology Services ) <img class= media_image image_contain src= / media/academic-centers/ ammerman/15-007_ ConnColl_ x694. jpg > - Element does not have an alt attribute - Element has no title attribute or the title attribute is empty overridden with role= none com/rules/axe/2.3/imagealt?application=axechrome WCAG 2.0 (A) Nontext Content On further review, issue has been fixed by client or is a false positive Fig captions on images <figcaption class= label label_image label_image_top color_white text_shadow supporting_story_ caption >For Students</ figcaption> (select with #features > article:nth-child(1) > a > figure > figcaption ) Expected a ratio of at least 4.5:1, but text in this element has a ratio of 4.37:1. Recommendation: change background to #0d8572. com/rules/axe/2.3/color?application=axechrome Explore Resources, appears on hover, on images <h4 class= label bar_decoration_top bar_ decoration_transparent color_ white >Explore Resources</ h4> (select with #features > article:nth-child(1) > a > div > h4 ) Expected a ratio of at least 4.5:1, but text in this element has a ratio of 4.37:1. Recommendation: change background to #0d8572. com/rules/axe/2.3/color?application=axechrome Technology Services, title (hover state) <h2 class= feature_set_ title >Technology Services</ h2> Element has insufficient color of 1.6 (foreground color: #c7c6c5, background color: #f8f7f6, font size: 48.0pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome SECTION: FIRST YEAR REQUIREMENTS AND DEADLINES Main content Application Type, Common Application, Notification Date Element has insufficient color of 3.99 (foreground color: #66829f, background color: #ffffff, font size: 12.0pt, font weight: bold) com/rules/axe/2.3/color?application=axechrome SECTION: ORIENTATION Aside Share this text Element has insufficient color of 1.42 (foreground color: #d8d8d8, background color: #ffffff, font size: 12.0pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome

14 Main Content (Questions?) Light blue heading text Element has insufficient color of 3.99 (foreground color: #66829f, background color: #ffffff, font size: 12.0pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Headings must not be empty Main Content ( Over the Hump ) items <h3 class= callout_heading_1 color_white ></h3> - Element does not have text that is to screen readers overridden with role= none com/rules/axe/2.3/emptyheading?application=axechrome WCAG 2.0 (A) Info Main Content ( Over the Hump ) titles <span class= date_ number >Welcome Camels</ span> (select with #page > section:nth-child(7) > div:nthchild(2) > div > div > div > article:nth-child(1) > a > div > header > div > span ) Expected a ratio of at least 3:1, but text in this element has a ratio of 1.12:1. Recommendation: change background to # com/rules/axe/2.3/color?application=axechrome SECTION: ADMISSION Meet our Team links Twitter, Facebook, lnks Expected a ratio of at least 4.5:1, but text in this element has a ratio of 3.76:1. Recommendation: change text colour to # com/rules/axe/2.3/color?application=axechrome Alumni Blue container above Related News & Media Expected a ratio of at least 4.5:1, but text in this element has a ratio of 1.43:1. Recommendation: change background to #63798a. com/rules/axe/2.3/color?application=axechrome Sample Client alumni are... Blue container above Related News & Media Expected a ratio of at least 4.5:1, but text in this element has a ratio of 4.39:1. Recommendation: change text colour to #5f5e5e. com/rules/axe/2.3/color?application=axechrome SECTION: MAJORS AND MINORS Form elements must have labels Main content ( Search Areas of Study ) seach input <input class= study_search_ input text type= text name= q placeholder= e.g. Biology autocomplete= off > - Form element does not have an implicit (wrapped) <label> - Form element does not have an explicit <label> - Element has no title attribute or the title attribute is empty com/rules/ axe/2.3/label?application=axechrome WCAG 2.0 (A) Info WCAG 2.0 (A) Labels or Instructions

15 SECTION: LIBRARIES Main Content ( Offline ) button <button class= libchat_ offline >Offline</button> Element has insufficient color of 4.28 #3278e0, font size: 15.0pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Headings must not be empty Main Content, above Need Research Assistance? title <h3><span style= font-size: 1em; > </span></h3> - Element does not have text that is to screen readers overridden with role= none com/rules/axe/2.3/emptyheading?application=axechrome WCAG 2.0 (A) Info Form elements must have labels OneSearch input textbox <input class= desktop-7 type= text id= primoquerytemp value= size= 35 label= OneSearch Query > - Form element does not have an implicit (wrapped) <label> - Form element does not have an explicit <label> - Element has no title attribute or the title attribute is empty com/rules/ axe/2.3/label?application=axechrome WCAG 2.0 (A) Info WCAG 2.0 (A) Labels or Instructions Aside ( FAQ ) button <p style= font-size:initial; class= button button_small button_solid text_shadow button_transparent_white button_small_padded no_margin_top > FAQ...</p> (select with #page > header > div:nth-child(4) > div:nthchild(1) > div > article > a > div > div > p ) Element has insufficient color of 4.28 #3278e0, font size: 15.0pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome This form does not contain a submit button OneSearch input textbox <form style= marginleft:8%; id= simple name= searchform method= get target= _self action= com/primo-explore/search enctype= application/xwww-form-urlencoded; charset=utf-8 onsubmit= searchprimo() >... (select with #simple ) Creates issues for those who cannot submit the form using the keyboard. Submit buttons are INPUT elements with type attribute submit or image, or BUTTON elements with type submit or omitted/invalid. WCAG 2.0 (A) On input Heading tag found with no content Element appears above Need Research Assistance?, view source or use dev tools to view <h3><span style= font-size: 1em; >&...</h3> (select with #page > header > div:nthchild(4) > main > h3:nthchild(9) ) Text that is not intended as a heading should not be marked up with heading tags. WCAG 2.0 (A) Info

16 Heading tag found with no content Element appears below Discussions on the art and craft of research?, in the Library Spotlight section; view source or use dev tools to view <h4 class= label label_block bar_decoration_top ></ h4> (select with #page > header > section:nth-child(6) > div:nth-child(2) > div > article:nth-child(1) > a > div > footer > h4 ) Text that is not intended as a heading should not be marked up with heading tags. WCAG 2.0 (A) Info SECTION: MAP Links must have discernable text Main Content, PDF link <a href= edu/media/website-media/ about/campusmap2017. pdf ></a> - Element does not have text that is to screen readers overridden with role= none com/rules/axe/2.3/linkname?application=axechrome WCAG 2.0 (A) Nontext Content WCAG 2.0 (A) Name, Role, Value Added `aria-label`, updated. Current status is pending, awaiting client approval AND Fix the following: - Element is in tab order and does not have accessible text SECTION: COLLEGE CALENDAR Headings must not be empty Aside, CC Magazine content <h3 class= callout_heading_4 color_blue_6 style= color:#!important ></h3> - Element does not have text that is to screen readers overridden with role= none com/rules/axe/2.3/emptyheading?application=axechrome WCAG 2.0 (A) Info Container: <div class= easypaginatenav style= width: 775px; > This link points to a named anchor page:1 within the document, but no anchor exists with that name. Pageination items Example item: <a href= #page:1 title= Page 1 rel= 1 class= page current >1</a> (select with #page > div:nth-child(5) > div:nth-child(1) > main > div:nth-child(4) > a:nthchild(2) ) WCAG 2.0 (A) Bypass Blocks

17 CC Magazine button, aside <p style= font-size:initial; class= button button_small button_solid text_shadow button_transparent_white button_small_padded no_margin_top > CC...</p> (select with #page > div:nthchild(5) > div:nth-child(3) > div > article > a > div > div > p ) Expected a ratio of at least 4.5:1, but text in this element has a ratio of 1:1. Recommendation: change text colour to # com/rules/axe/2.3/color?application=axechrome SECTION: ALUMNI Links must have discernable on twitter All reply,favorite, andretweet - Element does not have text that is to screen readers overridden with role= none com/rules/axe/2.3/linkname?application=axechrome WCAG 2.0 (A) Nontext Content WCAG 2.0 (A) Name, Role, Value AND Fix the following: - Element is in tab order and does not have accessible text Twitter feed Tweet time (x days ago) Element has insufficient color of 3.99 #66829f, font size: 10.5pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Twitter feed Tweeted ConnCollAlumni Element has insufficient color of 3.99 #66829f, font size: 12.0pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Twitter feed All links in feed Element has insufficient color of 3.99 #66829f, font size: 12.0pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Featured Internships, in Rapid Ratings container <h2 class= label color_ white callout_profile_ label >Featured Internships</ h2> (select with #page > div:nth-child(5) > div > div > article > div > div > header > h2 ) Expected a ratio of at least 4.5:1, but text in this element has a ratio of 1.43:1. Recommendation: change background to #63798a. com/rules/axe/2.3/color?application=axechrome

18 James Gellert 90, CEO and chai..., in Rapid Ratings container <p class= callout_body color_ gray_1 no_margin_top >James Gellert 90, CEO and chai...</ p> (select with #page > div:nth-child(5) > div > div > article > div > div > p ) Expected a ratio of at least 4.5:1, but text in this element has a ratio of 4.39:1. Recommendation: change text colour to #5f5e5e. com/rules/axe/2.3/color?application=axechrome SECTION: EXPERIENCE BLOG Pagination <span class= currentpage >1</span> Element has insufficient color of 3.99 #66829f, font size: 10.5pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome id attribute value must be unique addthis iframe added / loaded twice <iframe id= _atssh16 title= AddThis utility frame style= height: 1px; width: 1px;position: absolute; top: 0px; z-index: ; border: 0px; left: 0px; ></iframe> Document has multiple elements with the same id attribute: _atssh16 com/ rules/axe/2.3/duplicateid?application=axechrome WCAG 2.0 (A) Parsing SECTION: JIM DOWNS FACULTY PROFILE Main Content, blue text ( , phone number) Detail content Element has insufficient color of 3.99 (foreground color: #66829f, background color: #ffffff, font size: 10.5pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Images must have alternate text Main Content, detail image) <img class= thumbnail_ image src= /media/websitemedia/faculty/downs-jim.jpg > - Element does not have an alt attribute - Element has no title attribute or the title attribute is empty overridden with role= none com/rules/axe/2.3/imagealt?application=axechrome WCAG 2.0 (A) Nontext Content Appears that this type s Transformation needs to be updated to include an alt attribute

19 SECTION: CLASS OF 2017 TOLD ACT III IS EVERYTHING Button must have discernible text Play button on Youtube video <button class= ytp-large-playbutton ytp-button > - Element has a value attribute and the value attribute is empty - Element has no value attribute or the value attribute is empty - Element does not have inner text that is to screen readers overridden with role= none com/rules/axe/2.3/buttonname?application=axechrome WCAG 2.0 (A) Name, Role, Value Suggest adding title to <iframe> AND Fix the following: - Element is in tab order and does not have accessible text Main Content, For full Commencement coverage... in grey content box <h2 class= label color_white callout_profile_label >The New York Times</h2> Element has insufficient color of 1.42 #d8d8d8, font size: 12.0pt, font weight: normal) com/rules/axe/2.3/color?application=axechrome Documents must have <title> element to aid in navigation Page missing <title> Page source Document does not have a non-empty <title> element com/ rules/axe/2.3/documenttitle?application=axechrome WCAG 2.0 (A) Page Titled Frames must have title attribute Vimeo video <iframe src= // player.vimeo.com/ - Element has no title attribute or the title attribute is empty overridden with role= none com/rules/axe/2.3/frametitle?application=axechrome WCAG 2.0 (A) Name, Role, Value