Accessible Signup Form

The design consists of two screens: a Sign In page and a Sign Up page. Both screens follow a clean, minimalistic layout with a focus on clarity and usability. The design elements and choices ensure compliance with WCAG (Web Content Accessibility Guidelines) to provide an inclusive experience for all users, including those with disabilities.

1. Clear Labels and Instructions

2. Consistent Navigation:

• Both pages offer consistent navigation options (“Or continue with” for social logins, links to switch between Sign In and Sign Up) which helps users understand and predict where to find information.

3. Contrast and Readability:

• The text and input fields have high contrast against the white background, meeting WCAG contrast requirements (minimum contrast ratio of 4.5:1 for normal text).

• The blue “Sign In” and “Sign Up” buttons stand out clearly against the white background, ensuring they are easily identifiable.

4. Error Prevention and Assistance:

• The password field includes criteria (“Minimum 8 characters”) to help users create valid passwords, reducing the likelihood of errors.

• The “Forgot password?” link provides a way to recover from potential user errors.

5. Alternative Authentication Methods:

• Providing options to sign in or sign up with Google, Facebook, or Apple accounts supports users who might have difficulty typing or remembering passwords, thus enhancing accessibility.

6. Clear Call-to-Action:

• The primary actions (“Sign In” and “Sign Up”) are clearly distinguished by their size, color, and placement, ensuring they are the focal points of the screen.