Documentos para a Web

Origem: Tex-Br, a enciclopédia livre.

Com algum (mínimo) esforço adicional é possível utilizar o L^AT_EX para produzir bonitos documentos para a Web. O esforço adicional mencionado acima se refere ao uso do latex2html, de Nikos Drakos -- que converte um documento L^AT_EX em HTML seguindo definições escolhidas pelo usuário. Com alguma boa vontade, é possível criar um resultado bastante interessante.

[editar]

Flexibilidade do `latex2html`

Não é verdade que o L^AT_EX não serve para criar documentos para a Web, tampouco que um documento HTML gerado pelo L^AT_EX é, necessariamente feio. A feiúra da maioria da documentação on-line produzida com o L^AT_EX se deve unicamente ao fato de as pessoas comumente usarem o as opções padrão de conversão -- além de não se importarem em criar uma folha de estilos mais bonita.

No primeiro caso, é possível controlar uma ampla gama de opções a fim de tornar o produto da conversão mais aceitável, especialmente se você estiver usando a versão mais recente.

A criação de folhas de estilos é um tópico à parte, mas merece também algumas observações, já que o latex2html costuma criar algumas classes diferentes, que podem ser exploradas.

[editar]

Opções de Linha de Comando

Temos a seguir uma tradução das principais opções de linha de comando do latex2html. Note que "#" significa um número inteiro e "$" uma instrução, enquanto que "(no)" significa que a reversão do comando é feita acrescentando "no" ou "no_" ao começo.

-split #: Dividir em páginas até este nível. Nível 1 significa que cada capítulo ficará em um arquivo, nível 0 resultará em um único arquivo contendo todo o texto. O padrão é pôr cada seção em um arquivo.

-link #: Criar ligações entre seções até este nível. Nível 3 significa que até as subseções terão hiperligações entre si, nível 0 significa um documento sem hiperligações. O padrão é ligar todas as seções.

-toc_depth #: Profundidade do sumário. Use zero para não criar um sumário.

-(no)toc_stars: Não incluir os capítulos não-numerados no índice.

-(no)short_extn: Usar extensão ".htm" em vez de ".html"

-iso_language $: Definir esta linguagem na "meta" tag do documento.

-(no)validate: Executar o validador de html especificado em l2hconf.pm.

-(no)latex: Processar comandos desconhecidos com o LaTeX. Este é o padrão.

-(no)external_images: Não copiar localmente as imagens. Não use esta opção se for criar um documento para a Web.

-(no)ascii_mode: Usar texto em vez de imagens para os links do painel de navegação.

-(no)lcase_tags: Escrever html com tags em minúsculas.

-(no)ps_images: Utilizar imagens externas em postscript em vez de convertê-las para bitmaps. Não recomendável.

-font_size #: Tamanho de fonte a ser usado pelo LaTeX para gerar versões em bitamp das equações e gráficos. Padrão = 12.

-(no)tex_defs: Habilitar interpretação de comandos TeX. Este é o padrão, mas o latex2html tem um suporte limitado a estes: os comandos desconhecidos serão direcionados ao próprio TeX.

-(no)navigation: Criar um painel de navegação no alto de cada página.

-no_top_navigation: Não exibir painel de navegação no alto da página.

-(no)buttom_navigation: Exibir painel de navegação no pé da página.

-(no)auto_navigation: Colocar um painel de navegação no alto da página e, caso a página tenha mais de $WORDS_IN_PAGE, outro no rodapé.

-(no)index_in_navigation: Incluir um link para a página inicial no painel.

-(no)contents_in_navigation: Incluir um link para o sumário no painel.

-(no)next_page_in_navigation: Incluir um link para a próxima página.

-(no)previous_page_in_navigation: Incluir um link para a página anterior.

-(no)footnode: Colocar todas as notas de rodapé em uma página separada, chamada footnode.html, caso contrário elas serão postas no rodapé da página onde aparecem.

-(no)numbered_footnotes: Numerar notas de rodapé, ou então referenciá-las com um ícone genérico de hyperlink.

-(no)address $: Utilizar um rodapé personalizado para as páginas, ou então suprimir a geração de um rodapé padrão.

-(no)subdir: Determina que o latex2html deverá criar ou reutilizar um subdiretório, caso contrário os arquivos gerados serão postos no diretório atual.

-info 0 / 1 / string ou noinfo: Se 0 (ou -noinfo), a página/seção "Sobre este documento..." não será gerada. Se 1 a página/seção será gerada com o conteúdo padrão. Se uma string personalizada for fornecida ela será usada para a página/seção de informações.

-reuse # | -noreuse: Se 0, não reutilizar ou reciclar imagens idênticas geradas em execuções anteriores. Se 1, apenas reciclar imagens geradas anteriormente. Se 2, novamente todas as imagens.

-(no)antialias_text: Usar suavização de bordas das fontes usadas na geração de bitmaps de fórmulas e textos personalizados.

-(no)antialias: Usar suavização de bordas das fontes usadas na geração de figuras.

-(no)transparent: Se as imagens deverão ser transparentes ou não.

-image_type gif|png: Escolha do tipo de imagem a ser usado para os links e para as imagens geradas pelo LaTeX.

-(no)images: Se o latex2html deverá ou não gerar imagens.

-images_only: Se o latex2html deverá gerar todo o documento ou apenas as imagens.

-(no)local_icons: Se os ícones devem ser copiados localmente.

-(no)show_section_numbers: Se os números de seção devem ser exibidos ou não.

-html_version list: A versão do HTML a ser gerado. Atualmente existem as seguintes opções: 2.0, 3.0, 3.2 e 4.0. Algumas opções adicionais podem ser acrescentadas, separadas por vírgula da opção inicial: math (aceitar mathml), i18n, table (utilizar tabelas para organizar o conteúdo), frames (utilizar frames), etc. Consulte a documentação do programa para uma lista completa. É aconselhável usar "4.0,tables,math" para um resultado ótimo.

-(no)strict: Se o documento deve ser "strict" ou "transitional".

[editar]

Utilizando um Arquivo de Configuração

As configurações internas do latex2html podem ser personalizadas através de um arquivo chamado .latex2html-init que deve ser posto no diretório $HOME de cada usuário. Existe também um arquivo padrão contendo as configurações "de fábrica" do programa, mas este não deve ser mexido para não causar problemas de compatibilidade.

No arquivo de configuração, cada variável deve ser iniciada por um cifrão ("$") e terminada por um ponto-e-vírgula (";"). As principais variáveis (acompanhadas de seus valores padrão) são:

$MAX_SPLIT_DEPTH = 8;:Determina que a partir desta profundidade as seções não serão mais postas em arquivos separados.

$MAX_LINK_DEPTH = 4;:Não criar links a partir daqui.

$NOLATEX = 0;:Procesar comandos desconhecidos com o LaTeX?

$EXTERNAL_IMAGES = 0;:Não copiar as imagens utilizadas para o diretório do documento?

$ASCII_MODE = 0;:Substituir as imagens por texto?

$PS_IMAGES = 0;:Linkar as imagens em arquivos PostScript em vez de convertê-las para bitmap?

$DESTDIR = '/home/jggouvea/public_html/downloads';:Onde criar os arquivos?

$NO_SUBDIR = 0;:Usar o diretório corrente em vez de criar um subdiretório?

$ADDRESS = "String":Modifique a string de assinatura no rodapé de cada página à vontade.

$NO_NAVIGATION = 0;:Abolir o painel de navegação?

$AUTO_NAVIGATION = 1;:Incluir painel de navegação extra no rodapé das páginas maiores.

$INDEX_IN_NAVIGATION = 1;:Incluir link para o sumário no painel.

$CONTENTS_IN_NAVIGATION = 1;:

$NEXT_PAGE_IN_NAVIGATION = 1;:

$PREVIOUS_PAGE_IN_NAVIGATION = 1;:

$INFO = 1;:Incluir informação do documento?

$REUSE = 2;:Reutilizar imagens geradas anteriormente?]

$SHOW_SECTION_NUMBERS = 0;:Se os títulos de seções devem trazer numeração. É aconselhável não utilizá-lo pois o latex2html não é capaz de reconhecer numeração sequencial em mais de um nível.

$WORDS_IN_PAGE = 300;:Número mínimo de palavras para que seja gerado um outro painel de navegação ao pé da página se $AUTO_NAVIGATION estiver setado para 1.

$TITLES_LANGUAGE = "portuguese";:Se você deseja traduzir os nomes de seções.

$$HTML_VERSION = '3.2';:Versão HTML a usar.

1;:Esta deve ser a última linha. IMPORTANTE!!!

Mas se você não quer perder tempo escrevendo um arquivo destes a partir do nada, baixe o meu e personalize-o.

[editar]

Folha de Estilos para Documentos LaTeX

A folha de estilos padrão criada pelo latex2html é sofrível, pré-histórica, horrível. Porém é possível melhorar muito a aparência das páginas usando uns poucos truques de CSS. Certamente ensinar você a usar folhas de estilos vai muito além do propósito deste breve tutorial, mas vamos tentar ver alguma coisa de útil...

Esta é uma folha de estilos padrão gerada pelo latex2html:

.MATH    { font-family: "Century Schoolbook", serif; }
.MATH I  { font-family: "Century Schoolbook", serif;\\
font-style: italic }
.BOLDMATH { font-family: "Century Schoolbook", serif;\\
font-weight: bold }

SMALL.XTINY		{ font-size : xx-small }
SMALL.TINY		{ font-size : x-small  }
SMALL.SCRIPTSIZE	{ font-size : smaller  }
SMALL.FOOTNOTESIZE	{ font-size : small    }
SMALL.SMALL		{  }
BIG.LARGE		{  }
BIG.XLARGE		{ font-size : large    }
BIG.XXLARGE		{ font-size : x-large  }
BIG.HUGE		{ font-size : larger   }
BIG.XHUGE		{ font-size : xx-large }

H1		        {  }
H2		        {  }
H3		        {  }
H4		        {  }
H5		        {  }

DIV.displaymath	{  }
TD.eqno		{  }

DIV.LaTeX		{   }
DIV.logo-LaTeX		{   }
DIV.navigation		{   }
DIV.logo-TeX		{   }
SPAN.arabic		{   }
SPAN.textit		{ font-style: italic  }
SPAN.textsf		{ font-style: italic  }
SPAN.textbf		{ font-weight: bold  }

Como se pode ver, há muito pouca personalização, quase tudo continua segundo a folha de estilos padrão HTML, o que significa um lay-out sofrível. Note que apenas os tamanhos de fonte e a correspondência entre os estilos L^AT_EX e estilos HTML foram ajustados.

A seguir temos um comentário da folha de estilos que eu uso para exibir o meu antigo tutorial sobre fontes (o tutorial está obsoleto e a única razão para eu mantê-lo no ar é justamente exibir os "poderes" da combinação do latex2html e de uma boa folha de estilos para dar beleza a um arquivo do L^AT_EX).

Caso você goste do visual desta folha de estilos, basta copiar e colar em seu arquivo de estilos.

BODY {
 background : #eee;
 margin-top : 0;
 padding : 0
}

A única coisa importante aqui é definir um plano de fundo mais agradável. Estamos definindo uma cor cinza-clara, eliminando as margens no topo e o espaço entre a borda e conteúdo.

.MATH {
 font-family : serif 
}

.MATH I {
  font-family : serif;
  font-style : italic
}

.BOLDMATH {
  font-family : serif;
  font-weight : bold
}

Estes foram os estilos usados para exibir equações. Se você não utiliza equações em seus documentos pode simplesmente não usá-los.

SMALL.XTINY {
  font-size : xx-small
} 

SMALL.TINY {
  font-size : x-small
} 

SMALL.SCRIPTSIZE {
  font-size : smaller
}

SMALL.FOOTNOTESIZE {
  font-size : small
}

SMALL.SMALL {
} 

BIG.LARGE {
}

BIG.XLARGE {
 font-size : large
}

BIG.XXLARGE {
  font-size : x-large
}

BIG.HUGE {
 font-size : larger
}

BIG.XHUGE {
 font-size : xx-large
}

Estas foram as definições de tamanho de fonte. São bastante razoáveis e não é aconselhável mexer aqui.

H1, H2, H3, h4, h5, h6 {
  color : orange
}

DIV.displaymath {
}

Aqui começa a personalização para valer: mudei as cores dos títulos para laranja. A DIV.displaymath está vazia, mas não a apaguei porque posso futuramente querer personalizá-la.

DIV.navigation {
 background : #ccc;
 font-weight : bold;
 width : 20%;
 position : fixed;
 top : 0;
 left : 0;
 right : auto;
 bottom : 0;
 font-family : sans-serif;
 margin : 0
}

Este estilo coloca a barra de navegação à esquerda, com um plano de fundo cinza mais escuro, com 20% de largura e com uma posição fixa.

DIV.navigation hr {
  display : none
}

DIV.navigation img {
 display : none;
 width : 0;
 padding : 0;
 height : 0;
 margin : 0
}

Aqui eu escondo os horríveis ícones de navegação e as barras horizontais que por acaso apareçam na seção de navegação.

.navigation:before {
 content : "Linux & Fontes";
 display : block;
 color : Orange;
 text-align : center;
 border : outset 4px red;
 width : auto;
 left : auto;
 right : auto;
 font-size : x-large;
 margin : 1ex;
 background : #eee
}

Usando conteúdo gerado por CSS, vamos colocar um bonito ícone com o título do documento, aquele que você vê no painel de navegação.

body div.navigation a {
 display : block
}

Esta regra é importante: transforma os ícones em parágrafos.

P, DL, UL, OL, ADDRESS {
 font-size : 12pt;
 font-family : sans-serif;
 text-align : justify
}

Melhorando a aparência dos parágrafos, listas e rodapés. Aumentamos o tamanho da fonte, mudamos a família para sans-serif e pusemos alinhamento justificado.

TD.eqno {
}

body {
 position : absolute;
 left : 20%
}

Importante!!! Definimos margem esquerda para que o corpo da página não fique nem sob e nem sobre o menu de navegação e também definimos um posicionamento absoluto.

[editar]

Resumo

Para exportar um documento L^AT_EX para uso na Web é necessário usar o latex2html ou outro conversor. O latex2html é o que eu prefiro usar.
As configurações padrão do latex2html são horríveis. É necessário personalizar seu comportamento.
A personalização pode ser feita de três modos:
1. Acrescentando opções de linha de comando ao executar o programa.
2. Chamando o programa através de um script de inicialização.
3. Usando um arquivo de configuração.
Mesmo utilizando as opções mais adequadas, é possível ainda melhorar a aparência dos documentos obtidos usando CSS.
Utilizando todas as técnicas aprendidas é possível obter um documento bastante bonito.

Retirado de "http://www.tex-br.org/index.php/Documentos_para_a_Web"

Documentos para a Web

Origem: Tex-Br, a enciclopédia livre.

Conteúdo

Flexibilidade do `latex2html`

Opções de Linha de Comando

Utilizando um Arquivo de Configuração

Folha de Estilos para Documentos LaTeX

Resumo

Views

Personal tools

Navegação

Busca

ferramentas

Documentos para a Web

Origem: Tex-Br, a enciclopédia livre.

Conteúdo

Flexibilidade do latex2html

Opções de Linha de Comando

Utilizando um Arquivo de Configuração

Folha de Estilos para Documentos LaTeX

Resumo

Views

Personal tools

Navegação

Busca

ferramentas

Flexibilidade do `latex2html`