Je pourrais sortir les violons pour lamenter la monoculture du web, pleurer la disparition de navigateurs aussi indépendants qu’innovants comme Opera et OmniWeb, et dire l’ennui profond que m’inspirent les navigateurs dits modernes. Mais avec Safari 15, Apple semble vouloir bousculer ses concurrents, les utilisateurs, et les développeurs web. La nouvelle barre d’onglets, qui absorbe la barre d’outils1, reprend la couleur de l’élément meta theme-color.

<!DOCTYPE html>
<html lang="fr">
  <head>
    <title>Zinzolin</title>
    <meta name="theme-color" content="hsl(250, 55%, 30%)">
  </head>

  <body>…</body>
</html>

Depuis quelques mois, j’encadre les clichés de la rubrique photo et les fiches de lecture de la rubrique biblio par leur couleur dominante, comme je le faisais déjà pour les encres de la rubrique stylo. Puisque l’élément meta theme-color reprend cette couleur, l’ambiance change au fil de la navigation, jusqu’au bout de la barre d’état de l’iPhone et de l’iPad.

Quelques pages de Zinzolin dans Safari 15 sur iPad.

Le chrome disparait, la frontière entre l’interface et le contenu s’efface, et le caractère propre de chaque site peut s’affirmer. Mieux : Apple propose une extension de la syntaxe de l’élément meta theme-color pour prendre en compte les modes d’apparence. Moi qui voulais que l’apparence de Zinzolin réagisse au contenu et aux préférences de l’utilisateur, je suis servi.

<!DOCTYPE html>
<html lang="fr">
  <head>
    <title>Zinzolin</title>
    <meta name="theme-color" content="hsl(250, 55%, 30%)" media="(prefers-color-scheme: light)">
	<meta name="theme-color" content="hsl(220, 35%, 30%)" media="(prefers-color-scheme: dark)">
  </head>

  <body>…</body>
</html>

Safari adapte la couleur des éléments textuels, et peut ignorer les préférences du développeur web, pour assurer le respect des normes d’accessibilité. De la même manière, les teintes trop proches de la couleur des boutons de fermeture et de minimisation des fenêtres de macOS seront retoquées.

La page d’accueil de Zinzolin avec le mode d’apparence claire (à gauche) et sombre (à droite).

Au passage, j’ai intégré le protocole Open Graph, que j’avais toujours snobé. Apple l’exploite pour enrichir l’aperçu des liens dans Messages, et maintenant dans la fonction « Partagé avec vous », intégrée aux principales applications de contenu. Il ne manquerait plus que les aperçus reprennent la couleur du site ! Safari 15 est intégré dans macOS Monterey et iOS 15, mais ses principales nouveautés pourront être testées avec la future Safari Technology Preview 126.

  1. Et donne un parfait exemple de la manière dont l’obsession d’Alan Dye pour les boutons qui disparaissent, au mépris des bonnes pratiques de conception d’interfaces humain-machine qui suggèrent leur usage, finira par vider macOS de toute sa convivialité. Une interface pratique peut être jolie, mais une jolie interface n’est pas nécessairement pratique. ↩︎