Remerciez-le!

Remerciez @Admin pour avoir partagé cet document gratuitement, de la manière la plus simple, en partageant sur les réseaux sociaux.

e - s i d o c décembre 2011 1 Sarah Bemer & Priscilla Mommessin accompagnement

e - s i d o c décembre 2011 1 Sarah Bemer & Priscilla Mommessin accompagnement BCDI/E-sidoc Orléans-Tours L e r e c o u r s à N V U n ’ e s t a b s o l u m e n t p a s i n d i s p e n s a b l e p o u r r é d i g e r u n a r t i c l e s o u s e - s i d o c . C e l o g i c i e l e s t p r o p o s é , i c i , c o m m e o u t i l d e f o r m a t i o n p o u r c e u x q u i s o u h a i t e s e f a m i l i a r i s e r a v e c l e c o d e H T M L . Q u ’ e s t - c e q u e c ’ e s t ? Le HTML (« HyperText Mark-Up Language ») est un langage dit de « marquage » (de « structuration » ou de « balisage ») dont le rôle est de formaliser l'écriture d'un document avec des balises de formatage. Les balises indiquent au navigateur comment afficher le contenu de la page. (mise en valeur des paragraphes, titre de la page, titre d'une partie, d'une sous-partie, caractères en gras, retour à la ligne, etc) et quels sont les liens qu'il établit avec d'autres documents. Balises Utilisation <html>Texte</html> Obligatoire au début et à la fin du fichier HTML <h1>Texte</h1> <h2>Texte</h2> <h6>Texte</h6> Titre de niveau 1, 2 et 6 <i> Texte </i> Texte en italique <strong> Texte </strong> ou <b>Texte</b> Texte en gras <u>Texte </u> Texte souligné <font face="Police de caractère">Texte</font> exemple : <font face="Arial">Texte</font> Spécifie la police de caractères <font color="couleur">Texte</font> ou <font color=#RRVVBB>Texte</font> exemples : <font color="brown"> Texte </font> ou <font color=#330000>Texte</font> Spécifie la couleur de la police (nom de la couleur en anglais ou paramétrage de la couleur en hexadécimal (voir http://www.code-couleur.net/) <font size=4>Texte</font> Spécifie la taille de la police, valeur allant de 1 à 7. Ces tailles peuvent varier suivant le navigateur. Il est possible de modifier ces valeurs de façon relative : La valeur "+1" indique une augmentation de la police à la taille supérieure. Les tailles varient de 1 à 7. <font face="Comic Sans MS" color="brown" size=4>Texte</font> Combinaison des 3 balises précédentes : spécifie la police de caractères, la couleur et la taille <center>Texte</center> ou <p align="center">Texte</p> Centrer le texte d'un titre ou d'un paragraphe <p align="justify">Texte</p> Justifier un paragraphe <br> Saut de ligne <hr> Barre horizontale <hr color="couleur"> Barre horizontale de couleur Ces balises fonctionnent par paire, l'une définit le début d'un bloc et l'autre la fin. Remarquez que ces deux balises ne se différencient que par un slash "/" mais il est indispensable. Par exemple, le titre d'une page est codé grâce à la balise <title>, et ce de la manière suivante dans votre éditeur de texte : <title>Ceci sera le titre de la page</title>. h t t p : / / j l o r e n n e . n e t / i n i t i a t i o n - h t m l . p h p L e l a n g a g e H T M L : m i s e e n p a g e d ’ u n a r t i c l e a v e c N v u e - s i d o c décembre 2011 2 Sarah Bemer & Priscilla Mommessin accompagnement BCDI/E-sidoc Orléans-Tours A q u o i ç a s e r t : l’exemple d’un article publié avec le CMS d’e-sidoc et mis en page avec NVU Posséder quelques rudiments d’HTML permet de mieux maîtriser la rédaction des articles dans le CMS d’ E-sidoc. Notamment quand il s’agit d’intégrer des documents hébergés. Le logiciel libre Nvu (prononcez n-view) qui propose un éditeur de page graphique, du type WYSIWYG peut être d’une aide précieuse pour s’initier à ce langage et peut être utilisé pour mettre en page un article. C o m m e n t p r o c é d e r Il faut au préalable télécharger et installer Nvu. On prépare ensuite la mise en page en mode normal puis on copie, en mode source, le code HTML obtenu. En affichage normal, apparaît à l’écran la page html telle qu’elle sera vue par un usager. (exception faite des cadres roses qui seront invisibles) En affichage Source, il faut copier le code contenu entre les balises qui déterminent le corps de la page : <body> et </body> e - s i d o c décembre 2011 3 Sarah Bemer & Priscilla Mommessin accompagnement BCDI/E-sidoc Orléans-Tours Il faut ensuite, sous E-sidoc, coller ce code source dans l’éditeur de source HTML. Pour obtenir , en mode rédaction d’ e-sidoc puis en affichage final avec vignette uploads/s3/ html-pour-article-e-sidoc.pdf