CHARTE WEB de l`université Paris 8

Transcription

CHARTE WEB de l`université Paris 8
CHARTE WEB
de l'université Paris 8
PRINCIPE DE CONSTRUCTION DU BANDEAU D'ACCUEIL POUR LES SITES DE PARIS 8
MODULE HORIZONTAL
MODULE VERTICAL
CELLULE HOMOTETIQUE 1
PRINCIPE DES COULEURS : 3 dégradés de 3 tons qui se croisent
2 cas possibles :
1 : Exemple de bandeau avec un dessin vectoriel
2
2 - Exemple de bandeau avec une photo
HARMONIES DE COULEUR : camaieux...
HARMONIES DE COULEUR : mixtes....
3
PRÉSENTATION GENERALE - TYPE DU SITE :
Présentation et disposition des éléments obligatoires : A- le haut de page
Mentions obligatoires figurant sur le haut de page
-Accessibilité (Politique d'accessibilité et fonctionnalités du site)
-Site de la bibliothèque (Lien vers http://www.bu.univ-paris8.fr/)
-Site de Paris 8 (Lien vers http://www.univ-paris8.fr/)
-Votre espace (Lien vers http://e-p8.univ-paris8.fr/)
4
PRÉSENTATION GENERALE - TYPE DU SITE :
Présentation et disposition des éléments obligatoires : B - le bloc central
Mentions obligatoires figurant sur le bloc central
Logo P8
Nom composante P8
Guillemets blancs
Décroché blanc
visuel (photo)
sous les bandes
couleur
transparentes
C - les menus
Menus
Sous-menus
Les menus (et éventuellement sous-menus) doivent toujours être positionnés à l'horizontale sous le bloc central
D - le pied de page
En pied de page, doivent figurer au minimum les mentions suivantes :
-les crédits
-les mentions légales
-l'adresse de Paris 8
5
E - les boutons
Reprise d'une couleur
d'accompagnement (descendue)
du bloc central
(ici jaune -beige) couleur : Reprise
de la tonalité
majeure
du bloc central (ici violette) Ce signe + indique
que le "menu" est plié
le signe - indique
que le "menu" est déplié
Les boutons du menu vertical se déclineront selon le modèle ci-dessus.
6
F - les dimensions
Pour la largeur du site, on se limite à une largeur maximale lorsque l'écran est grand
et à une largeur minimale lorsque l'écran est réduit.
Ce qui donne en CSS 2 :
div {
width: 80%;
max-width: 960px;
min-width: 800px;
}
La taille des éléments se définit en pourcentage selon le cadre ci-dessous :
960 pixels
228
pixels
1%
26%
2%
70%
7
1%
G - Les polices typographiques du site
- Arial (regular et bold)
Arial Bold
Arial
CSS du texte ci dessus :
color: #000;
font: 1em Arial,sans-serif;
padding-left: 15px;
text-align: left;
8
H - Les couleurs des liens
Les couleurs des liens découlent de l'ensemble de l'ambiance du visuel principal.
Ils doivent offrir un bon contraste avec le fond de page pour un confort de lecture optimal.
Ci dessous, exemple pour le site web de l'université
lien
(couleur rouge foncé)
B50f1d
I - L'adresse URL du logo Paris 8
www.univ-paris8.fr/logo
9
lien au survol
(couleur bleu roi) 499CC8