WEST EJ Center
The WEST EJ CenteR, housed at the University of Arizona, An Environmental Justice Thriving Communities Technical Assistance Center.
.jpg)
Tools Used:
PowerMapper: Used to assess overall website accessibility and identify layout issues.
WAVE Evaluation Tool: Quickly identified accessibility errors, including structural issues like headings and missing alt text.
Color Contrast Analyzer (WebAIM): Checked text-background color contrast to ensure compliance with WCAG guidelines. WebAIM Color Contrast Checker.
Lighthouse: Used for performance audits, accessibility checks, and SEO optimization across the website.
Axe Accessibility Checker: Integrated into the browser to test and detect accessibility violations in real-time for better issue identification during development.
Why Compliance with Accessibility Standards Like WCAG is Important:
Adhering to accessibility standards such as WCAG ensures that websites are usable by all individuals, regardless of their disabilities. Compliance not only enhances the user experience but also expands the website's reach, making it accessible to a broader audience.
Perceivable Content
Text Alternatives for non-text content
I recommend ensuring that all non-text content has proper text alternatives. This includes providing accurate alt text for images and icons, captions or transcripts for audio and video content, and empty alt attributes for decorative images. Additionally, avoid using graphics as the sole means of presenting key information. For example, an image labeled “Contact Guide” may not clearly communicate the intent of a “Contact Us” section. Reviewing and updating these elements will improve both accessibility and clarity.
Headings and Structure
It is recommended to review the heading structure as the current nesting order is inconsistent, with some levels skipped. This may have occurred while trying to match the page's aesthetic or include too much content. To enhance accessibility and readability, adjusting the headings to follow a logical hierarchy is essential.
Contrast and text size
During my initial check for sufficient color contrast on the site, I noticed that the green background and white text result in "very low contrast," which may impact readability.
I recommended that the site allow users to resize text up to 200% without losing content or functionality. This is essential for users with low vision, like myself, and also benefits those with cognitive disabilities who need larger text for better comprehension.
Operable Interface
Keyboard Accessibility
While verifying that all interactive elements are keyboard accessible, I found that some important elements, such as carousels or draggable content boxes, were not accessible via keyboard. This is not just vital for users with visual impairments but also for those with motor disabilities who cannot use a mouse.
​​Focus indicators
Focus indicators are essential for users who navigate by keyboard, as they show which element is currently active. I noticed that, in some cases, it is not clear which element is currently selected.
Understandable Information
Readable Text
The content is clear and concise, with an appropriate reading level. This not only supports users with visual impairments but also benefits those with cognitive and language-related disabilities. It is also worth noting that the website is accessible in Spanish, ensuring that a wider range of users can engage with the content.
Consistent navigation
Consistency in navigation is crucial for all users, particularly those with cognitive impairments, as it helps them better understand and interact with the website. Navigation and interface elements remain consistent across pages. Since WEST EJ is part of the University of Arizona and utilizes Drupal Quickstart to develop the site, this consistency is maintained throughout the university and the center.
While the forms have labels and clear instructions, I noticed that in the contact form, required fields are not marked—particularly for the email and phone number. This could create confusion for users who forget to fill them in and are left waiting for a response.
Input Assistance
Compatibility
The site works across various browsers and with assistive technologies. HTML is valid, and proper ARIA roles are used where needed to enhance accessibility. Implementing ARIA roles helps improve navigation for users with disabilities by providing assistive technologies with additional context and interaction cues, making the site more accessible to a wider audience.
Expertise
UI/UX, Web Design, Wireframing,
Branding, Design UI, Motion, Illustration, Product Design, Animation
Areas for Improvement
Improve performance by optimizing the website’s load times, ensuring a faster user experience, Properly size images, Reduce unused JavaScript​
Improve mobile responsiveness to ensure the site functions seamlessly on various screen sizes and devices.
Test with screen readers to ensure all content is read aloud correctly and intuitively, enhancing accessibility for visually impaired users.