Les paramètres Couleurs et Typographie de Document360 vous permettent de contrôler l’apparence visuelle de votre site de base de connaissances, du thème du site et des couleurs de la marque jusqu’aux polices dans les articles et la navigation. Tous les paramètres sont configurés depuis la personnalisation du site et s’appliquent au niveau du projet – la couleur de la marque se réfluent en CTAs, états de sélection et éléments interactifs ; La couleur des hyperliens contrôle la façon dont les liens apparaissent dans tous les articles ; L’appariement des polices d’articles détermine les polices utilisées dans les titres et le contenu du corps des articles, et les mêmes polices apparaissent dans l’éditeur afin que les auteurs puissent prévisualiser à quoi ressembleront les articles une fois publiés ; La police du site contrôle la navigation, les en-têtes, les pieds de page et les contrôles séparément du contenu de l’article.
Ces réglages fonctionnent ensemble pour créer une expérience visuelle cohérente pour les lecteurs sur chaque page.
Quand mettre à jour les couleurs et la typographie
- Lors de la création d’une nouvelle base de connaissances , établissez la couleur de votre marque, la couleur des liens hyper et les polices dans la configuration initiale afin que le site reflète votre identité dès le départ.
- Après une mise à jour de la marque – si votre entreprise met à jour sa couleur principale, sa police ou ses lignes directrices visuelles, mettez à jour les paramètres de la base de connaissances pour rester alignés.
- Lorsque les lecteurs signalent des problèmes d’accessibilité , utilisez l’option Ajuster le contraste de couleur pour respecter les normes WCAG afin d’appliquer automatiquement des rapports de contraste conformes aux WCAG en fonction de la couleur de votre marque.
- Lors du passage entre les thèmes clair et sombre , les couleurs qui fonctionnent en mode clair peuvent ne pas avoir suffisamment de contraste en mode sombre. Examinez et ajustez les couleurs des deux thèmes lors de l’activation du support du double mode.
- Lorsque le contenu de l’article est difficile à lire – si les lecteurs trouvent la police par défaut trop petite, trop dense ou mal adaptée à votre produit, mettez à jour la paire de polices de l’article et celle du site pour améliorer la lisibilité.
Thème du site
Le thème du site contrôle quels modes de couleur sont disponibles pour les lecteurs sur votre site de base de connaissances.
- Naviguez vers () dans la barre de navigation de gauche du portail de la base de connaissances.
- Dans le panneau de navigation de gauche, naviguez vers Knowledge base site } > Personnalisation du site.
- Dans le champ thème du site , sélectionnez l’une des options suivantes :
- Lumière et Obscurité - Les lecteurs peuvent passer des modes clair et sombre via le bouton de thème dans l’en-tête du site.
- Lumière uniquement - Le site est toujours affiché en mode lumière. Le bouton de thème est caché.
- Noir uniquement - Le site est toujours affiché en mode sombre. Le bouton de thème est caché.
- Cliquez sur Enregistrer.
Couleurs
Couleur de la marque
La couleur de la marque est la couleur principale appliquée aux CTAs, aux états de sélection et aux éléments interactifs sur votre site de base de connaissances.
- Naviguez vers () dans la barre de navigation de gauche du portail de la base de connaissances.
- Dans le panneau de navigation de gauche, naviguez vers Knowledge base site } > Personnalisation du site.
- Dans la section Couleurs, sélectionnez une couleur à l’aide du sélecteur de couleurs ou entrez un code HEX dans le champ Marque.
- Cliquez sur Enregistrer.
Si l’option Auto régle le contraste des couleurs pour répondre aux normes WCAG est activée, les couleurs claires et foncées sont automatiquement définies en fonction de la couleur de votre marque. Si elle est désactivée, vous devez définir manuellement les couleurs de chaque thème séparément.
Couleur de l’hyperliaison
Vous pouvez personnaliser la façon dont les liens hypertextes apparaissent sur votre site de base de connaissances. Trois options sont disponibles :
| Option | Ce que ça fait |
|---|---|
| Utiliser la norme industrielle | Applique la couleur par défaut du lien hypertexte couramment utilisée |
| Utilisez la couleur de la marque | Applique la même couleur sélectionnée que la couleur de votre marque |
| Utilisez une couleur différente | Permet de définir des couleurs par défaut, survoler et visitées séparées pour les hyperliens |
Pour définir la couleur du lien hypertexte :
- Naviguez vers () dans la barre de navigation de gauche du portail de la base de connaissances.
- Dans le panneau de navigation de gauche, naviguez vers Knowledge base site } > Personnalisation du site.
- Dans la section Couleurs , allez dans Hyperlink couleur et sélectionnez l’option que vous souhaitez.
- Si vous sélectionnez Utiliser une couleur différente, configurez les états par défaut, survolez et visités.
- Cliquez sur Enregistrer.
Contraste automatique WCAG
L’activation du contraste automatique WCAG ajuste automatiquement les éléments de couleur de votre site pour répondre aux normes d’accessibilité WCAG 2.1 , en fonction de la couleur de marque choisie.
- Naviguez vers () dans la barre de navigation de gauche du portail de la base de connaissances.
- Dans le panneau de navigation de gauche, naviguez vers Knowledge base site } > Personnalisation du site.
- Dans la section Couleurs , sélectionnez la case Auto régler le contraste des couleurs pour répondre aux normes WCAG .
- Cliquez sur Enregistrer.
Typographie
Appariement des polices d’articles
L’appariement des polices d’articles contrôle les polices utilisées pour les titres et le contenu des articles sur votre site de base de connaissances. Les polices sélectionnées apparaissent également dans l’éditeur, permettant aux auteurs de prévisualiser à quoi ressembleront les articles une fois publiés.
- Naviguez vers () dans la barre de navigation de gauche du portail de la base de connaissances.
- Dans le panneau de navigation de gauche, naviguez vers Knowledge base site } > Personnalisation du site.
- Dans la section Polices , sélectionnez une paire de polices dans la tuile d’appariement de polices Article . La première police s’applique aux titres d’articles, et la seconde au contenu des articles.
- Pour choisir une combinaison spécifique, cliquez sur « Vous avez une combinaison de polices précise en tête ? » pour accéder à des options de polices supplémentaires et sélectionner les polices pour les titres et le contenu individuellement.
- Cliquez sur Enregistrer.
Par exemple, si vous rédigez du contenu dans Verdana dans le portail de la base de connaissances mais sélectionnez Ubuntu + Open Sans comme association de polices d’article, le titre de l’article apparaîtra dans Ubuntu et le contenu dans Open Sans sur le site de la base de connaissances.
Police du site
La police du site s’applique dans toute la navigation du site de la base de connaissances — y compris le panneau de navigation de gauche (catégories, sous-catégories, titres d’articles), l’en-tête, le pied de page, la navigation secondaire et les contrôles.
- Naviguez vers () dans la barre de navigation de gauche du portail de la base de connaissances.
- Dans le panneau de navigation de gauche, naviguez vers Knowledge base site } > Personnalisation du site.
- Dans la section Polices , sélectionnez votre police préférée dans le menu déroulant de la police du site .
- Cliquez sur Enregistrer.
Pour plus d’informations sur la façon dont les changements de polices au niveau du projet affectent les articles existants, les polices obsolètes et les méthodes de gestion des polices, consultez la section Gestion des polices dans votre base de connaissances.
Police personnalisée
Si les options de police intégrées ne correspondent pas à votre marque, vous pouvez configurer une police personnalisée pour votre site de base de connaissances. Pour une solution étape par étape, consultez Comment configurer une police personnalisée dans la base de connaissances.
Meilleures pratiques
- Activez le contraste automatique WCAG si la conformité à l’accessibilité est importante pour votre audience – cela élimine la confusion de vérifier manuellement les rapports de contraste pour chaque combinaison de couleurs.
- Définissez d’abord la couleur de votre marque avant de configurer les couleurs des hyperliens – si vous prévoyez d’utiliser la couleur de marque pour les hyperliens, le réglage de couleur de marque doit d’abord être enregistré.
- Testez les modes clair et foncé après avoir effectué des changements de couleur – une couleur de marque qui est bonne en mode clair peut avoir un faible contraste en mode sombre. Utilisez l’aperçu du site pour vérifier les deux.
- Utilisez l’appariement des polices d’article pour la lisibilité – choisissez un appariement où la police du titre est distincte de la police du corps pour créer une hiérarchie visuelle claire.
- Évitez les changements fréquents de police – changer de police après la publication du contenu peut affecter la façon dont les articles existants sont affichés, surtout si des styles personnalisés ont été appliqués au niveau de l’article.