Retour à lʼaccueil de la formation

Modifier l'aspect du wiki

Personnaliser les couleurs

image lookwiki.gif (0.7MB)

Pour vous permettre de poser un décor, YesWiki vous permet de personnaliser les couleurs : menus, titres, liens, boutons peuvent adopter la couleur de votre choix.
Avec un wiki récent (en version Doryphore et avec le thème Margot) , vous pouvez accéder aux options de couleurs via l'onglet Look de la page "Gestion du site", puis bouton "Personnaliser le thème de ce wiki" - voir l'animation ci-contre.

Si vous n'avez pas de charte graphique, je vous conseille de définir avec votre groupe si un élément visuel peut vous caractériser (une plaquette, une photo, un objet totem, ...). Il existe des outils pour extraire une couleur d'une image, cela peut être un bon point de départ. Si ce n'est pas le cas, cherchez une palette de couleur tendance - ne choisissez pas 3 couleurs au hasard !

Choisir une palette de couleur

En créant "une nouvelle configuration graphique", vous avez la possibilité de définir :
  • une couleur primaire : c'est votre couleur dominante, elle sera utilisée par défaut pour la barre de menu ainsi que pour les titres et les liens. N'utilisez la couleur dominante de votre palette que sur les éléments essentiel de votre site ( appel à l'action, bouton, liens ...)
  • 2 couleurs secondaires peu visibles par defaut mais vous pourrez facilement les utiliser dans vos éléments de mise en forme. La couleur secondaire 2 est utilisée pour l'encadré "texte mis en valeur".
  • la couleur de votre texte et celle du fond - si vous les modifiez, veillez à bien respecter le contraste pour assurer la lisibilité des contenus.

Astuce Il arrive parfois d'avoir envie de différencier 2 parties du site, par exemple si une partie est publique et l'autre partie est privée (en mode intranet). Il est possible de définir 2 jeux de couleurs (2 configurations graphiques) et de les appliquer à chaque page : lorsque vous éditez une page de votre wiki, vous trouverez un bouton "theme" en bas de page qui vous permettra d'appliquer spécifiquement à cette page le jeu de couleur souhaité.

Personnaliser les polices des titres et du texte

Une police donne du caractère à votre contenu - il fait partie des éléments de style. La police des titres devra accrocher l'oeil (par sa taille, sa couleur, et par la forme des lettres), la police du corps de texte doit avant tout permettre de faciliter la lecture.
Google font propose 900 polices libres, rangées par Google selon les plus utilisées. Vous pouvez les utiliser gratuitement. L'avantage est qu'elles sont optimisées pour tous les navigateurs.

Recommandations

  • polices manuscrite (handwriting) : coté humain et artisanal, mais à garder pour quelques phrases à mettre en valeur ou des titres, difficulté de lisibilité
  • polices à empattement (avec serif) : effet imprimerie, crédibilité à utiliser plutot pour les supports papiers
  • polices sans empattement (sans serif) : plus épurées, elles offrent un meilleur confort de lecture à l'écran

Parmi les web font les plus populaires : Arial, Montserrat, Lato, Roboto.

Exemples de combinaison de police

Utilisation de la police Montserrat
Titre en lettres capitales pour plus d'impact
image Palmiers_Montserrat.png (39.7kB)
Police des titres : Raleway
Police du texte : Roboto
image HPF_Raleway_Roboto.png (46.2kB)
A l'heure actuelle,sauvegarder la configuration et l'appliquer à vos pages ne suffit pas et une intervention supplémentaire de votre part sera nécessaire pour pouvoir réellement utiliser les polices choisies.

Comment intégrer une police dans Yeswiki