As part of my graduate coursework at UT Austin (INF 385T: Accessible User Experience), I conducted an 🧑‍🦯♿️🦻accessibility evaluation of the SHEIN online shopping website. The goal was to assess how well the site conforms to WCAG 2.2 (Level A & AA) standards and identify improvements that could enhance inclusivity for diverse users.

Timeline

October–November 2024

Standards

WCAG 2.2 A & AA criteria

Methods

Combination of automated tools (WAVE, ANDI) and manual inspection

With

Advisor: John Neumann, PhD

Background

background
Why does this matter?

SHEIN is one of the world’s largest fast-fashion e-commerce platforms, serving millions of users across different countries. Its website provides affordable, trendy fashion and lifestyle products to a global audience. With such a broad and diverse user base, ensuring accessibility is critical. Despite its popularity and global reach, the SHEIN website shows significant accessibility gaps. These gaps create barriers for users who rely on assistive technologies or alternative interaction methods, such as:

Visual Barriers

Low contrast text and missing alt-texts make it difficult for screen reader users or people with low vision to navigate.

Interaction Barriers

Inconsistent keyboard navigation and lack of focus indicators hinder users who cannot use a mouse.

Information Barriers

Auto-advancing carousels and unclear page structures make it harder for users with cognitive or attention-related disabilities to stay oriented.

Review Scope

homepage screenshot

01. Homepage

02. Product Details Page

product page screenshot
checkout page screenshot

03. Check-out Page

Key Findings

12

Passed

15

Failed

3

Cannot Tell

2

Not Presented

Major Accessibility Failures
evaluation results
The SHEIN website does not meet WCAG 2.2 Level A & AA requirements

Low Contrast
Text and button labels often fall below the 4.5:1 ratio.
Example: Product details hard to read on light background.

Missing Alt-text
Product and checkout images lack descriptive alt attributes.
This blocks screen reader users from understanding content.

Keyboard Navigation Issues
Focus indicators are missing or unclear.
Navigation order is inconsistent, causing confusion for non-mouse users.

Uncontrollable Carousels
Auto-advancing banners cannot be paused/stopped.
Difficult for users with cognitive or motor impairments.

evaluation results
Positive Accessibility Features

Predictable page behavior
Pages operate in consistent and expected ways.

Input assistance on forms
Checkout detects errors and provides correction hints.

positive accessibility features

Recommendations

🖼 Add alt-text

Ensure all images include meaningful alt-text for screen readers.

🎨 Improve color contrast

Adjust text and UI element contrast to meet WCAG 2.2 AA standards.

🎥 Add captions

Add captions to all pre-recorded videos for better media accessibility.

⌨️ Visible focus indicators

Make focus indicators visible and optimize navigation order.

📑 Clear heading hierarchy

Use headings and titles consistently to improve information hierarchy.

⏸ Pause carousel option

Allow users to pause, stop, or restart auto-advancing carousels.

🔔 Enhance status messaging

Use clear and accessible alerts (e.g., toast notifications) to keep users informed.

Reflection & Key Takeaways

This evaluation deepened my understanding of accessibility challenges in large-scale e-commerce platforms. It highlighted how small design changes, like improving contrast or adding alt-text, can significantly improve inclusivity.

As a Product Designer, I view accessibility not only as compliance but as a core part of creating equitable user experiences.

View Full Report →