Skip to content

VoiceOver: add accessibilityLabel to Posts Lists' add & view buttons#13038

Closed
vphong wants to merge 1 commit intowordpress-mobile:developfrom
vphong:issue/#12872
Closed

VoiceOver: add accessibilityLabel to Posts Lists' add & view buttons#13038
vphong wants to merge 1 commit intowordpress-mobile:developfrom
vphong:issue/#12872

Conversation

@vphong
Copy link
Copy Markdown
Contributor

@vphong vphong commented Dec 5, 2019

Fixes #12872 - preliminary version

To test: VoiceOver on physical device

PR submission checklist:

  • I have considered adding unit tests where possible.

  • I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

Copy link
Copy Markdown
Contributor

@shiki shiki left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @vphong! Thank you very much for this contribution!

I have a few suggestions and comments. Please let me know what you think. 🙂

}

func configureNavigationButtons() {
addButton.accessibilityLabel = "Add new post"
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think a better place for this would be the addButton's initializer in here:

@objc lazy var addButton: UIBarButtonItem = {
return UIBarButtonItem(image: Gridicon.iconOfType(.plus), style: .plain, target: self, action: #selector(handleAddButtonTapped))
}()

In this way, we can also fix the same problem in the Pages List.

The label can also just be “Add”. There is enough context on the page that the user should be able to figure out that “Add” means adding a new post or adding a new page. You can read more about this in the Guidelines for creating labels.

Lastly, strings should be localized. Using NSLocalizedString should be enough. The translation will be handled during the release process. Please feel free to poke around in the codebase for some examples. 🙂

  • Move to the addButton initializer
  • Use NSLocalizedString
  • Shorten to "Add"


func configureNavigationButtons() {
addButton.accessibilityLabel = "Add new post"
postsViewButtonItem.accessibilityLabel = isCompact ? "Switch to expanded list view" : "Switch to compact list view"
Copy link
Copy Markdown
Contributor

@shiki shiki Dec 6, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It looks like you only need to do this once in showCompactOrDefault() which is called on viewDidLoad and whenever isCompact value is changed. The less code, the better. What do you think? 🙂

As for the accessibilityLabel, this is a bit tricky because it's a toggle button. Changing the label can be confusing though. The user might think that it's a different button whenever it changes. My suggestion would be to have a static accessibilityLabel, “List style”, so the user will be able to identify that it's the same button. And then change the accessibilityValue.

Layout Style accessibilityLabel accessibilityValue
Expanded List style expanded
Compact List style compact

The label and the values will still be spoken by VoiceOver.

  • Move to showCompactOrDefault()
  • Use accessibilityValue

Copy link
Copy Markdown
Contributor Author

@vphong vphong Dec 8, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I did write that line twice, because I thought it was possible that the user might have left the app on a certain compact or expanded view, and they might want to return to their choice of view. So it calculates once on viewDidLoad and when the toggle is hit. Is this not necessary? Edit: alright I understand showCompactOrDefault() now, my bad! Will get to it

I'll work on the other changes as well!

@vphong vphong closed this Dec 9, 2019
@vphong vphong deleted the issue/#12872 branch December 9, 2019 00:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Posts List: list view and add buttons are read incorrectly with VoiceOver

2 participants