Titres et styles

Dans le but d'avoir une charte graphique cohérente tout au long de la navigation, votre site internet utilise une palette restreinte de styles appliqués à son contenu. Le style "Titre 1", visible ci-dessus, est réservé au titre de l'article (ici :"charte éditoriale"). A l'intérieur de l'article il peut y avoir un premier niveau de titre en utilisant le style "Titre 2". Ensuite letexte est écrit avec du style "Paragraphe" sans être justifié.Si on a encore des sous-titre, on va utiliser du "Titre 3" puis du "Titre 4". "Titre 6" est réservé aux notes (ce style est plus petit que "paragraphe").

Les titres ne doivent pas comporter la ponctuation finale ":" ni "."

 

Longueurs

Un article se compose d'un texte, d'image(s) pour agrémenter le texte, de documents téléchargeables et de liens. Les internautes veulent une information rapide et souvent assez courte. Un texte d'article est en général limité à 1500 caractères ou 1 page word. Les articles sont décomposés en paragraphes ( 200 à 500 caractères). Chaque paragraphe doit être précédé d'un titre de paragraphe. (en typo titre 2)

 

Images

Les images sont en .jpg, .png ou .gif. Limiter la taille du fichier à 800 pxl comme dimension maximale (classiquement 400 pixels), avec une qualité de 72 DPI, compression 80%.

Affichage :

  • Image en paysage :
  • Largeur conseillée 40 %
  • avec un alignement droit,
  • une marge gauche de 10 pixels
  • une marge basse de 5 pixels.

Si l'image est en portrait, une largeur de 30% peut être préférable.

Titres :

Les titres des images doivent correspondre à la description de l'image car ils seront lus et référencés.
Si on décide d'intégrer une grande image ou un tableau, la largeur maximale pourra être de 100% mais 80% en alignement centré est plutôt conseillé.

Dimensions spécifiques d'images :

Les images du "A la Une" du carrousel en page d'accueil doivent faire 250 x 355 pixels. Ces images sont les images d'introduction des articles.

Les images des actus en page d'accueil doivent faire 420 x 290 pixels. Ces images sont les images premières images des articles.

L'image d'illustration du magazine en page d'accueil fait 98 x137 pixels et se trouve dans image/accueil/ottmag.png. Ce fichier doit être modifié pour modifier l'mage. est l'image d'introduction du dernier article de la catégorie "publication"

Les images du bandeau haut se trouvent dans le module diaporama et doivent faire au moins 1920 pixels de larges et au moins 472 pixels de haut.

L''image de l'événement mis en avant à gauche de "en 1 clic" sur la page d'accueil doit faire 200 x 135 pixels. Cette image est celle d'introduction de l'article.

L'image des menus se trouve liée via l'onglet de chaque menu "maximenu CK style - état normal" et doit faire 90 x 60 pixels.

L'image d'introduction des articles dans les blogs de catégorie doit faire 217x164 pixels

L'image de bandeau des articles doit faire 825x280 pixels

Les images de l'album photo sont en 800x533 pixels. Le diaporama s'adapte automatiquement à d'autres tailles.

La taille des images des événements ICagenda est libre, mais un format paysage est préféré, de largeur comprise entre 750 et 250 pixels.

Liens

Lorsque vous creez un lien, un style prédéfinit s'applique. Les liens peuvent pointer vers :

  • un site externe
  • un article interne au site
  • une image, un document
  • un formulaire
  • un envoi d'email...

Un lien vers un site externe ou vers un document doit s'ouvrir dans une nouvelle fenêtre. L'adresse du lien peut être cachée si elle ne présente pas d'intérêt ou être montrée si on souhaite proposer à l'internaute de la mémoriser. Le titre du lien doit être renseigné car il apparait au survol par la souris.

Tableaux

Titre 5 Tableaux
Les tableaux sont de largeurs automatique, avec une bordure extérieure de 1 pi, une marge intérieure des cellules de 5 pi et un titre en "Titre 5".
Les bordures ainsi que le fond des cases titres sont de couleur
Les textes peuvent être centrés ou en alignement gauche, le justifié est déconseillé
Des tableaux de style libre (sans bordures) peuvent également être utilisés pour aligner des contenus
 
 

Adresses mail

Le lien vers une adresse mail doit être caché et un lien vers une fiche de contact préalablement crée doit être fait sur l'expression "Envoyer un e-mail" avec au survol "Fiche contact".

Sauts de ligne

Chaque nouveau titre 2 est précédé d'un saut de ligne, sauf si ce titre est le premier de l'article. Cette règle peut être enfreinte si les contenus sont très courts et qu'un saut de ligne casserait la cohésion du contenu. Il n'y a pas de saut de ligne avant les titres 3 ou titres 4.

Chaque tableau est encadré par un saut de ligne.

Ces sauts de ligne doivent être réalisés en style paragraphe.

Un retour à la ligne sépare chaque paragraphe.
Un retour à la ligne sans espace (maj + entrée) peut être préféré pour augmenter la cohésion entre 2 informations consécutives (énumérations, adresse postale...).

Les couleurs de la charte graphique sont

  #DD001D
  #010101
  #5C5B5B
  #454B50
  #ACACAC
  #D6D5D5