Recherche

Personnaliser les couleurs de votre plateforme

  • Mise à jour

Qui peut utiliser cette fonctionnalité ?

  • Les administrateurs plateforme peuvent personnaliser les couleurs de la plateforme pour tous les groupes.
  • Sur les plateformes dotées de la solution Extended Academies, les administrateurs de groupe peuvent personnaliser les couleurs de chaque groupe. Pour plus d’informations, consultez Personnaliser les couleurs d’un groupe.
  • Cette fonctionnalité est uniquement disponible sur l'application Web.

Vous pouvez personnaliser les couleurs de la plateforme à 3 endroits :

  • La couleur principale : utilisée pour les boutons, les fenêtres contextuelles, les notifications par mail, la puce de navigation supérieure pour votre page actuelle, les liens et les éléments sélectionnés.
  • La couleur de fond : utilisée pour l’arrière plan de la section principale de la page d'accueil, la page de groupe et des pages de profil. La couleur de fond n’est pas visible dans la page de résultats de recherche, ni en jouant ou modifiant des contenus de formation.
  • La barre latérale : la couleur de fond de la barre de navigation à gauche, visible partout sauf lorsque vous êtes à l’intérieur d’une formation.
  • La couleur de fond de la section "Mon travail" : utilisée pour l'arrière-plan de la section "Mon travail" sur la page d'accueil. 

Si vous ne voyez pas de changement dans les couleurs après avoir modifié les paramètres, cela peut être lié à l’activation du CSS sur votre plateforme. Contactez le propriétaire de votre plateforme pour en savoir plus.

Modifier les couleurs de la plateforme

  • Si vous ne voyez pas gear.svg Paramètres dans la barre de gauche, remplacez la première étape par :
    1. Sur la page d’accueil, dans la barre de gauche, cliquez sur le groupe plateforme (avec une couronne jaune en bas à droite de son icône).
    2. En haut à droite de la section principale, cliquez sur settings.svg Paramètres.
  1. Dans la barre de gauche, survolez le groupe plateforme (avec la couronne) et cliquez sur settings.svg Paramètres.
  2. Dans la barre de gauche, cliquez sur Identité visuelle.
  3. Cliquez sur le champ en dessous de Couleur principale, Couleur de fond, Couleur de fond de la section "Mon travail" ou Barre latérale pour modifier la couleur.
      • Pour utiliser un code HEX, cliquez sur la droite du champ, et entrez le code directement.
        HEX color.gif
      • Pour utiliser la pipette colorimétrique, cliquez sur l’aperçu de la couleur dans la partie gauche du champ, modifiez éventuellement l’échelle du spectre colorimétrique et cliquez quelque part dans la zone de couleur. Puis, cliquez en dehors du menu.
        eyedrop.gif
      • Pour utiliser un code RGB ou HSL, cliquez sur l’aperçu de la couleur dans la partie gauche du champ, et entrez les valeurs dans le champ. Puis, cliquez en dehors du menu.
        RGB.gif

    Si votre couleur de fond n’est pas suffisamment contrastée par rapport à la couleur principale, nous afficherons un avertissement. Vous pourrez toujours appliquer vos couleurs, mais le résultat pourra rendre votre plateforme moins lisible et moins accessible. Voir la section Contraste.

  4. En bas à droite, cliquez sur Prévisualiser pour voir un aperçu de la nouvelle couleur sur la page d’accueil, la barre de navigation de gauche, et les notifications mail. Vous pouvez cliquer sur Annuler pour restaurer les valeurs précédentes.
  5. Si les nouvelles couleurs vous plaisent, cliquez sur Appliquer.

La plateforme adapte le texte et la couleur des icônes pour garantir le meilleur taux de contraste avec la couleur de fond de la plateforme, conformément aux Web Content Acessibility Guidelines (WCAG) :

  • Si la couleur de fond de la plateforme est sombre, le texte et les icônes seront en blanc.
  • Si la couleur de fond de la plateforme est claire, le texte et les icônes seront en noir.

Revenir aux couleurs par défaut de la plateforme

Couleurs par défaut de la plateforme

Si vous n'avez pas personnalisé les couleurs de votre plateforme, elle utilisera les valeurs par défaut.

  • Couleur principale : #1E57D1
  • Barre latérale : #FFFFFF 
  • Couleur de fond de la section "Mon travail" : #F7F4EE 
  • Barre latérale : #FFFFFF 

Si vous avez personnalisé les couleurs de votre plateforme, vous pouvez les rétablir à leurs valeurs par défaut. Ces valeurs par défaut se propageront automatiquement aux sous-groupes, jusqu’à ce qu’ils atteignent un groupe avec ses propres valeurs personnalisées.

Pour rétablir les couleurs par défaut de la plateforme :

  • Si vous ne voyez pas gear.svg Paramètres dans la barre de gauche, remplacez la première étape par :
    1. Sur la page d’accueil, dans la barre de gauche, cliquez sur le groupe plateforme (avec une couronne jaune en bas à droite de son icône).
    2. En haut à droite de la section principale, cliquez sur settings.svg Paramètres.
  1. Dans la barre de gauche, survolez le groupe plateforme (avec la couronne) et cliquez sur settings.svg Paramètres.
  2. Dans la barre de gauche, cliquez sur Identité visuelle.
  3. Cliquez sur Réinitialisation à la valeur par défaut
  4. En bas à droite, cliquez sur Prévisualiser pour voir un aperçu de la nouvelle couleur sur la page d’accueil, la barre de navigation de gauche, et les notifications mail. Vous pouvez cliquer sur Annuler pour restaurer les valeurs précédentes.
  5. Si les nouvelles couleurs vous plaisent, cliquez sur Appliquer.

Contraste

Le taux de contraste est une indication de la différence d’intensité de lumière (la luminance) émise entre deux couleurs adjacentes sur un écran. Une formule mathématique mesure le taux de contraste, sur une échelle allant de 1:1 à 21:1 (plus la différence entre les deux nombres est élevée, meilleur est le contraste).

Lorsque vous choisissez les couleurs de votre plateforme, gardez à l’esprit que le taux de contraste entre la couleur principale et la couleur de fond aura des conséquences sur la lisibilité de votre plateforme. Un contraste suffisant permet une meilleure expérience pour tous·tes — qu’il s’agisse de personnes avec un handicap visuel, ou qui utilisent un appareil avec un petit écran, ou en plein soleil du désert à midi.

Le standard Web Content Accessibility Guidelines (WCAG) définit trois niveaux de conformité pour le taux de contraste :

  • A : minimum. Aucun taux de contraste minimum n’est requis.
  • AA : acceptable. Taux de contraste supérieur à 4.5:1.
  • AAA : optimal. Taux de contraste supérieur à 7:1.

Nous recommandons un taux de contraste d’au moins 4.5:1 (« acceptable », d’après le standard WCAG), mais les exigences de conformité de votre entreprise peuvent nécessiter un niveau plus élevé.

Pour mesurer le taux de contraste entre votre couleur principale et couleur de fond :

  1. Lancez une appli de mesure de contraste, par exemple :
  2. Dans les champs correspondant à Foreground et Background, entrez les code HEX des couleurs de votre couleur principale et couleur de fond.
  3. Si le taux de contraste est inférieur à 4.5:1, il est en dessous du niveau de conformité AA (« acceptable »).

Lorsque vous sélectionnez la couleur de fond, la plateforme adapte automatiquement le texte et la couleur des icônes pour avoir le meilleur taux de contraste.

Liste des notifications mail dont la couleur du bouton est personnalisable

La personnalisation est visible sur les notifications mail suivantes :

Visitez notre blog pour plus de ressources sur le Collaborative Learning.

Cet article vous a-t-il été utile ?

Utilisateurs qui ont trouvé cela utile : 21 sur 27


Vous avez d’autres questions ? Envoyer une demande