Guide Technique-les Livres Enrichis

Transcription

Guide Technique
Les Livres Enrichis
Mathias DONNEZ & Pauline KELDER
Guide Technique – Les Livres Enrichis
Table des matiè res
TABLE DES MATIERES .............................................................................................................. 2
I-
QUELQUES NOTIONS DE HTML / CSS / JAVASCRIPT ................................................................... 4
1-
HTML ..................................................................................................................... 4
a) Les balises à connaître ......................................................................................... 4
b) Allure générale d’une page HTML ........................................................................... 5
c) Liens utiles pour approfondir ................................................................................. 6
2-
CSS ....................................................................................................................... 6
a) Quelques éléments à connaître .............................................................................. 6
b) Comment appeler un fichier CSS dans un document HTML ? ..................................... 7
c) Liens utiles pour approfondir ................................................................................. 7
3-
JavaScript ............................................................................................................... 7
a)
b)
c)
d)
Manipuler du HTML depuis JavaScript ..................................................................... 7
Questionnaire ...................................................................................................... 9
Comment insérer du code JavaScript dans un document HTML ? .............................. 12
Lien utile pour approfondir .................................................................................. 13
II- SIGIL ........................................................................................................................ 14
1-
Télécharger Sigil .................................................................................................... 14
2-
Les fonctions principales ......................................................................................... 14
3-
Commencer à rédiger son livre enrichi ...................................................................... 16
4-
Insérer un fichier CSS / JavaScript, des images ......................................................... 17
5-
Insérer des Footnotes/Notes de bas de page ............................................................. 19
6-
Tutoriel officiel ................................................................. Erreur ! Signet non défini.
III- EPUB : TESTER LES LIVRES ENRICHIS ................................................................................... 19
1-
Firefox ePubReader ................................................................................................ 19
2-
Adobe Digital Editions............................................................................................. 20
Page | 2
Le but de ce tutoriel est de présenter les connaissances de bases à acquérir pour être
capable d’écrire et de publier un livre enrichi.
Il ne s’agit pas ici de devenir un spécialiste en développement web. Des liens vers
des tutoriels et sites plus détaillés seront proposés pour aller plus loin, mais ceux-ci sont
loin d’être obligatoires.
Avant toute chose, la création d’un livre au format ePub nécessite le téléchargement
du logiciel Sigil (voir partie II), ainsi que d’un éditeur de format ePub (pour tester le livre
voir partie III).
Pour plus d’informations sur les livres enrichis, nous vous encourageons à consulter
le lien suivant : http://www.walrus-books.com/demo/
Page | 3
I-
Quelques notions de HTML / CSS / Javascript
Quand on parle d’un site web, les mots HTML, CSS et Javascript reviennent souvent.
Mais de quoi s’agit-il exactement ?
Une page internet peut-être divisée en trois parties lors de sa conception: le texte à
proprement parlé, la mise en page, et les interactions avec l'utilisateur (ex: cliquer sur
un bouton d'inscription, etc.).
Et bien voilà, nous venons juste de définir HTML, CSS, et Javascript!
Le HTML (HyperText Markup Language) est le langage permettant de créer une page
web, à l'aide de son contenu (texte, images, lien) uniquement.
Le CSS (Cascading Style Sheet) permet quant à lui d'organiser la mise en page de
notre page web.
Quant au Javascript, il gère l'ensemble des interactions entre l'utilisateur et la page,
ainsi que tous les éléments dynamiques d'une page web (ex: élément clignotant, etc.).
1- HTML
a) Les balises à connaître
En langage HTML, on définit un élément en l'encadrant par des balises.
Ainsi, un mot en gras sera encadré par les balises: <b> mon mot en gras </b>
Ces balises, ouvrantes et fermantes, délimitent les éléments sur lesquels agit la balise.
Règle de base: On peut emboiter les balises, mais on ne peut pas fermer une balise
à "l'extérieur" de celle dans laquelle on l'a ouverte.
Exemple: Les en-têtes de texte (titres, sous-titres) peuvent être définies par les
balises h: h1 désigne un titre, h2 un sous-titre, h3 un sous-sous-titre, etc.
Autorisé:
<h1>HTML
<h2> Les balises à connaître</h2>
</h1>
Interdit:
<h1>HTML
<h2> Les balises à connaître</h1>
</h2>
Page | 4
Lors de l’élaboration d’un livre enrichi à l’aide de Sigil, certaines balises vous seront
très utiles :
-
Agencement des titres :
Il y a 6 niveaux de titre en HTML, et donc 6 balises: h1 … h6. Ces balises correspondent
chacune à une taille de titre :
Ceci est un titre h1
-
Insertion d’un lien :
La balise « a » permet d’insérer un lien vers une page web dans une page HTML.
<a href="url de la page">Texte</a>
-
Insertion d’une image :
La balise « img » permet d’insérer une image dans une page HTML
<img src="chemin de l'image" alt="description de l'image" />
-
Insertion d’une vidéo :
L’insertion d’une vidéo se fait à l’aide de la balise suivante :
<iframe allowfullscreen="" frameborder="0" src="url de la vidéo ou chemin dans le
livre"></iframe>
-
Quelques balises utiles :
<p></p> : ces balises désignent un paragraphe, une unité de texte.
b)
Allure générale d’une page HTML
Une page HTML a globalement cette allure :
<!DOCTYPE html>
<html>
définition de la page html
<head>
l'en-tête de la page
<title>Hello HTML</title>
définition du titre de la page
</head>
<body>
le corps du texte
<p>Hello World!</p>
</body>
balise ferment signalant la fin du corps de texte
</html>
balise fermante signifiant le fin du document
Page | 5
La partie en-tête (entre les balises <head> et </head>) d’une page HTML permet
également de définir les fichiers CSS et Javascript utilisés par la page. On détaillera cette
définition ultérieurement. Le corps du fichier contient l’ensemble du texte.
c) Liens utiles pour approfondir
http://www.siteduzero.com/tutoriel-3-13666-apprenez-a-creer-votre-site-web-avechtml5-et-css3.html (hors partie serveur)
2- CSS
Comme on l'a précisé ultérieurement, un fichier CSS définit la mise en forme d'une
page HTML.
Par exemple, si une balise <p> détermine une unité de texte, c'est dans le CSS que
l'ont précisera la taille de la police de ce texte, ou encore sa couleur, son alignement.
Pour ce faire, on donnera à l'élément HTML que l'on veut mettre en forme un identifiant
(id), permettant de l'identifier de façon unique dans les deux fichiers (HTML et CSS).
Exemple:
Dans le fichier html, on notera : <p id="monid">Mon texte<p>
Puis dans le fichier CSS :
monid
{
Précisions sur la mise en forme
}
a) Quelques éléments à connaître
La syntaxe générale d’une feuille de style (CSS) est la suivante :
Sélecteur {
propriété:valeur;
propriété:valeur;
propriété:valeur;
}
Quelques propriétés utiles :
font-size: 12 ;
Taille de la police
color: #ffffff ;
Couleur du texte
font-family: Arial ; Police utilisée
margin: 3px ;
Marge à gauche
etc.
Il existe des dizaines de propriétés de style à définir selon les besoins. Certains sites
recensent une grande partie des propriétés CSS, comme par exemple
www.w3school.com. Ceux-ci vous aideront en cas de besoin.
Page | 6
b) Comment appeler un fichier CSS dans un document HTML ?
Il suffit pour cela de préciser dans l’en-tête du fichier HTML le nom et le chemin du
fichier CSS que l’on souhaite utiliser.
<link rel="stylesheet" type="text/css" href="le fichier voulu" />
c) Liens utiles pour approfondir
http://www.siteduzero.com/tutoriel-3-13666-apprenez-a-creer-votre-site-web-avechtml5-et-css3.html
3- JavaScript
JavaScript est le langage utilisé pour gérer l'ensemble des éléments dynamiques
d'une page web, que ce soit de la simple animation (élément clignotant), à l'envoi d'un
formulaire en ligne.
Pour pouvoir écrire un fichier JavaScript, il vous suffit d’avoir sur votre ordinateur un
éditeur de texte type Notepad, et d’enregistrer votre fichier avec l’extension .js .
La partie suivante, « Manipuler du HTML depuis JavaScript » est relativement
technique. Aussi, si vous ne souhaitez pas approfondir vos connaissances dans ce
langage, mais uniquement l’utiliser pour l’élaboration d’un questionnaire interactif à
ajouter dans votre livre, consultez plutôt la section « Questionnaire »plus bas.
a) Manipuler du HTML depuis JavaScript
Une page HTML a comme représentation le DOM, ou Document Oject Model.
JavaScript permet d’interagir avec le DOM, et ainsi de modifier la page.
-
Récupérer une référence à un élément :
Par son identifiant :
Si on a pris la peine de mettre un attribut id à une balise, on peut y accéder
simplement depuis JavaScript :
<head> <title>Titre</title> ...
<script type="text/javascript">
</script> </head>
<head> <title>Titre</title>
<script type="text/javascript" src="../Misc/fichier.js"></script> </head>
<p id="identifiant">Texte</p>
var element = document.getElementById("identifiant");
// On vérifie qu'un élément a bien été trouvé
if(element) {
// code}
Page | 7
Par le nom de la balise :
On peut accéder à des balises par leur parent, et par leur nom. Par exemple pour
récupérer les éléments d’une liste :
<ul id="liste"> <li>Élément 1</li> <li>Élément 2</li> <li>Élément 3</li>
</ul>
On peut procéder de la sorte :
var liste = document.getElementById("liste"); var elements = [];
if(liste) {
elements = liste.getElementByTagName("li");
// elements contient désormais la liste des balises li
}
-
Récupérer la valeur d’un élément de formulaire :
Si on a une référence vers un champ de formulaire, on peut récupérer sa valeur à
l’aide de l’attribut value. Si on a une référence vers un formulaire, on peut récupérer ses
différentes valeurs.
Par exemple avec le HTML suivant :
<form action="" method="post" id="form"> <input type="text" name="texte" id="texte"/> <select
id="" name="liste">
<option
value="1">Un</option>
<option
value="2">Deux</option>
<option
value="3">Trois</option>
</select> </form>
Eut écrire le JavaScript suivant :
var
f
=
document.getElementById("form");
console.debug(f.liste.value);
console.debug(f.texte.value);
On peut savoir si un bouton radio ou une checkbox a été cochée à partir de l’attribut
checked.
-
Modifier un élément de la page :
Une fois que l’on dispose d’une référence vers un élément de la page, il est possible
de le modifier.
On peut par exemple modifier ses propriétés CSS :
element.style.border = "1px solid black"; element.style.backgroundColor = "#ff0000";
Il est à noter que background-color en CSS est transcrit backgroundColor en
JavaScript. De la même manière, toutes les propriétés séparées par des - en CSS sont
écrites en CamelCase.
Pour un élément de formulaire, on peut modifier sa valeur:
element.value = "foobar";
On peut aussi modifier le texte contenu dans un élément. Par exemple:
<span id="span"></span>
Page | 8
Puis:
sp = document.getElementById("span"); sp.innerHTML = "Contenu span";
-
Insérer un élément dans la page
On peut insérer de nouveaux éléments dans une page. Il faut d'abord les créer, puis
les insérer dans le Document Object Model.
Création d'un élément
var newElem = document.createElement("p"); newElem.innerHTML =
newElem.style.border = "1 px solid black";
"Contenu span";
Insertion dans le DOM
var elem = document.getElementById("foo"); if(foo) {
elem.appendChild(newElem);
}
b) Questionnaire
Nous présenterons ici une possibilité de code à insérer dans votre livre enrichi, afin
de pouvoir créer un questionnaire interactif.
Exemple 1 :
Code à insérer dans le fichier JavaScript :
var Quizz=[["Première question du quizz","la réponse correspondante"],
["Seconde question du quizz","la réponse correspondante"],
…
["Dernière
question
du
quizz","
la
réponse
correspondante"]];
function sendQuestion(radio,QuestionNumber){
var i=QuestionNumber
// for (var i=0; i<radio.length;i++) {
// if (radio[i].checked) {
//
document.getElementById("reponse1").innerHTML="Vous
sélectionné la réponse: "+radio[i].value+"\n ";
document.getElementById("reponse"+i).innerHTML="REPONSE:
"+Quizz[QuestionNumber-1][1];
// }
//
}
avez
}
function init() {
var i;
Page | 9
for (i=0;i<190;i++){
if (document.getElementById("question"+i))
{
document.getElementById("question"+i).innerHTML=Quizz[i-1][0];
}
}}
window.onload = init;
Code à insérer dans le fichier HTML correspondant :
//dans l’en-tête ou dans un fichier CSS à part : il s’agit du style du
bouton Envoyer
<style type="text/css">
a:link {
display:block;
height: 20px;
width:40px;
font-family: Tahoma, Arial, Helvetica, Sans-Serif;
font-size: 12px;
text-align: left;
padding: 0 10px !important;
line-height: 18px;
text-decoration: none !important;
color: black !important;
border: 1px solid black;
-moz-border-radius: 12px;
-webkit-border-radius:12px;
border-radius:12px;
background-color: #DCDFDF;
box-shadow: 3px 3px 4px #000000;
-webkit-box-shadow: 3px 3px 4px #000000;
-moz-box-shadow: 3px 3px 4px #000000;
filter:
progid:DXImageTransform.Microsoft.dropShadow(color=#000000,
offX=7, offY=7, positive=true);
}
a:visited {text-decoration: none}
a:active {text-decoration: none}
a:hover {text-decoration: underline overline;}
</style>
//à l’endroit où l’on veut ajouter la question i du quizz
<p><div id="question2">
</div></p>
<form action="#" id="myform">
<input name="q2" type="radio" value="vrai" />VRAI<br />
<input name="q2" type="radio" value="faux" />FAUX<br />
<br />
</form>
<a href="javascript:sendQuestion(0,2)" >Envoyer</a>
<br />
<div id="reponse2"></div>
Page | 10
On obtient un questionnaire de ce type :
L’appui sur le bouton Envoyer déclenche l’affichage de la réponse.
Exemple 2 :
Code à insérer dans le fichier JavaScript :
function showHide(div, button)
/*
Cette fonction permet successivement d'afficher et de masquer un
paragraphe donné.
Elle est appelée lorsque l'utilisateur clique sur un bouton présent
dans le corps de la page HTML.
Elle a donc 2 arguments :
- div (le paragraphe à traiter) ;
- button (le bouton sur lequel l'utilisateur a cliqué).
*/
{
if (div.className == 'cache') // Si le paragraphe est caché
{
div.className = 'spoiler'; // On le montre
button.value = 'Masquer la réponse'; // Et le bouton affiche
désormais "Masquer la réponse"
}
else // Si le paragraphe est visible, on fait l'opération inverse
{
div.className = 'cache';
button.value = 'Afficher la réponse';
}
}
Code à insérer dans le fichier HTML correspondant :
<h1 id="heading_id_2">Quizz interactif</h1>

<h2 id="heading_id_3"><span id="part1">Partie 1 : Titre</span></h2>

<div id="question1">
Question n°1 : Ajoutez ici le texte de votre question.<br />
Page | 11
</div>
<form>

<input onclick="showHide(document.getElementById('answer1'), this)"
type="button" value="Afficher la réponse" />
</form>
<div class="cache" id="answer1">

Ajoutez ici le texte de votre réponse.<br />
</div>
Code à insérer dans un fichier CSS :
.cache /* Pour cacher les réponses */
{
display: none;
}
.spoiler /* Pour mettre en page les réponses à afficher */
{
max-height: 130px;
overflow: auto; /* Ajout d'une scroll-bar si nécessaire */
margin: 5px;
padding: 2px;
border: 2px solid #ccddff;
background-color: #ddeeff;
color: black;
}
On obtient un questionnaire de ce type :
c) Comment insérer du code JavaScript dans un document HTML ?
Si le code est petit et fortement lié au contenu de la page, il peut être plus simple de
l'intégrer directement à la page. Cette manière de faire est en général déconseillée car
peu modulaire.
Page | 12
Code à insérer dans le document:
head> <title>Titre</title> ...
<script type="text/javascript"> //<![CDATA[
// Code javascript. //]]>
</script> </head>
Le bloc de JavaScript doit être mis à l'intérieur de <![CDATA et ]]> pour éviter qu'il
soit considéré comme du XML.
D'autre part, le code JavaScript peut être écrit dans un fichier externe, puis lié au
fichier HTML.
Cette manière de faire est plus propre et modulaire, mais il faut bien penser à
rajouter le fichier JavaScript au fichier ePub (via Sigil par exemple).
Code à insérer dans le document:
<head> <title>Titre</title>
<script type="text/javascript" src="../Misc/fichier.js"></script> </head>
d) Lien utile pour approfondir
http://www.siteduzero.com/tutoriel-3-8158-tout-sur-le-javascript.html
Page | 13
II-
Sigil
Sigil est l’éditeur de ePub que nous avons choisi de vous présenter pour la création
de votre livre enrichi. Sachez que d’autres éditeurs existent, qui présentent tous certains
avantages et certains inconvénients.
1- Télécharger Sigil
Sigil est un logiciel gratuit disponible au téléchargement depuis cette page :
http://code.google.com/p/sigil/downloads/list
2- Les fonctions principales
La fonction principale de ce logiciel est évidemment d’aider à la réalisation de livres
enrichis. Pour ceci, Sigil propose plusieurs vues différentes.
La première est une vue « classique » du texte en cours de rédaction.
Page | 14
La seconde, une vue côté code. Lorsque celle-ci est activée, le texte rédigé apparaît,
mais également l’ensemble des balises HTML caractérisant le texte au format ePub.
Enfin, il est également possible d’avoir une vue partagée, regroupant les deux vues
précédentes.
Page | 15
Sigil possède d’autre part de nombreuses fonctionnalités intéressantes et utiles.
Quelques exemples :
-
Nul besoin d’insérer soi-même dans le code de votre chapitre les en-tête, il est
possible de sélectionner le type de chaque titre :
-
On peut couper un chapitre en deux sans avoir à supprimer l’ensemble de la
rédaction :
-
Sans parler de l’ensemble des fonctions classiques d’un éditeur de texte, comme
par exemple la mise en gras, en italique, l’alignement du texte à gauche, au
centre, ou à droite, etc.
3- Commencer à rédiger son livre enrichi
Rédiger un livre au format ePub revient à l’écrire intégralement à l’aide de Sigil.
Le livre est en fait un dossier dans lequel chaque élément est rangé à sa place. Par
exemple, l’ensemble des fichiers texte (à savoir les chapitres) se situeront dans le
dossier « Text » (que l’ont peut voir dans le panneau gauche de l’écran. Le dossier
« Style » contiendra la feuille CSS que nous avons évoqué dans le chapitre précédent. Le
dossier « Images » contiendra l’ensemble des images du livre, et enfin le dossier « Misc »
contiendra tous les éléments que nous n’avons pas évoqué précédemment, par exemple
une vidéo, ou encore un fichier JavaScript.
Il est important de respecter ce rangement lors de la rédaction de votre livre.
Ainsi, lorsque vous souhaiterez ajouter un nouveau chapitre à votre livre, il vous
suffit de créer un nouvel élément dans le dossier « Text », puis de le renommer à votre
guise. De même, l’insertion d’une image débutera forcément par le chargement, dans le
dossier « Images », de l’image souhaitée.
Panneau récapitulatif de l’agencement des dossiers
Page | 16
Générer une table des matières :
Une fois votre livre rédigé, il vous faut générer une table des matières, afin que
l’utilisateur puisse facilement naviguer d’un chapitre à l’autre.
Pour cela, il est important que l’ensemble de vos titres et sous-titres possèdent une
balise d’en-tête (comprise entre h1 et h6, voir chapitre HTML). Si ce n’est pas le cas, le
titre n’apparaitra pas dans la table des matières.
Une fois cette précision vérifiée, allez dans la vue « Table des matières », puis
cliquez sur « Générer une table des matières à partir des en-têtes ». Une proposition de
table vous sera faite, qui vous permettra de vérifier que vous n’avez pas oublié de partie.
Si celle-ci vous convient, validez le choix. Sinon, modifier les balises en-tête à votre
guise.
4- Insérer un fichier CSS / JavaScript, des images
L’insertion d’un fichier CSS ou JavaScript dans Sigil s’effectue de la même manière
que dans un fichier HTML classique. Avant toute chose, vérifiez que l’icône de nettoyage
de texte n’est pas sélectionnée :
. En effet, Sigil ne comprend pas par défaut l’ajout
de JavaScript ou CSS, et s’empresserait donc de supprimer l’appel aux fichiers.
D’autre part, il vous faut insérer votre fichier CSS ou JavaScript au livre, et ceci en le
chargeant dans le dossier correspondant, respectivement Style ou Misc. Une fois ceci fait,
placez-vous dans la vue code du document concerné, puis insérez dans l’en-tête les
balises explicitées dans les chapitres ci-dessus (respectivement CSS et JavaScript). Vos
fichiers sont maintenant insérés.
Pour insérer une image dans un chapitre de votre livre, deux possibilités s’offrent à
vous :
-
La première consiste à procéder de la même manière. Commencez par ajouter
l’image dans le dossier Images de votre projet, puis insérer dans la vue code du
chapitre voulu et à l’endroit voulue la balise d’appel à cette image :
<img src="../Images/nom de l’image" alt="description de l'image" width="50%" />
NB : la valeur de width, à laisser impérativement en % pour des questions
d’adaptation à chaque format d’appareil, permet de modifier la taille de l’image.
-
La seconde, bien plus simple, implique l’utilisation de la fonction insert image :
Cependant, il est important de savoir insérer une image autrement, afin de pouvoir
modifier la taille de celle-ci très facilement.
La Couverture
Page | 17
Pour ajouter une couverture, après avoir chargé l’image dans le fichier image, il faut
créer une page xhtml et insérer ce code en remplaçant x et y par le nombre de pixels ou
le pourcentage relatif et votre_image par le nom de l’image. Les dimensions ne doivent
pas excéder 850 pixels :
<?xml version="1.0" encoding="utf-8" standalone="no"?>
<!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" xml:lang="fr">
<head>
<title>Couverture</title>
<link href="../Styles/stylesheet.css" media="screen" rel="stylesheet" title="Style"
type="text/css" />
</head>
<body>
<div class="svg_outer svg_inner">
<svg xmlns="http://www.w3.org/2000/svg" height="100%" id="cover_image"
preserveAspectRatio="xMidYMid meet" viewBox="0 0 538 760" width="100%"
xmlns:xlink="http://www.w3.org/1999/xlink">
<image height="x" width="y" xlink:href="../Images/votre_image.jpg"></image>
</svg>
</div>
</body>
</html>
Ensuite, il faut modifier le fichier css en ajoutant ce code :
div.svg_outer
{
display: block;
margin: 0;
padding: 0;
text-align: left;
}
div.svg_inner
{
display: block;
text-align: center;
}
#cover_image
{
max-height: 1700px;
max-width: 1700px;
}
Après avoir insérer l’image de couverture dans votre dossier image, il faut faire référence à
cette image Les dimensions ne doivent pas excéder 850px
Page | 18
5- Insérer des Footnotes/Notes de bas de page
Il se peut que vous ayez à ajouter des notes de bas de pages dans votre livre.
Cependant, la notion même de page n’existe pas dans un livre au format ePub. Une
alternative peut être de placer vos notes dans un fichier texte à part, et de créer des
liens entre ce fichier et l’endroit voulu dans votre document. Pour ce faire, il faut :
1) Dans le texte, à l'endroit où l'on veut insérer le lien vers la footnote, copier/coller le
code suivant :
<sup><a href="../Text/Notes.xhtml#footnoteX" id="footnotelinkX">X</a></sup>
(dans l'hypothèse où toutes les footnotes sont regroupées dans un fichier "Notes.xhtml"
placé à la fin de l'ouvrage et situé dans le dossier prévu par défaut par SIGIL (sinon
changer le lien))
En remplaçant X par le numéro de la footnote.
2) A l'endroit où l'on veut placer la footnote, copier/coller le code suivant :
<p><sup><a href="../Text/FICHIER.xhtml#footnotelinkX"
id="footnoteX">X</a></sup> <span class="footnote">TEXTE DE LA
FOOTNOTE</span></p>
En remplaçant X par le numéro de la footnote et FICHIER par le nom de celui dans lequel
on a inséré le lien.
NB : la balise <span class="footnote"> n'est utile que si l'on veut utiliser un style précis
pour les footnotes dans le fichier CSS (taille de police réduite…).
6- Tutoriel officiel
http://code.google.com/p/sigil/wiki/BasicTutorial
III-
ePub : tester les livres enrichis
La dernière partie de ce tutoriel nécessite quelques compléments. Toute remarque
est la bienvenue concernant les éditeurs d’ePub utilisés.
1- Firefox ePubReader
Pour tester votre livre au format ePub, nous vous conseillons de télécharger le plugin
Firefox ePubReader à l’adresse suivante :
https://addons.mozilla.org/en-US/firefox/addon/epubreader/
Une fois installé, celui-ci vous permettra depuis votre navigateur Firefox, de charger
votre livre enrichi, puis de le visualiser, en cliquant sur l’icône :
Page | 19
en haut à droite de votre page de navigation.
2- Adobe Digital Editions
Il s’agit d’un autre outil très utile : http://www.adobe.com/products/digitaleditions/
pour la visualisation de vos livres enrichis.
Page | 20

Guide Technique-les Livres Enrichis

Transcription

Documents pareils

dreamweaver perfectionnement

ORSYS Créer des applications multi

Créer son site Web avec DREAMWEAVER

Télécharger la plaquette, les dates

Formation Adobe DreamWeaver Perfectionnement

HTML : Les couleurs Web

Développeur - Daniel PAUL

Technologies du Web Correction de l`examen

CV – Développeur PHP / WebDesign CSS Aurélie CABON

TD TD –– Javascript