Ligne graphique web UNIL

Transcription

1 Ligne graphique web UNIL pour les sites web institutionnels Jahia Centre informatique UNIL - version octobre Principe de fonctionnement général 2

2 Ligne graphique 1er niveau menu: max. 11 pages page d'accueil max. 11 pages nombre illimité de pages max. 11 pages 3 En option, menu en 2 parties (2 couleurs) exemple: page d'accueil accès institutionnels accès guidés 4

3 Eléments optionnels sans aucune option avec toutes les options 5 actualités événements réseaux sociaux à découvrir options "texte + image" et "visibilité sur toutes les pages" super liens boîtes multi-usages (texte, fichiers, liens, RSS) 6

4 image fixe ou diaporama: 589 x 230 px Taille des éléments visuels page d'accueil video: hauteur max. 230 px image "à découvrir": largeur 190 px vignette "actualités": 51 x 68 px 7 page de contenu image ou vidéo dans contenu principal: largeur max. 573 px image dans contenu latéral: largeur max. 190 px dans une galerie d'images: taille non limitée 8

5 Pages "outils" - contact (avec formulaire pour écrire au webmaster) - annuaires - plan du site (anciennement "site map") - informations légales (copyright + "disclaimer") - impressum - font partie de la ligne graphique - leur contenu de base peut être complété - lien édition (uniquement pour éditer le site, utiliser autres liens pour login intranet) 9 Boîtes de contenu : principes et exemples 10

6 Imbrication: site > pages > boîtes > éléments 1. site composé de pages 2. pages composées de boîtes de contenu 3. boîtes de contenu composées d'éléments UNIL titre texte document 11 Boîtes de contenu - contenu standard - tableau - galerie d images - flux RSS - liste dynamique - vidéo - liste avec présentation - contenu standard - flux RSS - liste dynamique contenu principal contenu latéral 12

7 Boîte "contenu standard" la boîte la plus polyvalente et de très loin la plus utilisée elle peut contenir: - texte avec mise en forme, liens et images - documents 13 Boîte "tableau" permet de créer des tableaux de 1 à 3 colonnes chaque cellule peut contenir du texte, un document ou un lien dans certains cas (plus de 3 colonnes, ajout d'images, etc.), l'éditeur de tableaux de la boîte de contenu standard peut dépanner 14

8 Boîte "liste avec présentation" affichage "onglets" affichage "FAQ" (foire aux questions) 15 Boîte "galerie" affichage des images sous forme de vignettes cliquables le clic sur une vignette affiche le format original de l'image 16

9 Boîte "vidéo" affichage d'une vidéo hébergée à l'unil (serveur HVA) ou hors UNIL (YouTube, Vimeo, Dailymotion) l'hébergeur de la vidéo fournit le code source pour l'intégration dans un autre site => copier/coller dans Jahia 17 Boîte "composants avancés UNIL" affichage dynamique des données d'unisciences, pour un département, un groupe ou une personne option possible: affichage dynamique des publications uniquement 18

10 Boîte "liste dynamique" sur les pages "de transition", permet de répéter le sous-menu dans la zone de contenu, afin d'éviter qu'elle ne soit vide l'affichage se met à jour dynamiquement si le sous-menu est modifié 19 Boîte "flux RSS/Atom" affichage des actualités d'autre sites publiées sous forme de flux dynamique le clic sur un lien affiche l'actualité sur son site d'origine 20

11 Couleurs (mise à jour octobre 2015) 21 Couleurs Il existe 13 variantes de couleurs : 1 pour les sites de la Direction et des services centraux de l'unil 7 pour les 7 facultés et leurs unités 5 options possibles pour les sites interfacultaires ou interinstitutionnels (=non liés à une seule faculté) 22

12 Sites centraux + sites des facultés et de leurs unités 23 Sites interfacultaires ou interinstitutionnels 5 options de couleurs possibles: pour les sites sans logo institutionnel, 3 images d'en-tête à choix: 24

13 Jusqu'en octobre 2015: 2 couleurs dans le menu Dès octobre 2015: 1 couleur dans le menu, avec le gris comme complémentaire 25 Dès octobre 2015: titres de publications en bleu UNIL pour tous les sites bleu UNIL 26

14 Dès octobre 2015: dans les pages avec sommaire, entrée du sommaire et liens de retour en gris pour tous les sites gris 27 Aide et documentation informations générales sur l'offre web du Ci: documentation Jahia 6.6: hotline: 28