Comment eviter les spoilers dans les titres et les miniatures YouTube avec Stylus

Introduction

Si vous suivez le sport en replay, vous connaissez probablement ce probleme : vous ouvrez YouTube pour regarder tranquillement une course, un match ou un resume, et le resultat apparait deja dans le titre d’une video recommandee.

Parfois, il ne faut meme pas lire toute la phrase. Quelques mots suffisent pour comprendre qui a gagne, qui a chute, qui a marque ou quel evenement decisif s’est produit.

Le probleme ne concerne pas seulement les titres. Les miniatures peuvent elles aussi reveler beaucoup trop d’informations : le visage du vainqueur, un classement, une image de celebration, une chute ou un moment cle de la competition.

Heureusement, il est possible de rendre YouTube un peu plus discret grace a une extension de navigateur appelee Stylus et a quelques lignes de CSS personnalise.

Un exemple reel : suivre le Giro d’Italia sans connaitre le resultat

Imaginons un passionne de cyclisme qui suit le Giro d’Italia.

Pendant la journee, il travaille et ne peut pas regarder l’etape en direct. Son objectif est simple : rentrer le soir, lancer la video ou le replay, et profiter de la course comme s’il la decouvrait en direct.

Mais il suffit parfois d’ouvrir YouTube quelques secondes pour tomber sur une recommandation du type :

le nom du vainqueur dans le titre ;
une miniature avec le coureur les bras leves ;
une description qui annonce une attaque decisive ;
une image montrant le maillot rose ou le classement final.

Resultat : la surprise disparait avant meme d’avoir appuye sur lecture.

C’est exactement le type de situation que nous allons eviter.

La solution finale

L’idee est de masquer temporairement les elements sensibles sur YouTube.

Avec le style personnalise propose dans cet article, vous obtiendrez ce comportement :

les titres des videos sont floutes ;
les descriptions sont floutees ;
les miniatures sont floutees ;
le contenu redevient visible lorsque vous passez la souris dessus.

Ainsi, vous pouvez naviguer sur YouTube sans lire involontairement un resultat. Et si vous voulez vraiment voir une video precise, il suffit de passer la souris sur son titre ou sa miniature.

Cette solution ne modifie pas YouTube de facon definitive. Elle agit seulement dans votre navigateur, sur votre ordinateur.

Installer Stylus

Stylus est une extension qui permet d’appliquer vos propres styles CSS a un site web.

Pour l’installer :

Ouvrez la boutique d’extensions de votre navigateur.
Recherchez Stylus.
Installez l’extension.
Une fois l’installation terminee, une icone Stylus apparait dans la barre du navigateur.

Stylus est disponible pour les navigateurs les plus courants, notamment Chrome, Firefox et les navigateurs bases sur Chromium.

Creer le style personnalise

Une fois Stylus installe, vous pouvez creer une regle speciale pour YouTube.

Voici les etapes :

Ouvrez YouTube dans votre navigateur.
Cliquez sur l’icone Stylus.
Choisissez l’option permettant de creer un nouveau style pour le site actuel.
Donnez un nom au style, par exemple YouTube sans spoilers.
Collez le code CSS ci-dessous.
Enregistrez le style.

A partir de ce moment, les titres, descriptions et miniatures de YouTube seront floutes automatiquement.

Code CSS complet

Copiez et collez ce code dans Stylus :

@-moz-document domain("youtube.com") {
  /* Miniatures des videos */
  ytd-thumbnail img,
  ytd-playlist-thumbnail img,
  yt-image img {
    filter: blur(18px);
    transition: filter 0.2s ease;
  }

  /* Titres des videos */
  #video-title,
  ytd-rich-grid-media #video-title,
  ytd-video-renderer #video-title,
  ytd-compact-video-renderer #video-title,
  ytd-playlist-video-renderer #video-title {
    filter: blur(6px);
    transition: filter 0.2s ease;
  }

  /* Descriptions et textes secondaires */
  #description-text,
  ytd-video-renderer #description-text,
  ytd-rich-grid-media #metadata-line,
  ytd-video-meta-block #metadata-line {
    filter: blur(6px);
    transition: filter 0.2s ease;
  }

  /* Affichage au passage de la souris */
  ytd-thumbnail:hover img,
  ytd-playlist-thumbnail:hover img,
  yt-image:hover img,
  #video-title:hover,
  ytd-rich-grid-media:hover #video-title,
  ytd-video-renderer:hover #video-title,
  ytd-compact-video-renderer:hover #video-title,
  ytd-playlist-video-renderer:hover #video-title,
  #description-text:hover,
  ytd-video-renderer:hover #description-text,
  ytd-rich-grid-media:hover #metadata-line,
  ytd-video-meta-block:hover #metadata-line {
    filter: none;
  }
}

Conclusion

Cette petite personnalisation peut faire une grande difference pour les amateurs de sport.

Elle ne bloque pas YouTube, ne supprime pas les videos et ne demande aucune competence technique particuliere. Elle ajoute simplement une protection visuelle contre les spoilers les plus courants : les titres trop explicites, les descriptions indiscretes et les miniatures qui revelent le resultat.

Pour le cyclisme, le football, le tennis, la Formule 1 ou n’importe quel autre sport suivi en differe, c’est une solution simple, reversible et facile a adapter.

Si vous regardez souvent les competitions le soir, apres leur diffusion en direct, Stylus peut vous aider a retrouver un peu du plaisir de la decouverte.