DEV Community

Cover image for Designing Accessible Error Messages in Fintech Apps: Make Failures Easier to Fix
Strikeloan
Strikeloan

Posted on

Designing Accessible Error Messages in Fintech Apps: Make Failures Easier to Fix

AI disclosure: This article was prepared with AI assistance. The author should review the technical recommendations and examples before publication.

Errors are unavoidable in financial applications. A payment can fail, a session can expire, a form can contain invalid information, or an external service can become temporarily unavailable.

The problem is not simply that an error occurs. It is whether the application helps the user understand what happened and what to do next.

In fintech, confusing error messages can lead to repeated submissions, unnecessary support requests, and uncertainty about whether a financial action succeeded. Designing better error states is therefore both a usability concern and a reliability concern.

1. Describe the Problem in Plain Language

Consider two messages:

  • Error 422: Unprocessable Entity
  • We couldn't submit your request. Check the highlighted fields and try again.

The first may be useful to a developer reading logs. The second gives a user a clearer next step.

A useful error message should answer three questions:

  1. What happened?
  2. What can the user do now?
  3. Is there anything they should avoid doing?

Avoid exposing internal exception names, database details, stack traces, or sensitive system information in the user interface. Keep technical diagnostics in appropriately protected logs.

2. Distinguish Validation Errors From System Failures

Not all errors should be handled in the same way.

Validation errors

These occur when submitted data does not meet a requirement.

Example:

Enter a valid date of birth.

The interface should identify the relevant field, explain the requirement, and preserve other valid input where practical.

Authentication or session errors

These occur when a user needs to authenticate again or their session is no longer valid.

Example:

Your session has expired. Sign in again to continue.

Do not silently discard work without warning when it can reasonably be preserved.

Temporary service failures

These may result from network interruptions, timeouts, or unavailable dependencies.

Example:

We couldn't retrieve your information right now. Please try again shortly.

Only offer a retry when retrying is safe for that operation.

Unknown outcomes

Some operations may time out after the server has already processed the request. A timeout does not necessarily mean the operation failed.

For a payment or another consequential financial action, avoid telling the user to submit it again until the system has checked the operation's status.

3. Treat Unknown Outcomes as a Separate State

One common design mistake is representing every failed HTTP request as a failed business operation.

Imagine a client sends a payment request. The server processes the payment, but the response is lost because the connection drops. From the client's perspective, the request timed out. From the server's perspective, the payment may have succeeded.

The client should not assume either outcome without further evidence.

A safer flow is:

  1. Create a unique operation identifier.
  2. Submit the request using an idempotency mechanism where supported.
  3. If the response is lost, query the operation's status.
  4. Show the confirmed result when available.
  5. If the status remains unknown, explain that clearly and avoid encouraging a duplicate action.

For example:

We haven't confirmed the status of your request yet. Check its status before attempting the action again.

The exact wording depends on the system's capabilities. Never claim that an operation is being checked or can be safely retried unless the backend supports that behaviour.

4. Make Errors Accessible

Error handling must work for users who navigate with a keyboard, use screen readers, or need additional visual clarity.

Useful practices include:

  • Associate field-level errors with their corresponding inputs.
  • Move keyboard focus appropriately when submission fails.
  • Announce important dynamic messages to assistive technology.
  • Use text and meaningful labels rather than colour alone.
  • Ensure error text has sufficient contrast.
  • Avoid clearing a form when one field fails validation.
  • Provide an understandable path to correct the problem.

For dynamic errors, appropriate ARIA attributes such as aria-describedby can associate a message with a form field. An aria-live region may help announce certain asynchronous updates, but it should be used carefully to avoid overwhelming screen-reader users.

Accessibility behaviour should be tested with actual assistive technologies, not inferred from the visual design alone.

5. Separate User Messages From Diagnostic Logs

The message displayed to a customer and the information captured for debugging have different purposes.

A user-facing message should be concise, actionable, and free from unnecessary technical details.

A diagnostic event may need fields such as:

  • A correlation or trace identifier
  • The operation type
  • A normalized error category
  • The relevant service or dependency
  • The time of the failure
  • A redacted status or response category

Avoid logging passwords, authentication tokens, full payment credentials, or unnecessary personal and financial data. Apply access controls and retention policies to diagnostic information.

A support reference can help connect a user report with a protected diagnostic event without exposing internal details to the user.

6. Test Error States as Deliberately as Success States

A form that works on the happy path may still fail users when something goes wrong.

A practical test matrix should include:

Scenario Expected behaviour
Required field is empty Identify the field and explain how to correct it
Input has an invalid format Preserve valid data and show a useful message
Session expires Explain the next step and preserve work where appropriate
Request times out Avoid assuming the business operation failed
Dependency is unavailable Show a truthful temporary-failure message
Operation status is unknown Avoid encouraging unsafe duplicate actions
Screen reader is in use Make errors discoverable and understandable
Retry is attempted Verify that duplicate operations are prevented where required

Tests should verify not only the text displayed but also focus behaviour, screen-reader announcements, state transitions, and backend operation status.

7. Measure Whether Error Handling Actually Helps

Counting errors is not enough. A high error rate might indicate a confusing interface, a failing dependency, or a legitimate security control.

Consider measuring:

  • The percentage of users who successfully recover from an error
  • Repeated submissions after timeouts
  • Abandoned workflows after validation failures
  • Support requests associated with unclear messages
  • Accessibility defects discovered during testing
  • Time taken to resolve common failure scenarios

Interpret these metrics alongside system logs and user feedback. Do not optimize for fewer displayed errors by hiding failures or making error messages less visible.

Conclusion

Good error handling is not just a final message shown when something breaks. It is a deliberate design for helping users understand the state of an operation and choose a safe next step.

In financial applications, the most important distinction may be between an operation that definitely failed and one whose outcome is not yet known. Clear language, accessible interfaces, privacy-conscious logging, and carefully tested recovery paths can make that distinction easier to understand.

The goal is not to promise that failures will never happen. It is to ensure that when they do, users are not left guessing—and the system does not make a difficult situation worse.

Top comments (0)