2

Almost every website, book, article, newspaper, etc... that contains copyrights, caveat, disclaimers, etc... displays it in small font text.

Now... I'm doing a research about Semantic Elements and Text Formatting in HTML5, and we know that we should use <strong></strong> instead of <b></b>, for example, if we're not just styling the content to display bold text, it's about how important is the text, because at the end of the day, HTML elements present the "data" that it includes, and if we just want to give the text an attention, we should avoid using <b></b> and use <span></span> and style it in CSS, because that's the usage of CSS - styling.

Since the <small> element is semantic, it leads us to the question:

Why the font of these information are displayed, usually, in small size?

I'm trying to understand why <small> is a semantic element.

5

HTML5 consists of structural and presentational elements. Structural elements give meaning to the contents (using semantics) but can also be used as containers for css and javascript (div, span). Pure presentational elements (b, i) are often avoided because css provides a better way to style elements. The <small> element is not intended to be presentational:

The small element represents side comments such as small print.
...
Small print typically features disclaimers, caveats, legal restrictions, or copyrights. Small print is also sometimes used for attribution, or for satisfying licensing requirements.

https://html.spec.whatwg.org/#the-small-element

But screen readers only read its contents and not what it is as there is no corresponding ARIA role defined. MDN states:

Although the <small> element, like the <b> and <i> elements, may be perceived to violate the principle of separation between structure and presentation, all three are valid in HTML5. Authors are encouraged to use their best judgement when determining whether to use or CSS.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/small

1
  • This is an excellent (and well documented) answer. I didn't know about your first link, so it really helps (I only knew the content of the second link). That being said, I think the use of the small element is negligible. I don't recall seeing the usage you or OP mentioned, usually it's a p element styled as small. Example: this page. However, I know of many examples where small is used under a CTA to explain something or for legal reasons, like "you won't be charged" or "0.99 the first month, then regular fees" or whatever
    – Devin
    Jun 8 at 19:02
3

Quite simply, because those elements are considered to be of secondary importance. The user is presumed to be interested in the content first and foremost, not the caveats.

The same logic in advertising predates the Internet. Consider commercials that have tiny text at the bottom reading "This is a dramatization" or sleep aid ads where the horrible side effects are read at twice the speed in a monotone voice at the end.

Cynically, you could say that we want to hide warnings. Or in good faith you could say that legally required text is boring to the user so we diminish it.

But the importance depends on the context. When you click on the actual terms & conditions page, or whatever it might be, you get it at full size.

1

Because the standard gave the element semantics that would retroactively justify this presentation.

Here’s a sad truth: <small> is not actually a semantic element, not really. It merely pretends to be one. When it was first standardised in HTML 3.2, the <small> tag was purely presentational: its definition stated simply ‘SMALL places text in a small font’. Back then, the separation of presentation and semantics wasn’t considered important.

The big push towards semantic markup started with HTML 4. The W3C released this standard in three versions: Frameset, Transitional and Strict, and it was intended that everyone would eventually move to the strict version, which removed most presentational elements. A couple presentational tags were, however, left in, like <b>, <i> and <small>, but it was intended that a future standard would replace them with purely semantic elements. And indeed XHTML2 did away with <b>, <i> and <small> completely. An intermediate standard, XHTML1, reformulated HTML 4 as an application of XML with no other changes.

This didn’t quite work out; adoption of the new standards was low. Web designers didn’t use XHTML for a number of reasons: it wasn’t supported very well by browsers, especially by the dominant Internet Explorer, which had no support for it at all. Another reason few people robust, which made them ill-suited to generating the much more strict XHTML, where any syntax error would prevent the page from rendering at all.

Browser makers didn’t much feel like implementing the XHTML standards either. Instead, they formed an organisation of their own, the WHATWG, and promoted an alternative standard, HTML 5, which embraced a philosophy of ‘backwards compatibility at all costs’. It defined the parsing of ill-formed markup based on reverse-engineering the behaviour of Internet Explorer and on de-facto usage. It also brought back presentational tags that W3C standards removed. To placate the proponents of semantic markup, the editors of the HTML5 standard redefined <b>, <i> and <small> to be ‘semantic’; but the semantics they came up with are so vague that all they are good for is justifying the tags’ historical presentation.

In the end, ‘semantic web’ largely died out in the 2010s. These days, web designers predominantly approach hypertext as a purely visual medium, with no attention paid to how the page is interpreted other than in a GUI browser with the website-provided style sheet. The semantics of individual tags became largely irrelevant.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.