Accessible Signup Form - Explor'R
This is the Explor’R website application sign up page. It is accessible to everyone, especially to people with disabilities. There are several elements that make this form accessible:
Inputs have several states such as a default state, a focused state (to make the input accessible via a keyboard), a valid state and an error state. There are multiple cues regarding the error state, to ensure that the error is perceivable.
The form has a single-column layout to make it easier for users to navigate
Labels are kept outside of the input, and hints are placed inside to help users fill the form and ensure a better visibility.
All font sizes are 16px or more, and the contrast ratio is at least 4.5:1 to ensure visibility and legibility.
Reviews
2 reviews
Marion, fantastic job on completing the Design Brief! The earthy color palette you've chosen beautifully complements the adventure theme 🏕️
Here are a few thoughts to polish it further:
- Typically, users expect to see the email field before the password field. Adjusting the order to match common conventions could enhance user familiarity.
- The password requirement text forms a considerable block when placed directly under its label. Exploring alternative placements could help break up the text, improving readability.
- When incorporating social media logos, it’s crucial to refer to each platform's brand guidelines, usually available in their media kits. This ensures your design respects their branding expectations.
- Ensure the alignment of all signup elements & fields is consistent to maintain a cohesive and polished look.
Your work is on a great path—keep it up!👏
Great job on the sign-up page! Your attention to accessibility criteria is commendable, and I appreciate how you've ensured error and success indicators aren't solely reliant on color. The illustration adds a nice touch, and the intro copy effectively welcomes users to the platform.
One area for improvement is the length of the error message. Shortening it and removing unnecessary words like "please" can make it more concise without sacrificing politeness. Simplifying terms like "email address" to just "email" and using abbreviations like "e.g." instead of "such as" can also streamline the message.
Additionally, consider using a different color for "Already have an account? Log in" to make it more visually distinct. Keep up the good work!
You might also like

HR Management App

From Idea to Full-Stack Web App

Docto

Fundraising Website

Hulu Through My Eyes - A Cinematic UI Exploration (unofficial)
