[test6554]

We have <input> and <label for=""> elements, but what about <validation for="" condition="" message=""> elements?

Condition could be a wide range of possible built-in validation functions or a custom regex or js function.

Instead of adding all these validation attributes to <input> elements you could have zero or more <validation> elements, each with their own message.

The message could automatically appear when its conditions fail. Unless you call preventDefault() inside an "invalid" event handler. The invalid event could have a list of all "validations" for that element and you could check their status via js, disarm/ignore them individually, or get their messages etc.

[blacksmith_tb]

Don't we already have that basically, with HTML5 form validation[1]? Often just using the pattern attribute is enough to make sure you don't get a phone number in your email field etc.

1: https://developer.mozilla.org/en-US/docs/Learn_web_developme...

[extra88]

Yes, but it's user agent UI which is not really good in any of them.

Good error messaging is important and having styleable semantic elements would be helpful. It's tricky because you often need more than one error message per input, not just "required" but too big, too small, wrong format, etc.

[notpushkin]

Right. You can use browser validation and extract the error messages with JavaScript (to style them yourself, e.g. [1]), but there’s no solution without JS yet.

[1]: https://github.com/notpushkin/evilmartians-exercise-auth/blo...