What does Solo do to make your sites more accessible?

At Solo, we automatically implement several accessibility features to make your websites more accessible and improve the overall user experience for everyone. This includes the following:

Semantic HTML Structure

This helps screen readers navigate and understand your content structure:

• We use semantic HTML headings (h1, h2, h3, etc.) to create a clear content structure
• Your main website title automatically becomes an h1 heading
• Section titles use appropriate heading levels to maintain the content hierarchy

Language Support

This helps screen readers use the correct pronunciation and language rules:

• We automatically set the language attribute (lang="en") on your website - unless you select a different language in onboarding or via Settings.

Form Accessibility

Accessible Contact Forms

This informs screen readers on how they communicate the emphasized information:

• All form fields have proper labels associated with them using the htmlFor attribute
• Form validation includes clear error messages with role="alert"
• Success messages also use role="alert" to announce form submission results
• Required fields are clearly marked with asterisks

Newsletter Signup Forms

• Email input fields have proper labels and validation
• Form submission feedback is announced to screen readers as we use role="alert"

Text Color Accessibility

Theme colors are chosen to meet WCAG 2.2 minimum contrast ratio (Level AA). This means that normal text (below 18pt or, below or 14pt bold has a contrast ratio of at least 4.5:1, and larger text has a contrast ratio of at least 3:1.

Image Accessibility

This helps screen readers describe images to visually impaired users:

• Unsplash stock images automatically include alt text. If you upload a custom image that already has an alt text, screen readers can use that too.
• Logo images include the descriptive word "logo" as the alt text
• Images load with lazy loading to improve performance

Navigation and Interaction

Clear Button Labels

• All buttons have clear, descriptive text
• Interactive elements provide clear feedback when activated

Focus Management

• Smooth scrolling and browser focus handling
• Animation triggers respect user preferences for reduced motion which is handled by your operating system (e.g. Windows, MacOS…
• Loading states and transitions provide clear feedback

Development and Quality Assurance

Accessibility Linting

This catches common accessibility issues before they reach your live website:

• We use ESLint with the jsx-a11y plugin during development
• Automated checking for proper ARIA attributes and semantic HTML

Additional Accessibility Features

Cookie Banners

• Cookie consent banners follow accessibility best practices
• Clear accept/reject options with suggested button labeling that users can further edit

Social Media Links

• Social media icons include proper labels
• Links open appropriately and provide context about their destination

While Solo automatically implements these accessibility features, you can further audit and improve your website's accessibility by using the WAVE Web Accessibility Tool.