instead of worrying about the arty farty colour of the “placeholder attribute”,
you should focus your attention, instead, on accessibility considerations.
Don’t comma separate prefixed styles because when a browser encounters a rule it doesn’t understand it should stop and go to the next rule block and ignore the current rule completely. It does not go to the next comma separated item.
“Don’t Use The Placeholder Attribute” just recently came out, which is good that you mentioned it. Unfortunately, it wasn’t my call to use placeholders. I prefer labels, and I know that there’s a way to use the labels as ‘placeholders’. The client wanted a quick turnaround, though.
I think placeholders can have some usefulness. I would not use them to replace a label, but I think they can be a help when a specific format is wanted for a text input.
In my mind that would be exactly the time that you should not use placeholders.:).
If the input requires a specific format then I want that to be present while I type because as soon as you start typing and the placeholder disappears I wont remember whether it was dashes or slashes as separators or whether the year was 4 digits or two. I’d need to delete the current input and double check what was needed and then type again. I’ve actually done that a number of times for real and its a real nuisance.
Without wishing to derail the thread into a placeholder discussion the only useful purpose I can think of for a placeholder is to say something like ‘type here’ (assuming you have a proper label in place).
I’ve always thought that having a hint field that disappears as you type is of no use to anyone especially if autofill has filled all the fields for you but not with the correct information.
If the form needs a hint then it needs a hint that is always visible and that’s not the case for placeholder. When reviewing a form I want to know all fields are correct before posting and I can’t do that if placeholders have been used which show the format required.
The article I linked to above explains all these scenarios and taking into account all the things that can go wrong I now have to agree with the author. I used to think placeholders were ok as long as you had a label but now I’d rather not use them. I can see a small case where they add extra information over and above what was needed to complete the task but in cases of specific format and what type of data is required then I think that needs to be in the html (not necessarily in the label as such because labels should be more succinct).
Yes I think we can make life easier if we idiot proof some of the data input.
I suppose there’s a thin line between going overboard and making it too verbose as some users may get annoyed at jumping through too many hoops. It’s a bit of a conundrum and as yet I don’t think there’s a perfect answer other than trying to keep it simple.
The floating label won’t make users enjoy using forms.
Users don’t care.
They just want the outcome.
Since the floating label doesn’t save any vertical space,
and other types of fields such as radio buttons and the
select element need a label anyway, why not just show
the label in the first place?
Do not let arty farty nonsense distract you from sensible
coding methods.
