-
Notifications
You must be signed in to change notification settings - Fork 535
Use of the <i> element in the wild #732
Comments
Hmm. In my anecdotal experience I generally come across it being used as described. We probably need more data to make a rational decision here... |
did a quick grep of the latest webdev data dump (from january this year. |
Bootstrap now uses FontAwesome uses |
Some back/packet analysis of the data @stevefaulkner grabbed... There are 16,878 instances of the 8,198 instances use class names that include sprite", "icon", "ico", "glyph", "glyphicon", "fa-", ss-", fp-" or variations on those themes, or are entirely empty. That number is likely to be on the conservative side because the search did not include |
OK, so the usage is common. Some of it might be treating stuff as a I think that using icons or emoji fits into the "in a different voice or mood" idea. This ignores the technical grammar meaning of those terms, but it seems the text itself uses them in their common meaning rather than as terms of art for grammar. Which is itself unfortunate. The element is not used for e.g. text in the imperative or passive voice, nor in the subjunctive mood. Do you have a proposal? |
@MichielBijl FontAwesome in its examples page and single icon page also recommends that |
In the broader lifespan of the element, the usage of Using it for emoji fits with the longer-term usage to enclose an alternative language - the same emoji used across sites is identifiably the same thing, even if the combination and context changes. I don't think general iconography fits the usage though. While the glyphs of popular icon libraries are re-used a lot, they are not used by authors according to a shared lexicon nor are they synced in a reliable manner between different libraries. Some glyphs have strong consensus, but others vary wildly. |
I agree with @cheshrkat here, the trend was due to library usage and not due to a majority of developers making an informed choice on which element to use. Twitter Bootstrap was the main culprit, but they have since moved to using I also think that using |
I agree with @chaals (#732 (comment)) that inline icons and emoji fit with the "separate voice or mood" semantic. If I was reading aloud a text that included an emoji, I would pause and emphasize it to indicate that I've switched from reading words to describing an icon. I think that is consistent with the way I would read italic text used to set off a foreign language phrase, or a term being used as a term, or poetic allusions, or all the other uses of Now, if an icon is completely stand-alone (not part of a sentence), then it would be better to properly mark it up as an image. But if the image is created via text content or background images, the relevant markup is Regardless: if marking up inline icons is an established use of the |
If the font libraries that are primarily responsible for this are moving away from using |
Keep as is |
Leave definition as is. Misuse of The common rationalisation I see most often about why people/libraries use |
I wonder if there is any possibility to gather the stats of usage of |
@patrickhlauke opined:
I agree that span is marginally better. I would also agree that we should consider a change, if the usage was egregious. But to be honest, I think it's probably not perfect, but good enough with what we have, and I really don't see the need for a change to the spec. |
Unless user-agents (primarily screenreaders) consistently voiced |
Apart from |
@SelenIT has a point. In the data analysis mentioned previously, a chunk of the instances of |
I'd say it's not that they're "thinking" that, they're just post-rationalising it. people also "think" that |
Most are not thinking about semantics, accessibility etc at all. They are using the library because it solves a problem. And that would happen if some of these libraries suddenly changed their mind and used |
IMO, |
I don't agree that In terms of semantics, the two examples given (bootstrap and font awesome) both go into some detail about how the accessibility of icons should be handled. The solutions relate to ARIA attributes, alternative text and how CSS-generated content is announced. I didn't see any reference to the actual element providing meaning (naturally I could have missed something). The point is I don't think they strongly support a need to alter the HTML spec. Another thing to consider here is if we ARE trying to follow the trends in libraries, I've seen a lot of people pushing to use SVG instead of span+font now that support is improving... which would bypass this situation entirely. |
In my opinion, the anyway...
if we were to change 'a span of text' to content and 'a different quality of text' to a different quality of content, then it would be fitting to do the following as an example:
It should be noted that while the current definition appears to confine the content to text: its content model allows any of the following:
|
Leave it as it. |
In that case, allowing Also, since icons are graphical, how can an alternative for them be provided for in the same way that As for the reason "because it's shorter" from some people, often the very same people use BEM, and end up with multiple, long class names making the excuse moot. I strongly think we should leave it as it is. |
Some assumptions are being made that anyone who uses Leave as is. No change to definition needed. The current definition can be argued to already fit better than the arguments that As for the accessibility Ian mentions, off-screen / visually hidden text already provides that text equivalent (when included, like an |
Icon usually is a decorative graphic and semantically neutral element (without implicit native role) like
|
Closing with consensus that the definition can be left "as is". |
"The
<i>
element represents a span of text in an alternate voice or mood, or otherwise offset from the normal prose in a manner indicating a different quality of text, such as a taxonomic designation, a technical term, an idiomatic phrase from another language, transliteration, a thought, or a ship name in Western texts."In reality the
<i>
element most often seems to be used to represent icons or emojis, which does not seem to fall strictly into this definition. Can we update this definition to reflect reality better?The text was updated successfully, but these errors were encountered: