Sister Cities International

Redesign for Accessibility

Overview

This project aims to identify and address accessibility issues on the NGO’s website, delivering an improved, more accessible homepage. The strategy involves revisiting the homepage. The main focus will be on ensuring the visibility of the donation call to action while adhering to accessibility guidelines.

Current homepage with accessibility issues.

Accessibility Findings

  1. The contrast between text and background in the main call to action buttons is insufficient. There is also a lack of consistency among the various buttons throughout the website.

  2. The hierarchy of headings across the website appears inconsistent, with larger headings appearing lower on the page hierarchy than smaller ones.

  3. Inconsistently applied underlines to non link text elements create confusion , detracting from the overall usability and clarity of the website.

  4. The absence of breadcrumbs to indicate the current page hierarchy makes it challenging for users to navigate and orient within the website's structure.

  5. Many pages suffer from an overload of headings with varying font sizes, colors, and formatting styles.

My Take

To give the user an immediate idea of what the website is about, I put the Mission as very first thing on top of the page. The hierarchy of headings has been adjusted consecutively to ensure readability.

Also main navigation bar has been simplified and made it easier to understand, without letting the user guess.

Color contrast has been improved and buttons now have a larger interaction area.

The overall look of the homepage feels lighter and each heading represents an important piece of information immediately recognizable even for a first-time user.