Brief Description of Project: 

The health and skincare websites encompass online platforms that provide a variety of services. Healthcare services include medical information, telemedicine, online pharmacy, health products, and resources — in skincare, the platform offers beauty products, skincare advice, online dermatological consultations, reviews, and education. These websites allow users to manage their health and skincare needs in a convenient and informative manner.       
 

Sector : Internal Communication  

Refers to the department within an organization dedicated to providing services related to the sale of healthcare and skincare products, as well as Medicare services.

Problem Statement:  

The health and skincare websites faced accessibility challenges, hindering users with disabilities from accessing vital healthcare resources. Common issues included:

• Inflexible Content: page content couldn't be resized or reflowed. 
• Incomplete Image Descriptions: Images lacked descriptions, making it difficult for screen readers to explain them to users. 
• Confusing Navigation: The website had trouble guiding users through its content and focusing on the right elements.
• Lack of Keyboard Accessibility for Menus: Keyboard users couldn't access all the menu options, causing navigation problems. 
• Insufficient color contrast: Some parts of the website were hard to see because of low color contrast. 
• Missing Labels: Buttons and links didn't have clear labels, making it unclear what they were for.

All these problems combined create barriers for individuals with disabilities, such as those with blindness, low vision, locomotor disability, and intellectual disability — preventing them from fully engaging with the Medicare platform.  
 

Solution Statement :

We have performed testing on health and skin care websites applications and reported over 100 accessibility violations resulting in a lower compliance score. Our development team fixed those issues, thereby ensuring an inclusive user experience for individuals with disabilities, including those with blindness, low vision, locomotor disability, and intellectual disability. 

Our actions included:

• Used responsive web design techniques, employing relative units like percentages and ems for sizing. CSS media queries can help adjust styles based on screen size, ensuring content adapts to various devices.
• Included descriptive and concise alternative text (ALT attributes) for all images. This enhances screen reader compatibility and provides context for users unable to view images.
• Provided properly structured HTML elements, ensuring a logical tab order was correct or not. Used ARIA landmarks and roles to define page sections clearly, enhancing navigation for keyboard and screen reader users.
• Implemented keyboard focus styles for submenu links and used ARIA attributes to indicate interactive elements. Ensuring submenu items are reachable and usable via keyboard commands.
• Increased color contrast ratios between text and background elements to meet WCAG standards. Tools like contrast checkers can identify color combinations that ensure readability for users with visual impairments.
• Provided explicit and concise labels for interactive elements. Used semantic HTML tags and ARIA labels when necessary. Clear labeling enhances the understanding of buttons and links for all users.

These enhancements have transformed the healthcare and skincare websites, creating a more inclusive and user-friendly online environment. By removing barriers, we have actively promoted engagement for individuals with disabilities, guaranteeing equal participation in our digital platform. These improvements have cultivated an accessible atmosphere, fostering a seamless and enriching experience for all users on our websites. 
 

Methods and Tools: