Archives de catégorie : publication

Créer un epub / Sigil

#1 - La structure des pages

   > Les pages d'un eBook sont des pages web rédigées en HTML.
Le HTML (Hypertext Markup Language ), est un language de balisage permettant d'écrire de l'hypertext ( texte structuré en noeuds liés par des hyperliens ) et d'être décoder et afficher dans un logiciel (navigateur).
Le fichier ePub fait ici office de navigateur autonome.
   > Chaque page est un nouveau fichier xhtml ( syntaxe html tiré du xml ); il est structuré en balises et comporte toujours 3 sections basiques:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Titre de la page</title>
</head>

<body>
<p>Texte de la page</p>
</body>

</html>

   > Le language HTML permet une mis en forme simple du texte (Gras, Italic, Souligné, exposant) et des paragraphes (Centré, ferré à droite,...).

<p style="text-align: center;"><b>Texte en gras</b> <i>Texte en italique</i></p>
#2 - La feuille de style

   > La mise en page et la mise en forme de texte avancée s'effectuent grâce à des feuilles de style rédigées en CSS ( Cascading Style Sheets ).
Les références et définition de ce langage libre et ouvert sont disponibles sur le web et notamment sur le site w3schools.

   > Les définition CSS peuvent être inclus dans une page HTML en insérant une balise dans l'entête de la page:

<head>
<title>Titre de la page</title>
<style type="text/css">
.texte1 { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; color:rgb(25, 25, 25);}
</style>
</head>

<body>
<p class="texte1">Texte mise en forme par css</p>
</body>

Il est néanmoins préférable de créer un fichier externe qui facilite les modifications globales de style. Ce fichier est lié à la page HTML en insérer dans l'entête une balise de source externe.

<head>
  <title>Titre de la Page</title>
  <link href="../Styles/main.css" rel="stylesheet" type="text/css" />
</head>

   > Un fichier css se structure par nom de style et propriétés de mise en forme, selon deux types; Balises ou Classes.
Si notre page html se présente sous la forme:

<body>
<h1>Titre 1 de texte</h1>
<p class="texte1">Texte mise en forme par la classe CSS texte1</p>

<a href="url de la page" target="_blank">Liens</a>

</body>

Notre fichier CSS correspondant pourrait contenir les définitions suivantes:

@charset "utf-8";

@font-face {font-family: "Colourbars"; src: url('../Fonts/nomdufichier.otf'); font-weight: normal / bold; font-style: normal / italic;}

body{margin:10px; padding:10px;}

h1{font-family: "Arial", Courier, monospace; border-bottom: 3px solid black; padding-bottom:15px; font-weight:800; text-align:center; font-size:2.5em; margin-bottom:15px; margin-left:auto; margin-right:auto; width:60%;}

p{font-family: "Times New Roman", Times, serif; font-size:1.2em; text-indent:20px; padding:20px;}

a{font-family: "Arial", Times, serif; font-size:1.2em; padding:20px; color:rgb(15, 15, 200)}

a:hover{font-family: "Arial", Times, serif; font-size:1.4em; padding:20px; color:rgb(15, 15, 100)}

   > Les couleurs sont renseignées soit au format HEX (ancienne spécification: #ffffff) soit par décimales des composantes rgb(255, 255, 255).
Vous pouvez retrouver les correspondances entre code et couleur dans les nuanciers des logiciels d'imagerie ou sur le web et notamment ici.

#3 - Les images

   > Les images s'insère à l'aide la balises img qui peut également être mise en forme par CSS et le fichier de l'image est stocké dans le dossier Images.

<img alt="logo_sigil_epub-editor" src="../Images/logo_sigil_epub-editor.jpeg" />
#4 - Les typographies

   > Les typos génériques tel que; Arial, Courier New, Times new roman, Lucida, Comic, Trebuchet, Tahomat, Georgia, Verdana, sont intégré de base à tous les systèmes et sont donc utilisables en natif sans manipulation particulière.
   > Les typos spécifiques nécessitent elle d'être importées dans le fichier ePub et leur utilisation restera à la discrétion de l'utilisateur.
Une fois importé dans le dossier /Fonts, elles sont disponibles en les appelant par leur nom dans les propriètés CSS d'une classe.

font-family: "Nom de la typo", Times, serif;
#5 - Les blocs de texte

   > L'eBook gère les trois blocs  <p></p>, <span></span> et <div></div>. Ils seront utilisés suivants la mise en page nécessaire.
   > La balise Paragraphe <p></p> est utilisé pour son aspect générique et sera laissée sans style pour respecter les choix de l'utilisateur. Cette balise intègre par exemple automatiquement un passage de ligne avant et après elle-même.    > La balise Division <div></div> permet de créer des blocs autonomes dans une page. Ces divisions peuvent être positionnées et stylées comme bon nous semble.    > La balise <span></span> sert à modifier le style d'une portion de texte à l'intérieur d'un bloc.#6 - Les IDs / sommaire
   > Les IDs permettent de réaliser des liens vers des pages et des chapitres et de générer une table des matières et un sommaire.

#7 - L'audio

   > Les eBook en version ePub3 accepte l'insertion de fichier audio au format .mp3 via la balise <audio></audio>.

<audio controls="controls" src="../Audio/nomdufichier.mp3">Nom du Fichier</audio>

   > La lecture nécessite l'insertion d'un player, cette section sera prochainement développé...

#8 - La vidéo

   > Les eBook en version ePub3 permettent d'afficher directement des vidéos au format .mp4 grâce à la balise <video></video>.

<video controls="controls" src="../Audio/nomdufichier.mp4">Nom du Fichier</video>

   > La lecture nécessite l'insertion d'un player, cette section sera prochainement développé...

#9 - L'interaction

   > Les eBook en version ePub3 accepte comme les navigateurs les fonctions écrites en javascript qui permet d'augmenter le livre de transition, de mouvement et d'interaction avec l'utilisateur.
Les fichiers javascript .js sont stockés dans le dossier /Misc et sont liés aux pages de la même façon que les feuille de style.

<head>
  <title>Titre de la Page</title>
  <script src="../Misc/fct.js" type="text/javascript"></script>
</head>
#10 - Les métadonnées

   > Les métadonnées renseignent les données concernant l'édition (Titre de l'ouvrage, auteur, crédits,...). Elles sont accessibles via le menu "Outils".

#11 - La couverture

   > La couverture de l'eBook est une image ou une page qui peut-être ajouter via le menu "Outils". Elle permettra la reconnaissance du livre dans une bibliothèque numérique et mettra en valeur l'ouvrage électronique.

Le livre électronique / eBook.

Face aux documents numériques qui existent et sont utilisés depuis l’avènement de l'informatique, le principe de livre électronique, apparu en 1971 avec le projet Gutenberg, initié par Michael Hart, a pour vocation de rendre numériquement accessible des contenus littéraires.
Le plus connu est répandu des formats numériques partagés était le fichier PDF (format propriétaire de la firme Adobe) dont les propriétés de 'mise en page fixe' (fixed layout) ne sont plus adaptées à la disparité et l’éclectisme des affichages actuels, bien que la norme epub3 permette de nouveau ce type mise en page.
Les terminaux à qui se type de média se destine et les technologies utilisées pour les concevoir ont orientés leurs spécificités:
> Large lisibilité: Navigateurs web, logiciels pour ordinateur, applications pour terminaux nomades; liseuses, smartphones, tablettes...
> Format ouvert et libre dont la première qualité est l'adaptabilité aux supports.
> Capacité à évoluer en même temps que les technologies du web qui en sont le vecteur de diffusion.   IL existe aujourd' hui différents formats; certains propriètaires .PDF (Adobe), .MOBI, .AZW, KF8(Amazon, Kindle), souvent liés à de grand éditeur ou enseignes.
D'autre ce sont développé de façon libre et ouvert .fFB2, .PS, .TXT,  mais le plus démocratisé et évolutif est le format .eEPUB (electronic publication) développé par l’IDPF (International Digital Publishing Forum) qui a d'ailleurs été désigné récemment comme standard pour les livres électroniques.
> format le plus répandu en 2014 est l'EPUB2 qui supporte texte, image et mise en forme.
> format en déploiement: EPUB3 qui supporte la vidéo, le son et l'interaction avec le langage javascript notamment.
Le format Epub

> La structure d'un fichier ePub est identique à celle d'un site web; il s'orgaise par dossiers encapsulés dans le fichier.
Les chemins vers les différents éléments s'écrive de la racine du fichier (dossier), puis nom du dossier, puis nom du fichier: ../Images/nomdufichier.jpeg.Ressources
Flossmanuals de création d'un ebook au format Epub
- Créer un Epub, FlossManuals francophone, collectif , 2013.Mise en oeuvres

Les logiciels

> La plupart des logiciels d'édition (Open office, Word, InDesign...) possède une option ou un pluggin qui permettent l'exportation des documents au format eBook néanmoins les eBooks générés de cette manière ne sont pas optimisés et sont rarement compatibles avec l'ensemble des terminaux.
Il est préférable d'utiliser un logiciel dédié comme Sigil (TutoRessources.) qui permettra de maîtriser parfaitement le fichier et d'utiliser toutes les possibilités du format.