Try   HackMD

Infonum Techniques d'écriture et d'édition - TP EPUB

Téléchargement Sigil : (déjà installé sur les machines de l'IUT)

Manuel de fabrication EPUB : https://fr.flossmanuals.net/creer-un-epub/introduction/ Revenez systématiquement ici si vous avez un doute.

Étapes du travail

Voici les étapes. Pour ce premier exercice, certaines sont déjà faites (certaines corrections orthotypo, le balisage sémantique). Il vous faut faire les autres étapes.

1/ Sélection du contenu : texte, images, etc.

Pour les polices. Un palmarès des meilleures polices à empattement pour la lecture : https://poliseuse.wordpress.com/les-polices/palmares-des-polices-serifs/. Alegreya, Andada, Bitter, EB Garamond, Faustina, Manuale, Merriweather, Noticia Text, Vollkorn.

2/ Préparation de copie :

  • Corrections orthotypographiques. Concerne les caractères : lettres, ponctuation (dont espaces).
  • Balisage sémantique. Concerne la typologie des éléments du contenu : titres, listes, emphase, etc.
  • Balisage de mise en forme. Concerne les éléments HTML non sémantiques : retours à la ligne <br />, divs et spans auxquels on applique des classes CSS, etc.

Mise en page (pour commencer) :

  • Organisation de la page
  • Typographie (polices, tailles, interligne, marges, alignement, césures, sauts de page)
  • Listes

Assemblage : inclusion des différents fichiers, fonctionnalités EPUB (métadonnées, table des matières).

  • Utilisez la fonction « Scinder au curseur » pour séparer le fichier courant en deux.
  • Les propriétés des métadonnées se basent sur des vocabulaires contrôlés. Les rôles opf:role par exemple utilisent un code à trois lettres (auteur aut, book designer bkd, etc.) défini ici : https://www.loc.gov/marc/relators/relaterm.html

Exercices

Utilisez le contenu de Cyrano.xhtml (dans "/communs-enseignement/enseignement-ino/PERRET/") pour en faire un livre au format EPUB 3 avec Sigil. Dans Sigil, "Ouvrir" ouvre des fichiers EPUB. Pour ajouter du contenu (fichier texte xhtml, feuille de style CSS, etc.) au contenu du fichier EPUB, utilisez "Ajouter fichiers existants".

Découpage du texte :

En utilisant la fonction Scinder le fichier, découpez le texte en plusieurs fichiers xhtml contenant un acte chacun.

Espace insécables :

Avec une expression régulière, remplacez tous les espaces avant des deux-points :, après un guillemet ouvrant « et avant un guillemet fermant », par la chaîne de caractères &#160; (espace insécable).

Solution :

Avec une expression régulière, remplacez tous les espaces avant des points-virgules ;, des points d'interrogation ? et des points d'exclamation ! par la chaîne de caractères &#8201; (espace insécable fine).

Solution :

Mise en forme :

Rappel : pour vos interrogations sur CSS, n'utilisez que des sources fiables telles que W3Schools ou Mozilla Developer Network.

Définissez des styles pour les choses suivantes :

  • Organisation de la page
  • Typographie : polices, tailles de police, interligne, marges, alignement, césures, sauts de page)
  • Listes

Chaque réplique est énoncée par un personnage dont le nom est déjà balisé par un span. Mettez ce nom en petites majuscules. Il faudra trouver la propriété CSS en question, et utiliser une expression régulière pour l'appliquer facilement.

Ajouter des polices :
https://fr.flossmanuals.net/creer-un-epub/ajouter-des-fontes/

Table des matières :

Faites en sorte que la table des matières permette d'accéder aux Actes (niveau 1) et aux Scènes (niveau 2).

Métadonnées :

Renseignez les métadonnées dont vous disposez : titre, auteur.

Créditez-vous comme contributeur. Vous pouvez préciser votre rôle via un attribut (Sigil appelle cela une propriété de métadonnée). La liste des rôles est ici : https://www.loc.gov/marc/relators/relaterm.html

Couverture :

Créez une image de couverture avec les outils de votre choix.

Ajoutez-la à l'EPUB via Sigil :
https://fr.flossmanuals.net/creer-un-epub/ajouter-des-images/ "Ajouter une couverture"

Last changed by 
 
Arthur Perret
0
525

Read more

Partie 2

Quam ex ut rutrum euismod duis volutpat ad neque justo dui, habitasse dolor vestibulum ultricies vivamus senectus leo cursus morbi, purus lectus fames vehicula sed sagittis urna augue at, natoque torquent nisi mattis et integer finibus metus eleifend. Morbi varius aliquet elementum sagittis porttitor eros volutpat convallis porta, facilisi cursus id sem himenaeos parturient mollis etiam diam, platea fermentum neque lectus dapibus turpis nisi maximus, nascetur tempus ex nibh velit torquent penatibus lorem. Phasellus tristique curae hac nullam luctus taciti porta enim per dui, faucibus vel class platea risus dictumst morbi sed laoreet, natoque felis sollicitudin dolor nulla amet volutpat facilisis fusce, magnis interdum commodo fringilla eget mattis lobortis lacus himenaeos. Ligula inceptos rhoncus nam primis quisque aptent conubia senectus, odio elit euismod dolor vivamus facilisis suspendisse morbi, commodo ante fermentum urna ridiculus non fringilla posuere purus, enim faucibus suscipit eleifend vehicula eu lorem. Turpis curabitur scelerisque vivamus platea fermentum nisl mus curae eros, ligula nec aptent arcu est ornare amet porttitor fusce, pharetra phasellus habitasse odio dui ac ante leo ex, diam congue ut nostra luctus praesent condimentum porta. Per auctor fermentum platea quisque primis litora in accumsan, sem taciti dolor vitae aenean magna augue diam, montes conubia himenaeos class mauris mollis quis etiam nulla, cursus curabitur ornare turpis viverra nullam feugiat. Intertitre Gravida erat cursus augue urna dui ex ac nisl, sagittis velit nibh elementum suscipit condimentum ultrices potenti sociosqu, mi hac ultricies curabitur fames dapibus molestie integer habitasse, vehicula aptent facilisi sed quam lacinia arcu. Ullamcorper porttitor conubia maximus mus vitae inceptos varius curabitur duis, class dui leo sodales eleifend lacus dignissim fringilla nunc, praesent scelerisque maecenas suspendisse sem consectetur sit hac, ut litora vulputate lorem at aptent bibendum urna. Himenaeos elementum class leo neque lobortis tincidunt imperdiet mus, curabitur ligula dictumst molestie odio pulvinar nisl nulla, diam facilisis duis tortor adipiscing eros potenti lacinia, vestibulum quis placerat aenean ex efficitur tempor.

Jun 18, 2022
Partie 1

Blandit cursus taciti ornare nulla torquent dolor montes senectus laoreet, suscipit vel condimentum hendrerit imperdiet vehicula cubilia inceptos faucibus, posuere velit pellentesque id viverra parturient leo ante, at auctor donec lobortis urna bibendum aptent fermentum. Dui dictum taciti parturient habitasse pellentesque venenatis maecenas nunc donec, curabitur leo finibus facilisis hendrerit velit magnis ornare augue, lorem gravida phasellus per dis nec praesent tempus, id quam efficitur tempor duis congue inceptos commodo. Ut elit eros pharetra nec imperdiet habitasse magna aliquam mi, curae sollicitudin nibh conubia vestibulum donec mollis magnis at, quis fusce purus massa integer urna volutpat vivamus euismod, vehicula ligula platea sit tellus arcu dignissim inceptos.[^1] In auctor varius odio primis porttitor sagittis hac nibh, magna platea pellentesque velit quisque tempus pulvinar pharetra congue, condimentum tortor elit nascetur sodales blandit fringilla semper risus, integer arcu nisl parturient et penatibus etiam. Penatibus suscipit dapibus tortor ridiculus convallis mi quisque aptent, netus cursus quis in nunc quam natoque lobortis, sociosqu placerat rutrum leo mattis ultrices pulvinar taciti, ad vivamus nostra nisl inceptos ligula habitasse. Etiam sollicitudin sed enim at eros senectus maecenas scelerisque, suscipit erat vivamus mus quis tincidunt venenatis nisl parturient, vitae ac pellentesque lacus euismod sapien nostra volutpat morbi, elementum proin finibus id primis fames sit. Une r&#xE9;f&#xE9;rence. Taciti fames non pretium pellentesque laoreet imperdiet eros porta iaculis posuere, diam tristique sed convallis arcu vitae mollis magnis lacus, nunc donec at urna tincidunt ipsum ultricies efficitur lacinia, vehicula congue maecenas mauris elementum cras erat ac nec. Eleifend iaculis mauris ad nisl sed odio eget vulputate, tempus habitasse tempor sollicitudin dignissim sem et amet hendrerit, eros ultrices nulla aptent porta enim maximus consectetur dis, metus dapibus leo ex vitae vivamus tortor. Facilisis maecenas mi quisque convallis adipiscing consectetur aliquam et, vitae condimentum tristique felis quam tempus nunc finibus risus, feugiat morbi arcu class habitasse scelerisque rhoncus ex dignissim, potenti litora id suspendisse inceptos dictum curae. Parturient malesuada vitae habitasse egestas tristique felis mi ut venenatis, interdum diam facilisis iaculis taciti luctus pretium fusce gravida, orci et odio posuere dictumst augue fermentum euismod, molestie mauris amet mollis ullamcorper aliquet nisi mattis. Intertitre Lien vers le terme de donn&#xE9;e dans le glossaire.

Apr 7, 2022
Bibliographie commentée

Consignes Une r&#xE9;f&#xE9;rence Structure et mise en forme Voici une mani&#xE8;re de structurer et pr&#xE9;senter la bibliographie comment&#xE9;e. On utilise la liste de d&#xE9;finitions (definition list), qui est une liste de termes avec leurs d&#xE9;finitions/descriptions. En HTML, cela correspond &#xE0; l&apos;&#xE9;l&#xE9;ment dl (liste), qui contient des &#xE9;l&#xE9;ments dt (termes) et dd (descriptions). Pour cr&#xE9;er une telle liste en Markdown, on &#xE9;crit un terme sur une nouvelle ligne, puis, sur la ligne suivante, deux-points suivi d&apos;un espace puis de la d&#xE9;finition/description. Premier terme : La d&#xE9;finition du premier terme. Second terme

Apr 7, 2022
LIVRE WEB INFONUM

Ce livre web HackMD sert de d&#xE9;mo &#xE0; la fonctionnalit&#xE9; "Book Mode" propos&#xE9;e dans le menu Partage (en haut &#xE0; droite de l&apos;interface). Attention : Book Mode ne fonctionne que si vous avez cr&#xE9;&#xE9; un fichier qui sert de "colonne vert&#xE9;brale", et qui contient les liens vers les diff&#xE9;rentes parties, comme indiqu&#xE9; dans le Tutoriel livre web HackMD. Cette "colonne vert&#xE9;brale" ne s&apos;affiche pas &#xE0; la lecture : elle n&apos;est l&#xE0; que pour faire tenir ensemble tous les fichiers dans un certain ordre. Le fichier intitul&#xE9; "Pr&#xE9;sentation" que vous &#xEA;tes en train de lire n&apos;est pas le fichier "colonne vert&#xE9;brale" : c&apos;est un fichier de contenu, en l&apos;occurrence c&apos;est le premier de la liste, et donc c&apos;est celui qui s&apos;affiche quand on affiche le livre. Pour voir le fichier "colonne vert&#xE9;brale" de ce livre web, cliquez ici. Voici quelques paragraphes pour vous aider &#xE0; comprendre comment ajouter des styles &#xE0; votre livre (personnalisation facultative). 1. Titre de partie Paragraphe de pr&#xE9;sentation. La mise en forme de ce paragraphe est modifi&#xE9;e par des s&#xE9;lecteurs CSS (ligne 3) et le paragraphe lui-m&#xEA;me reste en Markdown, donc on peut utiliser la syntaxe directement. Par exemple mettre un mot en gras.

Apr 7, 2022
Read more from Arthur Perret
Published on HackMD