Outils du site

fr:website_kh_charte_graphique

Charte graphique du site Khaganat

Pour l'organisation général du site, voir Améliorer le(s) site web de Khaganat.

Le site web est construit de bric et de broc, l'unifier graphiquement est important tout en étant assez complexe.

Il y a deux “parties” sur le site, représentés par des variations dans la charte : la partie Khaganat (projet général), dans les tons violets et jaunes, et la partie Khanat (premier univers), dans les tons bleus et jaunes. La charte graphique de Khanat devrait être reprise en jeu…

Toutes les pages du site ont un élément en commun1) : la barre de navigation générale. On peut trouver son code sur le gitlab.

Les textes sont sur fond blanc ou blanc translucide afin d'avoir un bon contraste sans fatiguer les yeux.

Voir aussi la page Astuces pour les sites web (css et compagnie) pour des outils pouvant aider à améliorer le visuel.

Khaganat

Palette de couleur

La palette de Khaganat est visible à cette adresse : https://khaganat.net/tools/palette_khaganat.html

En gras, notre choix principal (entre autre pour le logo):

  • Couleurs primaires : 9800FF 8530BF 6300A6 B240FF C673FF
  • Couleurs secondaires : FF00A6 BF308D A6006C FF40BC FF73CE
  • Couleurs secondaires B : 3600FF 4E30BF 2300A6 6840FF 9073FF
  • Couleurs complémentaires : FFFA00 BFBC30 A6A300 FFFB40 FFFC73

Police (font)

  • font-family:“Verdana”,“Arial”,“Helvetica”,sans-serif;
  • Dans nos documents, nous tentons d'utiliser la police Ubuntu. Nous avons fait le choix de ne pas l'appeler sur les sites web afin de ne pas pénaliser les petites connexion en ajoutant quelque chose à télécharger2).

Image de fond - Background

L'image de fond est disponible ici : https://khaganat.net/img/bg_khaganat.jpg

Éléments divers

Afin d'adoucir la mise en page, la plupart des cadres utilisent la propriété border-radius afin d'avoir des coins arrondis.

Khanat

Palette de couleur

La palette de Khanat est visible à cette adresse : https://khaganat.net/tools/palette_khanat.html

En gras, notre choix principal (entre autre pour le logo) :

  • Couleurs primaires : 0D58A6 26517D 04376C 4188D3 689CD3
  • Couleurs secondaires : 2419B2 352F85 100873 574DD8 7972D8
  • Couleurs secondaires B :FFC500 BF9E30 A68000 FFD340 FFDF73
  • Couleurs complémentaires : FF9900 BF8630 A66300 FFB240 FFC773

Police (font)

Image de fond - Background

L'image de fond est disponible ici : https://khaganat.net/img/bg_khanat.jpg

Éléments divers

1)
En théorie, parce qu'en pratique, c'est pas toujours évident de l'insérer
2)
On pense à ceux qui ont une 3G pourrie sans forfait illimité.
fr/website_kh_charte_graphique.txt · Dernière modification: 2018/02/25 11:43 par zatalyz