Vamos a crear un EPUB desde cero

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

!u" es un EPUB#
$ El EPUB es un formato abierto de libro digital desarrollado por el %&P'( $ )iene vocacin de ser formato estndar. $ EPUB es una especi*icacin abierta para libros digitales basada en tecnolog+as ,eb -./01 CSS 2 .3)/04( $ Es un archivo comprimido.

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

E5emplo de un EPub
Vamos a abrir un epub con Calibre para 6er cmo es un libro digital -descarga 7ttp899ganso:pulpo(com94 0ectura normal /etadatos ;ndice de na6egacin -)<C4

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Un EPUB por dentro

El arc7i6o tiene una e=tensin (epub1 un arc7i6o comprimido >ue si lo descomprimimos con nuestro programa 7abitual tipo ?in@ip1 6eremos cmo es por dentro : >u" arc7i6os lo componen

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Sigil
Sigil es un programa gratuito : de cdigo abierto con el >ue 6amos a crear nuestro epub1 el cual nos permitirA8

Crear un ePub legible en todos los dispositi6os( <rgani@ar la estructura de *orma mu: sencilla : sin necesidad de saber programacin( Editar los estilos -tipo de te=to1 colores1 indentados(((41 para lo cuAl necesitaremos nociones m+nimas de CSS : cdigo Editar los metadatos Establecer la na6egacin interna de su contenido -)<C4(

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

Pasos a seguir para la creacin de un epub88

Crear la estructura de nuestro libro( Crear los contenidos de cada arc7i6o Crear el +ndice de na6egacin -)<C4 : enlaces Crear los estilos : aplicarlos( %ntroducir metadatos (idioma y ttulo son obligatorios para que valide correctamente) Buardar como epub1 comprobar 6isuali@acin en Calibre : 6alidar(

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

Vamos a abrir Sigil8

Estructura de arc7i6os del EPUB

Editor de contenidos

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

Cuestro libro tendrA la siguiente estructura : arc7i6os8

Portada -t+tulo1 autor : *otogra*+a48 portada(=7tml ;ndice ->ue incluirA enlaces a los cap+tulos48 indice(=7tml 2 cap+tulos8 capitulo1(=7tml1 capitulo2(=7tml Cotas al pie8 notas(=7tml

DdemAs del arc7i6o donde irAn los estilos8 st:le(css : las imAgenes del libro1 >ue estarAn en *ormato (5pg(

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

1( Comen@amos creando arc7i6os : renombrando8

DEadimos los arc7i6os de nuestro libro dentro de la capeta ')e=t' : les pondremos nombre correspondiente -portada1 indice1 capituloF1(((etc4( Importante ! no poner puntos ni acentos en los nombres de esos archivos.

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

2( Escribimos el contenidos en cada cap+tulo

Editor de contenidos

Clicamos 2 6eces sobre el arc7i6o >ue >ueramos editar : a la derec7a1 escribimos el contenido o lo copiamos del bloc de notas -nunca copiar te=to de ,ord1 con6iene eliminar estilo pasando pre6iamente por el bloc de notas para >ue no genere cdigo e=traEo4(
'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

%nsertamos imAgenes( Si >ueremos >ue ocupe la pantalla entera1 medidas8 G00=HI0p= )ambi"n podemos insertar 6ideos : audios1 importante arc7i6os mpJ1 mp31 ogg : cambiar en el (op* el media9t:pe 7ttp899,,,(iana(org9assignments9mediaKt:pes4( "#o Esto slo se ver en i$ad Dsignamos estilos al t+tulo de la pAgina1 subt+tulo1 etc( seleccionado los di*erentes ni6eles de 3eading >ue 6emos en el combo -'3eading 11 7eading 2(((4( Es importante mantener los mismos estilos en todos los cap+tulos si >ueremos >ue "stos apare@can correctamente en el +ndice de contenidos -)<C4(

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

J( Editamos los CSS8 El *ormato ePub estA basado en los mismos estAndares >ue las pAginas ,eb1 esto signi*ica >ue los cambios de estilo -tipo de letra utili@ado1 color1 tamaEo1 etc4 debemos 7acerlos en el cdigo de las 7o5as de estilo en cascada -CSS4(

&entro de la carpeta St:le creamos el arc7i6o style.css( Una 6e@ tenemos creada nuestra 7o5a de estilos1 podemos comen@ar a editarla( Pero antes de nada1 6amos a ec7ar un 6ista@o a la apariencia >ue tiene una 7o5a de estilos1 :a >ue comprender su estructura nos a:udara posteriormente a la edicin(

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

Dpariencia de una 7o5a de estilos8
Estructura de la 7o5a de estilos

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

En el arc7i6o styles.css copiamos este cdigo -ir a bit(l:9codigocss48
body % font&family! sans&serif' ( h)*h+*h,*h- % font&family! serif' color! blac.' ( img %margin! )em / / / important' 0a1&2idth!)//3' (

!u" signi*ica este cdigo# body! es el cuerpo central de contenidos en 3)/0 font&family8 indica el tipo de *uente( En este caso1 tanto las cabeceras -711 72(((4 como el cuerpo de te=to -bod:4 estA en sansKseri* h)* h+ *h,* h-! son las cabeceras o 7eadings( D estos 7eadings estamos asignando el tipo de letra -*ontK*amil:4 sansKseri* : color de te=to -color48 blacL -negro4( !ue las imAgenes -img4 no se saldrAn del anc7o de pantalla -ma=K,idt78100MN4( Esto es importante ponerlo para >ue las imAgenes se 6ean correctamente en todos los dispositi6os( DdemAs1 estas imAgenes tendrAn un margen -margin4(

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

En cada uno de los arc7i6os >ue 7e creado tendr" >ue pegar el linL al arc7i6o css para >ue me co5a los estilos >ue le 7e asignado al epub( &entro de cada arc7i6o me situar" deba5o de la eti>ueta O7eadP : pegar" el siguiente cdigo
OlinL t:peQRte=t9cssR relQRst:les7eetR 7re*QR((9St:les9St:le(cssR 9P Combre e=acto del arc7i6o css

Combre carpeta

En el caso de >ue Sigil 7a:a generado en cada cap+tulo un cdigo del tipo8
Ost:le t:peQRte=t9cssRP span(sgcK1 S*ontK*amil:8 '0iberation Seri*'NT O9st:leP

Eliminarlo : sustituirlo por el anterior

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

Probamos a cambiar : aEadir mAs cdigo em el css( El nombre de la *uente8
body % font&family! sans&serif* arial' (

/odi*icar el color1 poniendo en ingl"s el color correspondiente(

h)*h+*h,*h- % font&family! serif' color! red' (

Cambiar el tamaEo8
h) % font&family! serif' color! red' font si4e!)-p1' (

0(UHIem

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

)ambi"n podemos aEadir mAs reglas combinando el css con l+neas de cdigo en el arc7i6o (=7tml1 por e5emplo8 Para >ue un blo>ue de contenido siempre se 6ea 5unto en la misma pantalla -imagen V pie de imagen41 en el arc7i6o (=7tml1 antes de la imagen pondremos8
5div6 class67.eep78 a>u+ ir+a la imagen a>u+ ir+a el te=to 59div8

2 en el css aEadiremos8
div..eep % display!inline&bloc.' (

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

: I;<"! http!99222.2,schools.com9css9

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

I( %ncluimos enlaces internos o internos Si abrimos un EPUB desde cual>uier dispositi6o de lectura1 6emos >ue e=isten 7iperenlaces >ue nos remiten a di*erentes partes del documento1 *acilitando la lectura : su na6egabilidad8 desde el arc7i6o +ndice podemos acceder a cual>uier cap+tulo o subcap+tulo con un simple clic desde un cap+tulo puedo dirigirme a *ragmentos de te=to >ue se encuentran en ese mismo cap+tulo : 6ol6er al punto donde estaba( puedo enla@ar una palabra >ue est" en un cap+tulo a otro punto concreto en otro arc7i6o8 por e5emplo1 ir desde una palabra en el 'cap+tulo 1' a una nota >ue contenga in*ormacin o bibliogra*+a sobre un t"rmino concreto en el arc7i6o 'notas al pie'( )ambi"n puedo crear enlaces e=ternos -a cual>uier pAgina en %nternet4(

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Sigil
Sigil *unciona en ?indo,s1 0inu= : /ac( 3a: >ue instalarse la 6ersin >ue se corresponda con el sistema operati6o >ue tengamos instalado en el ordenador1 de lo contrario1 no *uncionarAW

http!99code.google.com9p9sigil9

Sigil aXn no permite crear libros enri>uecidos -epub3 41 pero :a 7a dado un paso permitiendo la inclusin de 6ideo : audio -aun>ue slo es 6isible en iPad : na6egadores >ue soportan 7tmlI4

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

0as 6ersiones de Sigil H(0 o posteriores tienen automati@ada la inclusin de enlaces8

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

=eali4ar un enlace desde el ndice a un captulo! Seleccionamos el te=to >ue >ueremos enla@ar : pulsamos el botn con s+mbolo de cadena >ue 7a: en el menX superior8

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

Se nos abrirA una pantalla1 donde escogemos el cap+tulo donde >ueremos insertar el enlace : pulsamos '<Y'8

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

Para reali@ar un enlace desde un captulo a un punto concreto de otro captulo1 por e5emplo de un cap+tulo a un pie de pAgina1 lo primero >ue tenemos >ue 7acer es asignar un identi*icador -un nombre4 al sitio de destino -en nuestro caso1 en nuestra nota al pie4( Para ello abrimos nuestro arc7i6o de notas al pie en Sigil1 Seleccionamos la nota >ue >ueremos enla@ar1 : pulsamos en el menX superior el botn >ue es una ancla pe>ueEa8

Se nos abrirA una pe>ueEa pantalla donde ponemos un nombre >ue recordemos *acilmente( Este nombre es el denti*icador de ese punto concreto(

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

D continuacin1 nos 6amos al punto >ue >ueremos enla@ar a esa nota al pie( 0o seleccionamos1 : le damos *ormato de nota al pie8

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

Una 6e@ 7emos 7ec7o esto1 : con nuestro nXmero seleccionado1 pulsamos de nue6o el s+mbolo de enlace -la cadenita4 : buscamos1 dentro del listado de enlaces1 al >ue corresponde al identi*icador >ue 7emos insertado antes8
Cos *i5amos en la estructura del enlace8 es el nombre del arc7i6o =7tml seguido de almo7adilla -Z4 : el nombre del identi*icador( 2a 7emos reali@ado nuestro enlace a un punto concreto de otra pAgina( D7ora con6endr+a >ue el lector >ue 7a llegado a esta nota al pie pueda retornar al punto donde se encontraba antes( Para ello1 es necesario repetir la operacin pero a la in6ersa8

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

Cos 6amos al cap+tulo 11 donde 7emos reali@ado nuestro enlace a la nota1 : asignamos a este punto un identi*icador -tiene >ue ser un identi*icador di*erente al >ue 7emos puesto anteriormente1 dado >ue no tiene sentido insertar dos identi*icadores iguales1 ademAs >ue nos dar+a error4(

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

D continuacin nos 6amos al arc7i6o donde tenemos nuestras notas al pie1 : donde 7emos puesto la nota1 enla@amos a este punto8

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

Sigil actuali4a el archivo >"? ->ue es un arc7i6o >ue recoge in*ormacin sobre la estructura del EPUB4 a partir de los estilos >ue 7emos establecido en los arc7i6os( El >"? es el ndice de navegacin interna de un epub* como el ndice en papel* pero navegable Podemos 6er el estado del )<C en cual>uier momento si 6amos a R)ools P )<C Editor(((R( &ebemos comprobar >ue estAn todos los cap+tulos correctamente anidados o eliminar los >ue no >ueramos >ue apare@ca en el +ndice de na6egacin del epub( -Importante revisar estilos del ndice y de los ttulos de cada captulo para que no de errores. >iene que haber coherencia4

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

Sigil tambi"n nos permite editar la meta informacin

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Crear un EPUB con Sigil

Buardamos nuestro documento de Sigil como epub(

&espu"s 6amos a validarlo1 para comprobar >ue no tenga ningXn *allo8 7ttp8996alidator(idp*(org9 -serA obligatorio tener introducios los metadatos de idioma : t+tulo para >ue se 6alide correctamente4(

Corregimos los *allos >ue nos 7a recomendado : 6ol6emos a 6eri*icar

Por Xltimo lo abrimos con Calibre : lo leemos en nuestra pantalla de ordenador( )ambi"n con6iene probar en todos los dispositi6os >ue tengamos(

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Validar el cdigo
&espu"s de crear un epub es importante 6alidar el arc7i6o para detectar posibles errores( 3a: 6arios programas >ue lo 7acen1 pero 7a: >ue tener presente >ue a 6eces detectan *alsos errores( @$ara quA sirvenB &etectar si 7e incluido un arc7i6o grA*ico >ue no 7a sido utili@ado1 : >ue por tanto1 estA llenando mi ePub de basura innecesaria -lo cuAl lo 7arA mAs grande : mAs lento el arc7i6o4N otras 6eces nos alertan de >ue un elemento del cdigo no estA bien escrito1 etc((( @$or quA es importante validarB /uc7os distribuidores -por e5emplo1 iBooLStore1 la iniciati6a de Dpple para 6ender libros digitales para i)unes1 iPad1 iP7one : iPod touc741 e=igen >ue cumplan determinados re>uisitos t"cnicos : de contenido1 entre ellos1 superar la 6alidacin con el epubc7ecL 1(0(I

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Validadores
<tros 6alidadores8 7ttp899code(google(com9p9*lig7tcre,9 7ttp899code(google(com9p9epubc7ecL9

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

Errores mAs *recuentes

K Enrutamiento8 si una imagen estA en una carpeta1 tenemos >ue indicar en los arc7i6os la ruta completa( K Sinta=is8 atencin a los espacios1 : caracteres e=traEos( Co usar puntos1 acentos ni espacios para nombrar arc7i6os( K Co copiar te=to de ,ord1 eliminar estilos en bloc de notas : despu"s pegarlo en Sigil para e6itar >ue genere cdigo no deseado(

'Cmo crear un epub con Sigil Contenidosenred octubre 2013

7ttp899,,,(contenidosenred(com \contenidosenred contacto\contenidosenred(com

[/uc7as graciasW

'Cmo crear un epub con Sigil Contenidosenred octubre 2013