5

I saw another interesting example of an interactive/live UI element in browser tab bars recently, this time it is a %scrolled value for a page.

enter image description here

A very popular and common example I have seen previously was the number of unread emails displayed for mail applications running in a browser (e.g. Gmail).

enter image description here

Is there a term used for these type of UI elements specifically designed for the browser tab? The term favicon was used specifically for the browser tabs, so I wonder if the same applies to UI elements of this type.

1
  • 2
    Favicon is a shortened version of "Favourite Icon", originally used for the Favourites (bookmark) feature in Internet Explorer. It took many years after that use for tabs to become a thing but the popularity of the favicon meant there was already a handy resource for decorating the tab.
    – dosxuk
    May 15, 2020 at 7:18

3 Answers 3

3

Flashing Tab

These types of notifications are usually called flashing notifications or in the cases of the favicon, Notification alert.

By extension, the case of tabs can be called Flashing Tabs

enter image description here

Image from Create a Flashing Notification Tab

Or Browser Tab Notifications

1
  • 1
    +1 so it seems like there are definitely quite a few types of behaviour/interaction that exists on these tabs.
    – Michael Lai
    May 14, 2020 at 23:21
4
+50

The particular one that you have mentioned in the question do not have a name by definition as of now it seems. Anyways, from a technical side it is adding JS functions to document.title. Therefore maybe we can call it Dynamic Document Title. [from today haha]

Please post your answers if it actually has a defined name. Then I shall remove my answer :)

Also, I'm posting this dynamic favicon of Google Calendar which might be of your interest. The favicon's date changes to the current date.

enter image description here

3
  • +1 I like the suggestion, but maybe it's a bit too 'techy' to catch on? I have noticed the dynamic favicon, and that's a good one to call out too :)
    – Michael Lai
    May 14, 2020 at 23:19
  • It we were to implement changing icon, we would call the task “implement dynamic page Icon”, as the subject is “page title” and “page icon”. May 17, 2020 at 10:23
  • 1
    I think Dynamic Tab Title is a pretty good compromise between what a developer and designer would recognize, so thanks for the answer!
    – Michael Lai
    May 23, 2020 at 23:50
2

I'm surprised I can't see any formal UX description or testing for these anywhere. I did see a couple of articles on creating them which referred to them as Update Notifications.

https://webdesign.tutsplus.com/tutorials/how-to-display-update-notifications-in-the-browser-tab--cms-23458

https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/notifications/update

1
  • 1
    +1 I guess it makes sense in a way because the implementation of that particular feature in the browser tab is like a notification. The example with the %scrolled is more like a live/interaction element, so there are definitely some variations around and perhaps it belongs in a bigger group/family of UI elements.
    – Michael Lai
    May 21, 2020 at 22:57

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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