iOS: Provide visible labels or instructions for all input controls

Description

Location: iOS Native app: Registration page

Severity: 8

Description: The form fields on the Register page do not have on-screen labels. Placeholder text is used as on-screen labels. When users start writing, the placeholder text disappears. People with cognitive disabilities will benefit from on-screen labels to enter the proper input.

Pattern: None

Auditor Note: Developers must provide an on-screen label that remains when entering information. Do not rely on placeholder text as visual label for form fields.

Internal Note: Yup. See how we do it on the desktop version of the site. Can we use a webview here, too?

Steps to Reproduce

None

Current Behavior

None

Expected Behavior

None

Reason for Variance

None

Release Notes

None

User Impact Summary

None

Activity

Show:
Saeed Bashir
November 17, 2017, 9:26 AM

Got your point. Thanks for the clarification.

We have different options to achieve the desired results:

  1. The label can be added to the left of text field (Quickest and easy solution)

  2. The label can be added above the text field. We may come up with an idea to combine information label and new named label (Quickest and easy solution)

  3. We can write a control just like android material design text field (Complex and time consuming).

Please let me know which sounds more appropriate to you?

Albert (AJ) St. Aubin
November 20, 2017, 4:00 PM

What do you think of the implementation questions above?

I vote 1 or 2 whichever looks best in the UI.

Saeed Bashir
November 22, 2017, 11:24 AM

I decided to go with option two because we do have almost the same design on the web.

I need your input on either we add a placeholder to text fields or not. Here are the visuals with and without placeholders

Albert (AJ) St. Aubin
November 22, 2017, 1:07 PM

Please remove the placeholder text. It is redundant at this point.

Albert (AJ) St. Aubin
November 22, 2017, 1:08 PM

I am happy with the decision to go with option 2, I think it looks clean on the small mobile scree.

Assignee

Saeed Bashir

Reporter

Mark Sadecki

Reach

None

Impact

None

Platform Area

None

Customer

None

Partner Manager

None

URL

None

Contributor Name

None

Groups with Read-Only Access

None

Actual Points

None

Category of Work

None

Platform Map Area (Levels 1 & 2)

None

Platform Map Area (Levels 3 & 4)

None

Story Points

2

Epic Link

Sprint

None

Due date

2014/04/15

Priority

CAT-2
Configure