Today I learned that HTML <abbr> may not do much on mobile browsers

June 22, 2020

For some time, I've been using HTML <abbr> elements with title attributes in my writing here on Wandering Thoughts. Sometimes I use it purely to provide a friendly expansion of abbreviations, like a TLS CA or MITM; sometimes the expansion acquires some additional commentary, such as the mention of <abbr> itself in this entry, and sometimes I use it for little asides. In a couple of contexts I use it to provide additional information; for example, any of my comments here (currently) say that they are 'by cks', where the <abbr> is used to add my name.

Today I had a reason to look at some of my pages that are using <abbr> in a mobile browser, specifically the iOS mobile browser. That was when I learned that iOS Safari doesn't render <abbr> in any visible way, which is fairly reasonable because there's no real way to interact with it; on desktops, an <abbr>'s title is shown when you hover the mouse over it, but on mobile there's no hover. This is a bit surprising because both MDN's <abbr> page and CanIUse currently say that it's fully supported on mobile browsers.

Once I started doing Internet searches it appears that this is a long standing issue and unlikely to change (because of the hover problem). There are various workarounds with both CSS and JavaScript, but I'm not certain I like any of them, especially with how I've historically used <abbr> here; some of my <abbr> usage would look very out of place if displayed inline in some way. Given that a decent amount of browsing comes from mobile these days, this is likely going to cause me to rethink how I use <abbr> here on Wandering Thoughts and likely use it a lot less, if at all. Probably a lot more terms will wind up as actual links to explanations of them, which is not necessarily a bad change overall.

This is a useful lesson to me that the web, and especially the mobile web, is an ongoing learning experience. Things that I think I know should be tested every so often, and I should look at my own sites in a mobile browser more often.

(As part of this, I should find out if there's a not too annoying and difficult way to look at and interact with my sites from an Android browser, despite not having any Android devices myself.)

Written on 22 June 2020.
« In Go, the compiler needs to know the types of things when copying values
Sometimes it takes other people to show you some of your site's design flaws »

Page tools: View Source, Add Comment.
Login: Password:
Atom Syndication: Recent Comments.

Last modified: Mon Jun 22 23:16:50 2020
This dinky wiki is brought to you by the Insane Hackers Guild, Python sub-branch.