RE: SC_1.4.12: Text Spacing_Scenario based doubt

The text is able to wrap because it is in a <label> element. My view is that it is not a violation of 1.4.12 in this case because the label is still readable. In other cases it might be a violation if the text does not have sufficient contrast against the background colour outside the textbox.

There is also the question of whether the textbox border overlaying the text makes it unreadable. This is a subjective judgement, but WCAG provides no guidance on the matter. It largely depends on the border thickness and effects such as a drop shadow. In your case I would say the label is still readable.

Placeholder text cannot wrap, but you wouldn’t usually use a placeholder with a floating label design. If you do use a placeholder and it becomes too long, it will be truncated visually rather than wrapping. This may be a violation if the placeholder text is important, but it is usually just helpful rather than essential.

The text that the user enters may also be truncated visually if it becomes too long, but they can use the arrow keys to bring the hidden text into view, so this would not be a non-conformance.

Of course the simplest solution is to make the textboxes a little longer so the wrapping doesn’t occur.

Steve Green
Managing Director
Test Partners Ltd


From: Ragupathy Ramasamy <meragu87@gmail.com>
Sent: 23 February 2021 07:11
To: w3c-wai-ig@w3.org
Subject: SC_1.4.12: Text Spacing_Scenario based doubt

Hello w3 Team,

Hope you're doing good and safe.

Coming to the question directly,
After applying text spacing using the paciellogroup text spacing bookmarklet on the webpage, the text spacing got applied on the page perfectly.
The actual issue we have faced is, after applying the text spacing the text present in the edit field, the "UAT13 & Optional" word got a wrap and overlapped on the edit field border.
please refer below screenshots

[cid:image005.png@01D709B7.B7590A50]
[cid:image006.png@01D709B7.B7590A50]

1. Is this violation? and failing under 1.4.12 Text spacing?
2. If it is a violation the same will be applicable for the placeholder text as well?
FYI, floating labels used for edit fields and edit field size designed as per requirement.

I have provided the link below for the bookmarklet.
https://developer.paciellogroup.com/blog/2018/05/short-note-on-getting-spaced-out-with-sc-1-4-12-text-spacing/

Please suggest to me some of the text spacing bookmarklets or plug-ins.

Your support on this is highly appreciated and helps me to understand the SC better.

Thanks in advance

Regards,
Ragupathy

Received on Tuesday, 23 February 2021 07:44:47 UTC