Site internet de l`Université de Neuchâtel

Transcription

Charte graphique
Site internet de l’Université de Neuchâtel
TABLE DES MATIÈRES
INTRODUCTION
1.
MODÈLES DE PAGE ............................................................................................................................. 1
1.1
1.2
1.3
1.4
1.5
1.6
1.7
2.
COULEURS ............................................................................................................................................ 8
2.1
2.2
2.3
2.4
2.5
2.6
3.
Pages principales et administration.............................................................................................. 8
Faculté des lettres et sciences humaines .................................................................................... 9
Faculté des sciences .................................................................................................................... 9
Faculté de droit.............................................................................................................................. 9
Faculté des sciences économiques ............................................................................................. 9
Faculté de théologie...................................................................................................................... 9
TYPOGRAPHIE ...................................................................................................................................... 9
3.1
3.2
3.3
4.
Structure des pages...................................................................................................................... 2
Page d'accueil principale .............................................................................................................. 3
Page d'accueil des portails ........................................................................................................... 4
Page d'accueil des facultés .......................................................................................................... 5
Page d'accueil des instituts........................................................................................................... 6
Page d'accueil des services ......................................................................................................... 7
Page de contenu........................................................................................................................... 7
Police d'écriture............................................................................................................................. 9
Titres............................................................................................................................................ 10
Majuscules-minuscules............................................................................................................... 10
IMAGES................................................................................................................................................. 10
4.1
4.2
Dimensions conseillées d'images des pages d'accueil ............................................................. 10
Dimensions conseillées pour les images de pages de contenu ............................................... 10
Charte graphique site web -1.0 – mai 2008
I NTRODUCTION
Le site internet doit véhiculer l'image d'une université jeune, dynamique, à la pointe de la recherche et
susciter l'envie de venir y faire ses études ou d'y entreprendre des recherches. Pour cela, une charte
graphique a été définie. Elle dégage une ambiance agréable et sobre, compatible à la fois avec le sérieux
de l'institution et son cadre de vie attrayant.
La ligne graphique du site s'appuie sur la mise en place du nouveau logo typographique. Le carré qui
apparaît sur le « i » constitue un élément graphique redondant. Une déclinaison de la ligne graphique,
allant des différentes pages d'accueil (facultés, services, etc.) jusqu'aux pages de contenu, est opérée. Les
modèles de page développés doivent être utilisés à tous les niveaux du site (chapitre 1).
La charte graphique comprend également :
•
la palette des couleurs à disposition (chapitre 2)
•
la police d’écriture et d’autres éléments de typographie (chapitre 3)
•
les formats d’images (chapitre 4)
La charte graphique ainsi que le système de navigation global sont imposés à tous les niveaux du site, de
manière à ce qu'une image uniforme, sérieuse et organisée s'en dégage et qu'elle soit en adéquation avec
l'institution. La charte graphique doit être respectée pour qu'un nouveau site soit validé et mis en ligne.
1. MODÈLES DE PAGE
Afin de garantir une identité visuelle, toutes les pages du site sont construites sur une structure identique. A
partir de cette structure, des modèles intégrant la ligne graphique ont été développés pour les pages
d'accueil des sites et pour les pages de contenu.
Les pages d'accueil des sites permettent de mettre en évidence par l'image, un thème général, un projet
de recherche, un bâtiment ou un objet d'art, et de faire des changements régulièrement.
Cinq modèles de page d'accueil ont été développés :
1. UniNE home : page d'entrée du site
2. portail home: portails formation, recherche, partenaires, futur étudiant, étudiant, public et médias,
collaborateur
3. faculté home
4. institut home
5. service home
Les autres unités (laboratoires, centres de recherche, etc.) peuvent choisir parmi les modèles 2 à 5 celui
qui leur convient.
Trois modèles à choix ont également été développés pour les pages de contenu.
Charte graphique site web -1.0 – avril 2008
1
1.1
Structure des pages
Toutes les pages sont construites sur la base du modèle suivant :
Exemple: UniNE home
1.
2.
3.
4.
5.
6.
7.
En-tête du site (bandeau)
Menu déroulant (lien vers les facultés et, le cas échant, les sous-entités de l'entité courante)
Menus principaux du site (menus que l'on retrouve sur toutes les pages du site)
Menus secondaires du site (menus que l'on retrouve sur toutes les pages du site)
Menus principaux de la page (menus propres à la page)
Menus secondaires de la page (menus propres à la page)
Pied de page
2
Bandeau
Le bandeau, qui est repris sur toutes les pages du site, comprend les éléments suivants :
•
logo : permettant de revenir sur la page d'accueil (en haut à gauche)
•
menu déroulant : permettant un accès direct aux facultés, le cas échéant aux sous-entités de
l'entité courante (en bas à gauche)
•
sélecteur de langue autorisant le choix de la langue pour autant que la page soit disponible dans la
langue correspondante (en haut à droite)
•
zone des utilitaires offrant des outils transversaux par rapport au découpage du site : annuaire des
collaborateurs, plan du site, plan d'accès et informations de contact (en bas à droite)
•
barre contextuelle permettant de revenir à une étape précédente (en bas au centre)
•
moteur recherche interne permettant la recherche d'informations au moyen de mots-clés à
l'intérieur du site (en haut à droite)
Pied de page
Le pied de page, qui est repris sur toutes les pages du site, comprend les éléments suivants :
•
adresse (y c. numéro de téléphone et adresse e-mail de l'entité)
•
Impressum : lien vers la page « http://www2.unine.ch/page1227.html »
•
authentification : connexion pour modifier un site
•
le logo swissuniversity
1.2
Page d'accueil principale
La page d'accueil principale du site de l'Université comprend au minimum les éléments suivants :
•
cinq menus (à gauche) permettant une entrée par profil: futur-e étudiant-e, étudiant-e inscrit-e,
public et alumni, collaborateur-trice, médias et prospective students)
•
une partie centrale comprenant une image illustrant un thème d'actualité ou un projet de recherche
et qui est changée à une fréquence oscillant entre 1 semaine et 1 mois (une image de 430x430
pixels et un texte sur 3 lignes en bas à gauche de l'image)
•
une rubrique actualités permettant de mettre en évidence les nouvelles informations concernant
l'Université (à droite)
•
une rubrique agenda servant à annoncer les diverses manifestations, conférences ou autres
événements (à droite)
•
quelques menus utiles pour mettre en évidence certaines pages d'information (en bas à droite)
3
1.3
Page d'accueil des portails
Le titre du portail est repris sur tout le site. Il peut s'accompagner d'un logo.
La partie centrale est libre (texte et image), la partie en haut à droite permet d'insérer les rubriques agenda
et actualités, mais également du texte libre. La partie en bas à droite est pour sa part réservée à des liens
simples.
4
1.4
Page d'accueil des facultés
La page d'accueil des facultés est une déclinaison de la ligne graphique de la page d'accueil principale à la
différence près qu'un menu faculté pratique remplace les menus prévus pour les accès par profil (en bas à
gauche).
Le titre du site (dénomination officielle de la faculté) est repris sur tout le site. Il peut s'accompagner d'un
logo.
Le bandeau de chaque faculté est muni d'une couleur différente pour se repérer. L'image au centre de la
page illustre un thème assez général qui est modifié à une fréquence régulière (image de 380x380 pixels
et, si souhaité, un texte sur 3 lignes maximum en bas à gauche de l'image). La partie de droite comprend
les rubriques agenda et actualités en haut et des liens en bas.
Pour avoir une certaine cohérence dans le site, certains menus de gauche sont obligatoires :
•
Menu faculté (contenu : présentation de la Faculté pour les visiteurs externes)
o décanat (ses tâches, son organisation)
•
Menu études
o formations proposées
o plans d'études et règlements
o horaire des cours
o examens
o portails des cours (claroline)
ou, séparer ce menu en deux menus :
•
Menu offre de formation
o bachelor
o master
o etc.
et
•
Menu espace étudiant
o portails des cours (claroline)
o horaire des cours
o documents à télécharger,
5
o
etc.
•
Menu instituts et recherche (liste des instituts, laboratoires, groupes de recherche)
ou, séparer ce menu en deux menus : instituts et recherche
•
Menu faculté pratique (en bas à gauche)
o secrétariat - aspects pratiques
o bibliothèque
o association d'étudiant
o emploi
1.5
Page d'accueil des instituts
Il s'agit d'une version graphique légèrement différente de celle de la page d’accueil des facultés dans le
sens où la taille de l'image est encore réduite, laissant la place pour une description assez générale de
l'institut ou d'un projet de recherche à mettre en évidence.
Le titre du site (dénomination officielle de l'institut) est repris sur tout le site. Il peut s'accompagner d'un
logo.
La partie centrale est composée d'une image (à gauche) dont la taille conseillée est de 200x200 pixels et
d'une colonne de texte libre. La partie de droite comprend les rubriques agenda et actualités en haut et des
liens en bas.
Pour la partie de gauche, les menus ci-dessous sont proposés. Les différences structurelles et
organisationnelles entre les instituts obligent une grande souplesse de modèle. Toutefois, tous ces thèmes
doivent être abordés.
•
•
•
•
•
•
•
présentation de l’institut
enseignants / collaborateurs
formation
o présentation générale (lien avec les pages concernées du portail formation
http://www2.unine.ch/formation)
o présentation des cours
recherche
collaborations (intra et extra muros)
publications
institut pratique (en bas à gauche)
6
o
1.6
secrétariat
Page d'accueil des services
Le titre du site (dénomination officielle du service) est repris sur tout le site. Il peut s'accompagner d'un
logo.
La partie centrale accueille uniquement une image de 380x380 pixels et un texte sur 2 lignes en bas à
gauche de l'image. L'idée est d'utiliser une image centrale pour faire figurer à la fois le plan d'accès et la
photographie du bâtiment abritant le service. La partie de droite comprend les rubriques agenda et
actualités en haut et des liens en bas. La partie de gauche aborde les thèmes suivants: présentation du
service, prestations, missions et moyens.
1.7
Page de contenu
Trois modèles de page de contenu sont à choix. Ils diffèrent uniquement au niveau de la partie centrale, à
droite (en gris). Les parties en blanc ainsi que le titre du site sont toujours hérités de la page d'accueil du
site.
La partie du contenu (en gris) peut avoir 3 configurations différentes:
1 colonne (libre)
La partie contenu (gris) est constituée d'une seule colonne. Elle permet d'intégrer du texte ou des images.
7
2 colonnes (libre/libre) ou
2 colonnes (libre/menu)
La partie contenu (gris) est divisée en deux colonnes, celle de gauche étant la plus large. La colonne de
droite permet d'intégrer soit du texte et des images (2 colonnes (libre/libre)), soit une présentation qui
ressemble à un menu (2 colonnes (libre/menu)).
2. COULEURS
Conformément à l'histoire de l'institution, une couleur spécifique est attribuée à chaque faculté et à
l'administration. Seules les couleurs prévues dans la palette ci-dessous peuvent être utilisées.
2.1
Pages principales et administration
bleu
#01209F1
en-tête supérieur, menus principaux du site (en haut à gauche), menus
secondaires de la page (en bas à droite), titres
violet
#BCBEDF
en-tête inférieur
gris-bleu
#E4E5E7
menus secondaires du site (en bas à gauche), fond de cellules des tableaux
gris foncé
#A5A6A9
menus principaux de la page (en haut à droite)
1
Mode de couleur RVB
8
2.2
Faculté des lettres et sciences humaines
cian
#62ABCB
cian clair
#C7DFEC
en-tête inférieur
cian grisé
#C0DBE9
gris foncé
#A5A6A9
2.3
Faculté des sciences
vert
#6AA798
vert clair
#C9DDD7
en-tête inférieur
vert grisé
#D7E5E1
gris foncé
#A5A6A9
2.4
Faculté de droit
rouge
#B70101
rose
#FAAFAF
en-tête inférieur, menus secondaires du site (en bas à gauche), fond de
cellules des tableaux
gris foncé
#A5A6A9
2.5
Faculté des sciences économiques
#EFAB00
jaune clair
#F9DEA6
en-tête inférieur
jaune grisé
#F9DA9A
gris foncé
#A5A6A9
jaune
2.6
Faculté de théologie
rouge
#CE7686
rose
#EBCCCF
en-tête inférieur
rose grisé
#E9C5C9
gris foncé
#A5A6A9
3. TYPOGRAPHIE
3.1
Police d'écriture
La police de caractère du site est Helvetica (la famille de police est la suivante: "Helvetica, Verdana, Arial,
sans-serif"). La taille de caractère standard est de 11 pixels ; elle doit être la même sur tout le site.
9
3.2
Titres
Dans les pages, les titres sont en Helvetica avec la couleur prévue pour l’entité. La taille de caractère
(pixels) varie selon le niveau du titre :
•
•
•
•
•
•
Niveau 1 : 17 pixels, gras
Niveau 2 : 17 pixels
Les titres qui précèdent une liste de liens peuvent être mis en noir pour éviter une surcharge de couleur.
3.3
Majuscules-minuscules
Le titre du site, les titres principaux de chaque page et les menus de gauche doivent être en minuscules,
sauf lorsqu'il s'agit d'abréviations qui sont toujours en majuscules (exemple: FEN) ou de noms propres.
4. IMAGES
Afin de rendre le site attrayant, l'image tient une place prédominante: elle apparaît en grand format sur la
page d'accueil et diminue de taille au passage des niveaux suivants. A l'exception des pages d'accueil des
services où l'accent est mis sur les bâtiments et les sites universitaires, c'est l'être humain (étudiants,
chercheurs) qui domine dans l'image.
L'image doit apporter une plus-value au texte. Ainsi, on peut voir des travaux de groupes, de laboratoires
ou des excursions par exemple. En revanche, les étudiants qui potassent ou qui écoutent le professeur
(auditoire), les images de fond et les images animées sont à éviter.
4.1
•
•
•
4.2
Dimensions d'images des pages d'accueil
faculté: 380x380 pixels avec décrochage (voir photo page 5)
service : 380x380 pixels avec décrochage (voir photo page 7)
institut et autres sites: 200x200 pixels (taille conseillée)
Dimensions conseillées pour les images de pages de contenu
Image Carrée
(dimension 170x170 px)
10
Image style Portrait
Image style Portrait
Image style Paysage
11
Image style Paysage
12

Site internet de l`Université de Neuchâtel

Transcription

Documents pareils

Bonjour à tous les parents, Les services le Cheval Sautoir est fier de

MENUS DES RESTAURANTS SCOLAIRES PARIS XIX Jeudi 27

menus semaine du gout

page de garde cahier menus

Si tu pouvais changer une chose au restaurant scolaire, tu

Saumon Pôélée méridionale Veau « façon tajine aux abricots

Navarin d`agneau Epinards Carottes râpées Bio Salade de fruits

Bon cadeau restaurant musée de l`eau

Télécharger la plaquette du service de portage de repas à domicile

Formation DELPHI initiation PR0036