Aide à la rédaction & Charte Graphique

Transcription

1 Aide à la rédaction & Charte Graphique v.0 06/05 Table des matières Comment écrire un article?... Conseils pour la rédaction... o Les menus... o Les caractères (police, couleur, typographie)... 4 o Les images... 5 o Les liens... 7 o Les pièces jointes... 8 o Les tableaux... 0 o Les vidéos... o Les diaporamas... Comment écrire un article? En mode connecté, il suffit de se placer sur la rubrique ou la sous rubrique dans laquelle on souhaite publier (), de cliquer sur la boite à outil () et de sélectionner créer une page (). Page sur

2 On a alors la fenêtre suivante : Saisir un titre (). Saisir votre article () > voir conseils à suivre. Valider (). L article est alors consultable en ligne instantanément. Page sur

3 Conseils pour la rédaction o Les menus Les principales fonctions sont : Edition en pleine page. Très pratique, ce bouton fonctionne comme une bascule. Il faut cliquer dessus pour passer du mode réduit à pleine page et inversement. Outils de mise en forme Gras, italique, souligné, indice, exposant, couleur de police, type de police, taille de police Numérotation, puces Alignement Pour des raisons de lisibilité, éviter l alignement «justifié» (le dernier à droite). Lien Ajouter, supprimer, ancre. Le lien peut pointer vers un site web, une adresse mail, un page e-lyco,. Image > voir conseils spécifiques ci-après. Animation, vidéo > voir conseils spécifiques ci-après. Tableau > voir conseils spécifiques ci-après. Code source Ce bouton fonctionne comme une bascule. Il permet d insérer du code. Un code simple, qui peut se révéler pratique : <hr/> permet d insérer une ligne de séparation. Page sur

4 o Les caractères (police, couleur, typographie) Afin d assurer une cohérence sur notre site, la charte actuelle recommande : Police de caractères Taille de caractères Les couleurs de rédaction fréquemment utilisées sont : - Le gris foncé (dernière colonne première ligne de la palette) - Le gris clair (dernière colonne troisième ligne de la palette) Attention, les typographiques sont faits pour donner du sens à votre publication! On utilisera de préférence Gras - pour les titres de chapitre, section... - pour attirer l'œil, notamment pour indiquer la structuration d'un texte (titres de chapitre, de section, sous-section...) Italique - pour marquer les différences : mots étrangers, emphase (mise en évidence), - pour les noms d'œuvres (titres de livres et de revues dans les références bibliographiques) Souligné - à éviter, pour ne pas créer de confusion avec le soulignement des liens hypertexte Accent - capitales à accentuer, car en français, l'accent a pleine valeur orthographique Majuscule - pour la lettre initiale d'une phrase ou d'un nom propre - à utiliser avec modération, écrire un mot ou une phrase entière en majuscule n est pas lisible. Page 4 sur

5 o Les images Un visuel permet d agrémenter un article, il ne faut donc pas s en priver. Pour cela, il suffit de cliquer sur le bouton «insertion d image» la fenêtre suivante s ouvre : Cliquer sur le bouton «parcourir» () et rechercher l image à insérer. Les formats reconnus sont : jpeg, gif, png. 4 Compléter les champs «titre» () et «Légende» (). Le texte contenu dans les champs sera transcrit de façon audible par des outils d accessibilité pour des personnes ayant des déficiences visuelles. Cocher «conserver la taille d origine» (). Les traitements proposés donnent parfois une visualisation hasardeuse de l image lors de la publication. Cliquer sur le bouton «enregistrer» (4), la fenêtre suivante s ouvre. Page 5 sur

6 4 On peut alors définir : La largeur de l image (), la hauteur étant proportionnelle se recalcule automatiquement Attention, les largeurs maximales de publication sont imposées! Si on ne respecte pas ces largeurs, l utilisateur ne verra pas l intégralité de l image et il aura une barre de défilement horizontale Article sans encadré Article avec encadré Encadré 800 pixels maxi 650 pixels maxi La largeur de la bordure autour de l image (). Si l on ne souhaite pas de bordure, mettre «0». Les espacements horizontaux et verticaux () entre l image et le texte. Le type d alignement (4) du texte par rapport à l image. Une visualisation du rendu apparait dans la fenêtre à droite. Il ne reste plus qu à valider. Page 6 sur

7 o Les liens Pour insérer un lien, après avoir sélectionné l objet qui fera le lien (texte, image, ) il suffit de cliquer sur le bouton «lien» la fenêtre suivante s ouvre : Choisir alors : Le type de lien () URL = site web = ouverture d un mail dans un logiciel de courrier Contenu = page du site e-lyco Pour un lien de type URL, saisir () alors l adresse du site (sans le puis valider (). Pour un lien de type , saisir l adresse (4), le sujet de mail (5) et éventuellement un partie du corps du message (6), puis valider (7) Pour un lien de type Contenu, il suffit de rechercher votre contenu (articles) dans l arborescence e-lyco, puis de valider. Astuce : On peut remplacer un lien de type «contenu» par un lien de type «URL». Page 7 sur

8 o Les pièces jointes Pour insérer une pièce jointe, il suffit de cliquer sur «ajouter une pièce jointe» (). Il reste alors à rechercher le fichier à joindre (), saisir un titre (), une légende (4). 4 5 Puis cliquer sur «enregistrer» (5). Page 8 sur

9 En cours de publication, les pièces jointes s ajoutent en dessous de l article (). Après publication, les pièces jointes apparaissent dans un encadré à droite de l article (). A propos des pièces jointes Il est important que le lecteur puisse ouvrir facilement les documents sans avoir à installer un logiciel spécifique, une visionneuse. Par ailleurs, dans la majorité des cas, il ne doit pas pouvoir modifier les documents (sauf document de travail, par exemple, un exercice pour les élèves, un questionnaire). Afin de répondre à ces exigences, l usage du format PDF est recommandé. Page 9 sur

10 o Les tableaux Un tableau est un partage de l espace de l article en cellule. Chaque cellule pouvant accueillir du texte, des images, des liens, Pour insérer un tableau, il suffit de cliquer sur On peut alors saisir : - Le nombre de lignes () - Le nombre de colonnes () - La largeur des bordures (). Si on ne souhaite pas de bordure, mettre «0». - Le type d alignement (4) dans les cellules. - Le titre du tableau (5). - La largeur du tableau (6) et éventuellement la hauteur Concernant la largeur du tableau, celle-ci est définie en pixel. Nous avons les mêmes limitations que pour les images, à savoir : Pour un article sans encadré Pour un article avec encadré largeur maximale 800 pixels largeur maximale 650 pixels Page 0 sur

11 o Les vidéos Incontournable du multimédia, les vidéos sont souvent à l origine de soucis pour le visiteur : - Problèmes de lecteur Il existe de très nombreux formats de vidéo (wmv, mpep, mov, avi, divx, ) et les algorithmes de compression évoluant rapidement, les mises à jour (codec) doivent être régulières. - Problème de lenteur Les fichiers vidéo sont généralement très volumineux et les temps de chargement et d attente sont parfois insupportables. Pour pallier à ces désagréments, un format s impose : le format FLV ou SWF ( flash video ). Ce format a l'avantage d être lu par la grande majorité des navigateurs et permet de réduire la taille des fichiers et donc les temps d attente. Pour insérer une vidéo, il suffit de cliquer sur Cliquer sur le bouton «parcourir» () et rechercher la vidéo à insérer. 4 Compléter les champs «titre» () et «légende» (), puis cliquer sur «enregistrer» (4). Dans la fenêtre suivante, il reste alors à définir la largeur et la hauteur de la vidéo (5). Pour un article sans encadré, le compromis maximal sur la taille est largeur 640 x hauteur 480. Attention, l ajustement de taille ne conserve pas la proportion largeur / hauteur! 5 Page sur

12 Afin de préparer en amont vos vidéos et de les mettre au format FLV ou SWF en 640 x 480, vous pouvez utiliser le logiciel : Format Factory Ce logiciel permet très simplement des conversions de fichiers image, audio, vidéo, Vous trouverez ce logiciel ici : o Les diaporamas Pour l insertion de diaporama (powerpoint, open office), afin d éviter l utilisateur à avoir la bonne visionneuse, voir la bonne version de visionneuse, le plus simple est de convertir les diaporamas au format FLV, ou éventuellement au format PDF. Le format FLV permet de conserver les animations. Pour assurer cette conversion, vous pouvez vous servir d un des logiciels suivants (version gratuite) : Page sur