The other issue with Safari on iOS 15


iOS 15 was published on 20.09.2021. Apart from the adress bar position change, Apple also implemented the theme-color meta-Tag in Safari.

The theme-color tag is used to extend the websites design by coloring elements outside the actual page.

<meta name="theme-color" content="#4285f4">

Example usage of the theme-color tag
Image by Google (Icons & Browser Colors), licensed unter CC BY 4.0. Edited.

In iOS 15 that means changing the color of the status bar that is used since iOS 14 to indicate microphone or camera usage.

Screen recording, microphone and camera usage indicators; normal status bar
Screen recording, microphone and camera usage indicators; normal status bar

To keep a website from completely blocking these indicators with the theme-color tag, they are full-width and pulsing. The theme color, however, still has some influence over the bars color:

microphone on and no <code>theme-color</code> tag, pulsing; microphone on and <code>theme color #ff8e00</code>, pulsing; no microphone, <code>theme-color #ff8e00</code>, static
microphone on and no theme-color tag, pulsing; microphone on and theme color #ff8e00, pulsing; no microphone, theme-color #ff8e00, static

This makes the status bar less valuable as an area to have security indicators in. These areas are important though.
One example is the windows UAC window. The screen is darkened and the only element on it is the question for elevated rights with information about the program asking for them. This makes it clear to the user that something important is happening.

UAC question on Windows
UAC question on Windows

Apple has lost this advantage, at least in Safari.