w3c / secure-payment-confirmation

Secure Payment Confirmation (SPC)
https://w3c.github.io/secure-payment-confirmation/
Other
110 stars 39 forks source link

Accessible icon information #127

Closed ianbjacobs closed 2 years ago

ianbjacobs commented 3 years ago

For users with some visual disabilities, the icon may not be accessible. Would it make sense to support an "alt" string as input (e.g., that the browser can make available in the UX or to assistive technologies)?

rsolomakhin commented 3 years ago

I would consider the instrument display name to be this alt text.

ianbjacobs commented 3 years ago

The instrument string does not convey the same information. A card number does not tell you the issuing institution (for example).

rsolomakhin commented 3 years ago

An alt text for the screen reader could make sense if the icon's intention is to convey entirely different information from its display name.

RealJoshue108 commented 2 years ago

The correct use of @alt is largely dependent on context. How you assess what is appropriate comes down to simply reflecting on if any suggested alt text will support a user who is not sighted and will access this information via AT? Or perhaps it is something where a null alt value will suffice, the icon can be ignored as there is no net benefit for providing the string in the first place.

If the icon information isn't critical this could work. If the icon, is also functional or interactive, then you should describe the function, and not what it looks like etc.

ianbjacobs commented 2 years ago

@RealJoshue108,

My expectation is that the icon will tell the user about the issuer of the payment instrument, for example "Mastercard" or "Barclays". Thus, the alt text might be read as "Mastercard ***1234".

RealJoshue108 commented 2 years ago

Sounds good and useful - @ianbjacobs also important that focus is managed as needed so the user gets this, as and when they need it. Just because there is a11y info on the page, you can't make the assumption that the screen reader user will see. So there may be a broader discoverability issue.

stephenmcgruer commented 2 years ago

Please note that the UX in Chrome currently looks like this:

image

The fact that the text Mastercard ***1234 (or whatever display name that the bank has given the credit card) already appears is why Rouslan is arguing that the display name is the alt text.

I can definitely see an argument for 'the bank may wish to provide different information from the icon versus the display name', but I want us to be clear about the text that is already available to the web developer calling SPC before we go adding more :)

RealJoshue108 commented 2 years ago

@stephenmcgruer There is a logic to that.

stephenmcgruer commented 2 years ago

I would love to hear from e.g. @jcemer-stripe , @davordavidovic, or other users of SPC on whether having alt-text for the icon would provide additional explanation value on top of the displayName, or whether its just visual 'eye-candy'.

For example, if most displayNames are NetworkName ****1234 anyway, and the alt text for the icon would also be e.g. NetworkName icon, then to me not much value is added. On the other hand, if displayNames are often something like Stephen's card ****1234 then the icon is distinct and an alt-text makes a lot of sense.

jcemer-stripe commented 2 years ago

In the context of card payment, the icon is used more as a 'eye-candy'. I don't see much value of adding an alt-text for cards but it could be a nice touch for other use cases.

rsolomakhin commented 2 years ago

eye-candy

Do you mean to say that it's not important for accessibility / for understanding the context of the payment?

jcemer-stripe commented 2 years ago

eye-candy

Do you mean to say that it's not important for accessibility / for understanding the context of the payment?

I cannot make that strong statement but I think that for card payments the icon is pretty much the card brand which is in general already present in the display name.

ianbjacobs commented 2 years ago

Are there use cases where one might do something like this:

[Bank icon] Mastercard *****1234

That seems to be the main potential use case.

ianbjacobs commented 2 years ago

@RealJoshue108, please see pull request #162, which recommends using the displayName to ensure the accessibility of the icon (rather than adding another alt value). According to comments above, the displayName sounds like it will suffice (or can be made to do so). thanks!

michael-n-cooper commented 2 years ago

APA is ok with how this issue was handled. Thx!

ianbjacobs commented 2 years ago

Thank you @michael-n-cooper!