2. Introduction
Ce document présente les règles de déclinaisons graphiques,
chromatiques, typographiques, et iconographiques de l'office
de tourisme de Figeac.
L'application rigoureuse de ces règles a pour objectif de garder
une harmonie et une cohérence à travers le site internet.
Cette charte graphique permet à tout utilisateur de s'approprier
les principes de base de l'identité.
1
3. Principes généraux
Page d'accueil - Composition
1 Header à fort impact visuel ( zone flash), avec
accès à la vidéo et au site des Grands Sites de
Midi Pyrénées
1
2 Zone de recherche par mots clés, et sélection de la
langue.
4 Accès aux espaces collaboratifs, vidéos, photos et
3
2 3 à la carte intéractive.
7 4 Accès aux thématiques visiter, bouger, déguster,
5 séjourner.
5 Accès aux espaces d'informations.
6
6 Zone d'actualités (Lumière sur) et événements du
pays de figeac.
7 Accès au site enfants.
8 8 Pied de page présent sur tout le site, regroupant
des outils, infos pratiques ... etc
2
4. Principes généraux
Page d'accueil - Animations flash
+ Visuels des animations flash, du header.
Mise en avant des atouts touristiques du Pays de Figeac.
Affichage aléatoire.
3
5. Principes généraux
Page d'accueil - Navigation
2 Accès aux thématiques visiter, bouger,déguster, séjourner. Pour une meilleure distinction; une couleur et un picto spécifique sont associés aux différentes entrées.
3 Accès aux espaces d'informations.
Une couleur spécifique est associée aux
différentes entrées.
4
6. Principes généraux
Grands principes de mise en forme
1 1 Visuel de fond, spécifique pour chaque grande rubrique.
2 Fil d'ariane. Donne l'arborescence des rubriques que le visiteur a traversé.
2
3
4
5 3 Titre H1, police Aldo Semi Bold 30px, plus d'informations sur le fonctionne-
ment de couleurs dans le document annexe (Ot-Figeac.xls)
4 Icônes présentes sur toutes les pages, elles permettent d'imprimer la page,
de l'envoyer à un ami, de réduire ou d'augmenter la taille du texte, et de la
partager via des sites communautaires.
6
5 Titre H2, police Aldo Semi Bold 25px, plus d'informations sur le fonctionne-
ment de couleurs dans le document annexe (Ot-Figeac.xls)
6 Titre H3, police Aldo Semi Bold 20px, plus d'informations sur le fonctionne-
ment de couleurs dans le document annexe (Ot-Figeac.xls)
7 Liste à puces, la puce est de la couleur dominante de la rubrique.
7
5
7. Principes généraux
Grands principes de mise en forme
1
+ Gamme chromatique spécifique aux rubriques : 1
Visuel de fond spécifique pour chaque grande rubrique.
FIGEAC, Cité de Champollion
Particularité pour la page "Musée Champollion, les Écritures du Monde", qui dispose
Villes et villages de pierre aussi de sa propre image de fond.
Entre Causses et Vallées du Lot
Plaisirs Culturels et Artistiques
Un grand marché de Saveurs
Sur la route de Saint-Jacques
Pages génériques 6
8. Principes généraux
Visiter, bouger, déguster, séjourner - Page de résultats
1 Titre H1, police Aldo Semi Bold 30px, plus d'informations sur la couleur
associée sur le document annexe (Ot-Figeac.xls)
Une iconagraphie spécifique à la rubrique vient habiller le titre.
2 Titre H2, police Aldo Semi Bold 25px, plus d'informations sur la couleur
1 associée sur le document annexe (Ot-Figeac.xls)
2
3 3 Zone de recherche et de localisation.
Couleur de fond et picto de localisation spécifique à la rubrique ( page. 9 )
4 Titre H3, police Aldo Semi Bold 20px, plus d'informations sur la couleur
associée sur le document annexe (Ot-Figeac.xls)
5 Résultats liés à la recherche. L'ensemble des résultats se trouve dans une
zone scrollable.
4
5
7
9. Principes généraux
Pages visiter, bouger, déguster, séjourner - Fiche détaillée
1 Texte d'information sur l'activité ou le séjour sélectionné.
Lien permettant de retourner à la page de recherche.
1
2 Photographie. Visualiser plusieurs photos via une numérotation.
2
3 3 Ancres. Accéder directement à l'information désirée se trouvant en bas de
page.
4 Cartographie. Localiser sur une carte la visite.
4
5 Coordonnées et périodes d'ouverture.
5
6 Informations complémentaires.
6
8
10. Principes généraux
Visiter, bouger, déguster, séjourner - Particularités
1 1 1 1
2 2 2 2
3 3 3 3
4 4 4 4
1 Iconographie spécifique :
Visiter Bouger Deguster Séjourner
2 Couleur spécifique : Visiter Bouger Deguster Séjourner
3 Zone de recherche et de localisation.
Couleur de fond et picto de localisation spécifique à la rubrique Visiter Bouger Deguster Séjourner
4 Listing de résultats : couleurs spécifiques aux différentes rubriques
9
11. Gamme Chromatique
Pages génériques
R : 218 R : 173 R : 235 R : 97 R : 54
V : 123 V : 102 V : 231 V : 59 V : 41
B:0 B : 12 B : 228 B : 56 B : 39
# DA7B00 # AD660C # EBE7E4 # 613B38 # 362927
Pages Visiter
R : 99 R : 154 R : 140 R : 239
V : 34 V : 11 V : 62 V : 233
B : 74 B : 95 B : 110 B : 237
# 63224A # 9A0B5F # 8C3E6E # EFE9ED
Pages Bouger
R : 29 R : 10 R : 29 R : 221
V : 172 V : 120 V : 98 V : 242
B : 192 B : 134 B : 105 B : 245
# 1DACC0 # 0A7886 # 1D6269 # DDF2F5
10
12. Gamme Chromatique
Pages Déguster
R : 163 R : 207 R : 121 R : 250
V : 65 V : 50 V : 40 V : 240
B : 69 B : 57 B : 45 B : 239
# A34145 # CF3239 # 79282D # FAF0EF
Pages Séjourner
R : 149 R : 205 R : 68 R : 244
V : 26 V : 64 V : 30 V : 233
B : 65 B : 109 B : 55 B : 237
# 951A41 # CD406D # 441E37 # F4E9ED
Pages Figeac, Cité de Champolion
R : 122 R : 173 R : 217 R : 198
V : 60 V : 30 V:0 V : 160
B : 92 B : 117 B : 132 B : 181
# 7A3C5C # AD1E75 # D90084 # C6A0B5
11
13. Gamme Chromatique
Pages Villes & Villages de Pierre
R : 78 R : 106 R : 121 R : 190
V : 46 V : 60 V : 68 V : 170
B : 34 B : 44 B : 59 B : 163
# 4E2E22 # 6A3C2C # 79443B # BEAAA3
Pages Entre Causses et Vallées du Lot
R : 65 R : 79 R : 93 R : 163
V : 83 V : 101 V : 14 V : 182
B:0 B:3 B:0 B : 100
# 415300 # 4F6503 # 5D8D00 # A3B664
Pages Plaisirs Culturels et Artistiques
R : 106 R : 145 R : 196 R : 220
V : 34 V : 39 V : 53 V : 141
B : 62 B : 81 B : 111 B : 170
# 6A223E # 912751 # C4356F # DC8DAA
12
14. Gamme Chromatique
Pages Un Grand marché de saveurs
R : 171 R : 20 R : 213 R : 205
V:3 V : 50 V : 92 V : 149
B : 14 B : 57 B : 89 B : 150
# AB030E # CF3239 # D55C59 # CD9596
Pages Sur la route de St-Jacques
R:0 R:8 R:0 R : 122
V : 77 V : 101 V : 145 V : 189
B : 88 B : 114 B : 162 B : 198
# 004D58 # 086572 # 0091A2 # 7ABDC6
13
15. Typographie
Aldo Semi Bold
+ Cette typographie est utilisée pour les H1, H2, H3, le texte se trouvant
ABCDEFGHIJKLMNOPQRSTUVWXYZ dans le chapo et la navigation.
a b c d e f g h i j k l m no p q r s t u v w x y z
1234567890
Miso Regular
Cette typographie est uniquement utilisée pour les citations et la
ABCDEFGHIJKLMNOPQRSTUVWXYZ +
navigation de pied de page.
a b c d e f g h i j k l m no p q r s t u v w x y z
1234567890
Arial Regular et Bold
+ Typographie générique se trouvant dans le reste du site.
ABCDEFGHIJKLMNOPQRSTUVWXYZ
a b c d e f g h i j k l m no p q r s t u v w x y z
1234567890
ABCDEFGHIJKLMNOPQRSTUVWXYZ
a b c d e f g h i j k l m no p q r s t u v w x y z
1234567890
14
16. Iconographie
Les principes graphiques présentés ci-dessous, reprennent les éléments forts de l'identité du Pays de Figeac.
- Les hiéroglyphes. En référence au musée Champollion de Figeac, certaines rubriques auront pour éléments représentatif une icône issue de l'écriture
hiéroglyphique.
- Le jeu de papier. Le logo du Pays de Figeac se compose de lettres découpées colorées. Ce principe est repris sur des boutons spécifiques et autres petits
éléments.
- La photographie. La photographie est utilisée de façon prédominante à la fois sur la page d'accueil (header flash) et dans les arrières plans des pages du site.
Le choix des images est très important, il faut y voir plusieurs usages :
• les grands fonds d'images sont choisis pour évoquer les grandes thématiques. Le visuel doit tendre à l'abstraction pour susciter la curiosité et le mystère qui
sont les axes de communication principaux du Pays de Figeac.
• A contrario les photos utilisées dans le contenu, mettent en évidence des scènes de la vie touristique du Pays de Figeac.
Visiter Bouger Deguster Séjourner
Pictogrammes :
la couleur de fond change selon la rubrique.
Visiter Bouger Deguster Séjourner
Puces associées aux liens
Puces des listes :
la couleur de fond change seulon la rubrique. Boutons
Les boutons
15
17. Le site enfants
1 Un univers original basé sur l'illustration à été
spécialement crée pour les enfants
1 Header en flash avec la navigation principale composée de
trois entrées.
2 Nouvelles entrées avec pictos associés
3
3 Zone d'actualités
2
4 Stickers
4
5 Pied de page présent sur tout le site, regroupant des outils,
infos pratiques... etc
5
16
