À retenir
- Il s'agit d'une superposition visuelle ou logique.
- Il permet de consulter des informations sans interrompre l'activité principale.
- Il est très utilisé dans le gaming et les applications de communication.
Un overlay est une couche d'informations ou un élément graphique qui vient se superposer à l'interface principale d'un logiciel. C'est un peu comme si vous posiez un calque transparent sur une photographie : vous continuez de voir l'image du dessous, mais vous y ajoutez des détails au premier plan sans modifier le contenu original.
Étymologie
Vient de l'anglais over (dessus) et lay (poser). À l'origine utilisé dans l'imprimerie et la vidéo pour la superposition de couches physiques ou analogiques, le terme désigne aujourd'hui l'affichage de données supplémentaires au-dessus d'une interface utilisateur ou la création de réseaux virtuels sur une infrastructure physique.
Exemples d'usage
- Le menu de discussion (chat) qui apparaît par-dessus l'écran de jeu dans Steam ou Discord.
- Les widgets affichant la vitesse de connexion ou l'utilisation du processeur en transparence sur le bureau.
- Une petite fenêtre de vidéo qui continue de jouer en miniature pendant que vous naviguez sur une autre application (Picture-in-Picture).
Cas d'usage
On utilise l'overlay en design d'interface (UI) pour afficher des notifications ou des menus sans quitter la page actuelle. En cybersécurité, il peut désigner une technique malveillante visant à superposer une fausse interface sur une vraie (overlay attack) pour voler des mots de passe. En réseau, un overlay network est un réseau virtuel construit au-dessus d'un autre réseau.
Bonnes pratiques
Un overlay doit être peu intrusif : il ne doit pas masquer les éléments de navigation critiques de l'utilisateur. Il est essentiel de prévoir un bouton de fermeture visible ou de permettre sa disparition d'un simple clic à côté de la zone d'affichage.
Synonymes
Antonymes
Conseil
Pour les débutants en développement web, privilégiez l'utilisation de balises <dialog> ou de couches CSS avec un z-index élevé pour créer des overlays propres et accessibles.
Questions fréquentes
Est-ce la même chose qu'une fenêtre contextuelle (pop-up) ?
Pas tout à fait. Une pop-up est souvent une nouvelle fenêtre gérée par le système, alors qu'un overlay fait partie intégrante de l'interface de l'application et 'flotte' au-dessus de son contenu.
Un overlay peut-il être dangereux ?
Oui, dans le cas d'une attaque par superposition (overlay attack), un pirate peut afficher une fausse fenêtre de connexion par-dessus une application bancaire légitime pour récupérer vos identifiants.
Comment supprimer un overlay ?
Généralement via les paramètres de l'application (comme les options 'En jeu' de Discord ou Steam) ou en appuyant sur une combinaison de touches spécifique (Esc, Maj+Tab, etc.).