#Accessibility

User Experience (UX) is much more than only the visual part. It for sure have to include good accessibility so all people can use our applications, services and solutions.

You have to:

• test keyboard navigation during development
• test with screen readers during development
• test with 200% in font-size during development

You may read more about these targets.

#Tools

Eufemia includes a range of tools to help you make better accessible applications:

• Focus Management
• Accessibility Checklist
• Skip Link
• Semantics example

#Components

• NumberFormat makes numbers accessible for screen readers.
• Heading handles heading leveling automatically.
• GlobalStatus includes grouping of form status messages and live announcements for screen readers.
• FieldBlock handles <fieldset> and <legend>.
• VisuallyHidden hides text visually, while makes it available for screen readers. Its based on the helper HTML class dnb-sr-only.
• SkipContent similar to a skip link. It allows a user, while tabbing, to skip large parts of content, to reach quickly a save button etc.
• AriaLive is a component that makes it easy to announce messages to screen readers.

All form components includes a label property to bind automatically the FormLabel to the components (HTML element).

<Input label="Input label:" />

And all form components includes the FormStatus component which is coupled to the component by using aria-describedby.

<Input status="Status message:" />

#200% you said?