New answers tagged html5
Getting some hard data on how people interact with placeholders As there doesn't seem to be any good data on how people interact with placeholders, I decided to get some myself. I created a little solution that looks a like like this jsFiddle and sought out some victims, er "volunteers" to try it out. The test The test users were presented with a ...
Placeholder Accessibility Having read the article you referenced, Placeholders in Form Fields Are Harmful, while placeholders may not be actively harmful, they're at least not as useful as you think. And if it's not helpful, why do it? From an accessiblity (and an "avoiding litigation") standpoint, placeholders are often omitted by screen readers: W3.org ...
If its acting as a value then why not have it as a value? The placeholder text should be used to hint at the type of entry that is required. In your particular scenario I would either set the value attribute to Any instead of the placeholder attribute. Then if the user wants to change the value they can, else they leave it as Any and tap Select. Better ...
Straight away I assumed Any wasn't a value I could leave there, however the form was insisting I enter Any value. Slightly misleading in my opinion. How about using a select, or a filtering select for these values and having Any as the default value instead? I understand there are many breeds of dogs, however - so this may not work too well either. ...
You and Google material design have already described a good solution to your problem. The method applies well to both text areas and text input fields, so don't hesitate to use this approach. See the image below:
My bank has a strict 5-digit pincode policy and the input looks like as many underscores as there are characters allowed. It's very minimalist, yet you quickly get that each corresponds to a character. Here's an approximate rendering of it: A B C _ _ _ _ _
In my opinion, you could use "helper text" inside your input, which describes number of characters. In my example i use "abc" text as help. One letter typed by the user replaces one letter of the helper text.
Top 50 recent answers are included