Bastidores do EPUB 3

Neste artigo quero compartilhar alguns pontos sobre os bastidores de um projeto real (cheio de desafios) para EPUB 3.

A partir de uma cartilha diagramada no InDesign, com variados elementos de layout, desde tabelas, quadros de texto colorido, elementos laterais, imagem em background, lista com ícones, quadros com imagem, entre outros que dificultam a produção de um EPUB refluível.

Acompanhe um pouco do que foi essa jornada de produção nas quatro seções deste artigo e não deixe de assistir o webinar Bastidores do EPUB 3, em que demonstro algumas dicas sobre os desafios deste projeto.

  • Preparação no InDesign
  • Produção no Sigil
  • Validação
  • Amazon/Kindle

Preparação no InDesign

Na produção do livro digital, em formato EPUB 3, não podemos esquecer que o InDesign não é o fim, mas apenas o meio do processo. O que estou dizendo é que não devemos nos apegar aos elementos gráficos do projeto aplicados no InDesign.

Pois, com frequência o melhor caminho será reconstruir boxes, fios e backgrounds direto no Sigil (em formatação CSS). Do InDesign nosso principal interesse é o conteúdo!

Conteúdo esse que deve estar corretamente marcado com as tags do HTML5.

Se você deseja melhorar seus fundamentos em HTML e CSS para EPUB 3 tenho a lista de aulas perfeitas para você! Basta clicar aqui para acessar a playlist.

Feita essa breve introdução, abaixo detalho alguns pontos de atenção deste projeto na parte do InDesign.

Remover elementos de apoio

Elementos gráficos de apoio como fios e backgrounds devem ser removidos do layout, pois irão dificultar a edição do EPUB na etapa do Sigil, criando várias marcações desnecessárias no HTML.

Remover elementos desnecessários no InDesign. Primeiro passo para uma produção eficiente do formato EPUB 3.

Rodar o script preptext

Etapa essencial (até para projetos de mídia impressa) antes de limpar ou remover estilos aplicados no projeto está no uso do excelente plugin preptext, que irá assegurar a formatação local (bold, itálico, versalete, entre outras) com a criação e aplicação de estilos de caractere. Tudo de forma automática!

Não conhece o scrip preptext? Confira a gravação do webinar InDesign e Scripts para baixar uma seleção especial de scripts, que com certeza irão mudar sua rotina com InDesign.

Ajustes nos estilos de parágrafo e caractere

Quem já atua com a produção de EPUB 3, em especial, a partir de projetos já diagramados sabe bem a importância dessa etapa. Sem dúvidas, é aqui que investimos o maior tempo de preparação e ajustes.

Quer aprender como limpar arquivos de word quando os importar para o InDesign? Então essa aula é para você!

Aplicar conteúdo em sequência no texto encadeado

Outro ponto de atenção e item obrigatório para um livro digital em EPUB 3 está na sequência do conteúdo. Tudo precisa estar referenciado na caixa de texto principal, seja de forma inline ou ancorada.

Controlando o encadeamento do texto.

Outro script sensacional que ajuda no controle da divisão das caixas de texto encadeadas chama-se Story Splitter. Simplesmente, o melhor no que se propõe a fazer!

Esse script, também, faz parte da seleção do webinar InDesign e Scripts. Baixa lá e seja feliz 😊

Planejamento

Ter a visão do que é preciso manter ou remover do InDesign, bem como discernir quando criar e aplicar estilos de forma inteligente para posterior edição no Sigil, enfim, conseguir visualizar o EPUB 3 pronto (e validado!), ainda nas primeiras etapas do InDesign é o tipo de conhecimento desejável (senão, necessário) para o profissional que deseja se especializar na produção de EPUB 3.

Confira na imagem abaixo que apesar de não exportar o fio do layout, nesse parágrafo foi criado um estilo de parágrafo “coringa” para ser formatado diretamente no Sigil.

Planejamento dos estilos – caractere, parágrafo, objeto, célula – é uma das etapas mais cruciais durante a produção do EPUB 3.

Um pouco dessa visão e experiência compartilho com você no webinar Bastidores do EPUB 3. Acesse aqui!

Não pense que a preparação no InDesign se esgota com os cinco tópicos desta seção, aqui listei apenas uma pequena parte do processo, mas que considero essencial.

Seguimos em frente, exportando o arquivo do InDesign para EPUB 3 refluível para darmos continuidade no Sigil.

Se você deseja entender cada detalhe do painel de exportação do InDesign para EPUB 3 não deixe de ler o artigo – 20 Recursos do InDesign para eBooks.


Produção no Sigil

Bem, é aqui que a magia começa!

Agora sim, estamos trabalhando com o arquivo matriz do projeto – EPUB. Como comentei na seção anterior, o arquivo do InDesign é apenas o nosso ponto de partida. Numa produção ideal não iremos mais retornar ao InDesign, toda e qualquer edição no eBook será realizada diretamente no formato EPUB.

Para esta seção separei quatro pontos de análise, para comprovar o poder de edição/formatação no CSS e que podemos (com esforço e estudo) realizar layouts tão elaborados quanto no InDesign.

Dúvida? Confira os exemplos a seguir!

Lista personalizada

Neste antes/depois confira a aplicação de ícones personalizados como bullet da lista. Através da combinação das propriedades de CSS float, ajustes de margin e padding e controle da largura máxima dos ícones.

Boxes numerados

Neste exemplo fica claro o poder de formatação do CSS. A partir de um texto simples, mas corretamente marcado com os estilos de parágrafo e caractere (antes), atingimos a formatação final de um belo conjunto de boxes coloridos (depois).

Destaco, também, a importância do planejamento e marcações de estilos desde o InDesign, bem como, a visão técnica em CSS que o profissional precisa ter para decidir qual a melhor forma de preparar o documento.

Spoiler: Esse o foco do nosso novo treinamento Bastidores do EPUB 3. Confira mais detalhes no final do artigo.

Por trás desse conjunto de boxes numerados há uma mescla de propriedades do CSS que inclui: border-radius, display:inline-block, combinação de Class e até position absolute (Eu sei, tive que mexer nesse elemento para funcionar no Kindle. Confira mais detalhes na seção Amazon/Kindle)

Imagem em background

Nem tudo precisa virar imagem numa produção de EPUB, com um pouco de esforço (e conhecimento, é claro) podemos produzir belas e funcionais aberturas de capítulo, semelhante a que ilustra este tópico.

Note a importância do ajuste do texto, em muitos casos não devemos aceitar o tamanho dos corpos de textos que chegam do InDesign. #ficaadica

Vinheta criativa para background

Poucos tipos de projetos exigem maior criatividade (e jogo de cintura) do designer, diagramador do que um livro digital.

Para manter a identidade visual do projeto na parte pré-textual, ao invés de aplicar um background em toda a tela, o que dificilmente iria funcionar nos eReaders, a solução foi reconstruir o fundo com a textura de bolinha direto no CSS e aplicar apenas no título.

Um bom exemplo de uso da propriedade background-repeat utilizando um arquivo SVG para a bolinha de fundo.

Layout original no InDesign. Saber lidar com layouts mais complexos, sem perder a identidade visual do projeto é uma habilidade desejada para quem quer produzir EPUB.

Neste breve recorte do que foi toda a produção desse eBook acredito que seja possível perceber o quanto de possibilidades temos como designers e diagramadores quando o assunto é livro digital.

E a ferramenta Sigil é a nossa principal aliada para atingir resultados com qualidade técnica e visual. Conheça mais sobre os superpoderes do Sigil nesta live – SIGIL 1.6 – Em sua melhor performance


Validação

Nesta etapa separamos as crianças dos homens, o joio do trigo.

Brincadeiras à parte, a validação é uma etapa obrigatória, que recebeu melhorias e complementos. Acompanhe os detalhes nesta seção.

EPUBCheck

Tradicional validador do formato EPUB é o porto seguro do todo fim de projeto. Quem não se lembra do seu primeiro EPUB validado?

SuperDica #1 – Não utilize o site http://validator.idpf.org/ pois, ele está rodando uma versão desatualizada do EPUBCheck V4.1.1

Plugin Sigil

Uma forma muito prática de aplicar a validação no arquivo EPUB está com uso de plugin no Sigil. Este sim atualizado, rodando a versão mais recente do EPUBCheck v4.2.5

Baixe aqui o plugin EPUBCheck para o Sigil

Validação para Acessibilidade

A boa novidade está pela crescente adoção da validação com foco na acessibilidade. Para atender corretamente os requisitos de um documento acessível contamos com a ajuda de dois ótimos plugins no Sigil

Access-Aide Accessibility Helper

Plugin obrigatório, pois aplica os metadados de acessibilidade no content.opf do EPUB. Item cada vez mais solicitado pelas lojas e distribuidores de ebook. Outro benefício deste plugin está pelo prático painel que permite a inclusão da descrição (atributo ALT) das imagens. Excelente!

Baixe aqui o plugin Access-Aide Accessibility Helper

ACE – DAISY EPUB Accessibility Checker wrapper

Este é mais do que um plugin, na verdade, funciona como um atalho dentro do Sigil para rodar o Daisy ACE (Accessibility Checker for EPUB). Uma plataforma completa para validação do EPUB com foco em acessibilidade, claro.

Prepare-se para muitos erros! Em especial, em relação ao contraste adequado das cores aplicadas no projeto.

Baixe aqui o plugin ACE – DAISY EPUB Accessibility Checker wrapper

Ficou curioso(a) sobre o uso de plugins no Sigil?

Já imaginava que ficaria! Por isso, deixo aqui o link para uma live especial – Plugins do Sigil para otimizar sua produção de EPUB 3

Ah! E se quiser saber mais sobre o fantástico Daisy ACE tenho um vídeo dedicado a essa ferramenta


Amazon/Kindle

Kindle Previewer

Ferramenta oficial da Amazon para validação e testes dos eBooks a serem distribuídos pela plataforma do mister Jeff Bezos.

No princípio o caos. Tenho que concordar que projetos (como este que estou compartilhando) mais complexos em elementos de layout são um desafio para os leitores Kindle.

Mas, se a vida lhe dá um limão…

Abaixo confira o resultado da conversão direta do EPUB pelo Kindle Previewer. Nosso lindo box numerado perdeu complemente a formatação.

Resultado da visualização direta do EPUB 3 no Kindle Previewer. A plataforma Kindle tem sua forma própria de lidar com as propriedades de CSS

…Fazemos uma limonada.

Nesta etapa, confesso, conseguir obter ótimos aprendizados sobre o uso das unidades de medidas (em, %, px, vh) e propriedades de CSS que funcionem tanto para leitores de mercado – Adobe Digital Editions (Windows), Books (iOS) e Play Books (Android) – quanto para Amazon/Kindle.

Spoiler: Esse o foco do nosso novo treinamento Bastidores do EPUB 3. Confira mais detalhes na próxima seção.

SuperDica #2 – Se for distribuir pela Amazon/KDP use sempre o formato EPUB 3.

SuperDica #3 – Caso queira distribuir sem usar a Amazon, será preciso utilizar o formato Mobi para leitura direta nos eReaders Kindle. Neste caso, exporte via Kindle Previewer para Mobi

Interessado(a) em saber mais sobre o universo Amazon tenho uma serie especial com 3 lives sobre a gigante do livro digital.

O Poder da Amazon – Parte 1 – Leitura
O Poder da Amazon – Parte 2 – Produção
O Poder da Amazon – Parte 3 – Distribuição

Ajustes para leitura no Kindle

Após algumas tentativas e erros, consegui formatar de forma adequada nosso Box numerado. O mais interessante que a solução aplicada para atender o Kindle, também funcionou de forma correta nos demais leitores do mercado.

Como citei, esse foi um dos grandes aprendizados deste projeto. Repensar as propriedades de CSS utilizadas para formatar o EPUB.


WEBINAR BASTIDORES DO EPUB 3

Venha conferir dicas sobre os bastidores de um projeto para EPUB 3, a partir de uma diagramação no InDesign, com variados elementos de layout.

Nada melhor que um projeto real, com conflitos e dificuldades reais para elevar nosso conhecimento na produção de EPUB 3. E quero compartilhar com você um pouco das técnicas e aprendizados que obtive realizando este complexo projeto!

Acesse aqui a gravação do webinar Bastidores do EPUB 3

Se você chegou até aqui, obrigado! Espero que este artigo e todas as referências e links que compartilhei possam te ajudar na produção de mais e melhores eBooks em formato EPUB.

E tenho um spoiler especial para você!

Ao final do WEBINAR BASTIDORES DO EPUB 3 irei apresentar todos os detalhes do nosso novo treinamento – SAIBA MAIS AQUI, que teve todas as aulas gravadas durante a produção deste projeto, assim você poderá acompanhar e aprender através de um projeto real.

Confira o os tópicos das 43 aulas gravadas neste link – Plano de Aula – Bastidores do EPUB 3

COMPARTILHAR:
, , , , , ,

Felipe Santos

Eu ajudo designers, editores, autores e entusiastas sobre publicações digitais (EPUB 3, HTML5 e App) a produzir e publicar conteúdo unindo técnica e design, mesmo para quem não sabe nada de programação. Vem comigo, colocar sua publicação para o Mundo :)

Deixe um comentário