Small tag for error messages

[aidamag]

I have seen that for error messages it should be used the small tag instead of the span tag that we are using.
Should we do the change from span to small?

Example:

<div class="form">
     <label for="username">Username</label>
     <input type="text" id="username" placeholder="Username" />
     <small>Error message</small>
</div>        

[aweell]

Hi @lisa159,

Can you provide examples from where you found this recommendation?

Using for error messages

It's weird because according to MDN documentation:

The <small> HTML element represents side-comments and small print, like copyright and legal text, independent of its styled presentation.

I went also through the HTML <small> specs section and nothing appears related to the use case is proposed in this discussion.

I usually don't take other design system implementations as a source of truth but it seems to be no consensus in what tag should be used in these cases (e.g. I have seen implemented as a <div>, <span> or <p>)

Other use cases

According to the references I previously included, I see a clear use case were where we should be using this tag thought:

• Footer's copyright element: we're currently using a <div> (BTW we still have 2020 as copyright year)

[aidamag]

I have learnt it from a master's subject, where it is used following an input component in a form. But reading the specs section maybe it is not very accurate to use it as an error.

About the footer, I agree that it is more suitable for the copyright (and creating right away an issue about that copyright year).