5 de February de 2007

Como imprimir páginas que não foram feitas para serem impressas

Eu entendo que a maioria das pessoas por aí não tem nenhum interesse em imprimir páginas da internet. Mas existem outros que querem! O principal problema é que a maioria das páginas não foram feitas para serem impressas. É aí que entram o Firefox e suas extensões. Mais especificamente uma chamada Web Developer. Entre (muitas) outras coisas ela permite que vocē mude o CSS de uma página. Tudo bem que essa dica não vai servir pra quem não sabe CSS, mas saber só um pouco pode ajudar bastante os seus pobres olhos (e diminuir o desperdício de papel): as mudanças feitas no CSS através do Web Developer são levadas em consideração quando a página é impressa!

Por exemplo: essa entrevista com Jonathan Barnbrook me interessou e eu achei melhor imprimir para ler com calma. Não precisa ser nenhum especialista para ver que ela não vai ficar muito bem quando impressa. Mais precisamente, vai ficar assim:

Veja como a fonte está incrivelmente pequena e um monte de papel está sendo simplesmente desperdiçado (a impressão tem 7 páginas). Vamos mudar isso: edite o CSS indo em “Edit CSS” (no menu Ferramentas-> Web Developer-> CSS). Escreva o seguinte depois do código que aparece na janela lateral que acaba de abrir:

* {
background: white;
font-size:12.5pt;
}
table {
width:100%;
}
i {
font-family:Georgia;
font-size:16pt;
font-style:normal;
font-weight:bold;
}
.bodytext{
font-family:Georgia;
font-weight:bold;
}
p{
text-align:justify;
font-family: Times New Roman;
margin:0;
padding:0;
margin-top:0.5em;
line-height:1.5em;
text-indent:25px;
font-weight:normal;
}
.headings {
font-size:24pt;
}

E veja o que acontece:

As fontes ficaram maiores, diferentes e muito mais legíveis quando impressas. Todo o papel está sendo usado e, apesar de o artigo continuar ocupando 7 páginas, não estamos simplesmente jogando papel fora: o papel está sendo usado para tornar a leitura mais agradável (vocē poderia ter usado um espaçamento de linha menor, modificando o “line-height”; poderia usar fontes menores também). E essa adaptação foi bem rápida e simples, quanto mais vocē precisar mudar a página, mais o CSS vai ser útil.

Um outro truque que merece ser mencionado é: para uma página que tem muitos links e vocē não quer que o texto simplesmente fique azul quando impresso é possível adicionar o endereço do link depois da palavra usada para criar o link; basta usar essa não-muito-famosa regra CSS:

A:after {
/* Expand URLs for printing */
content:” (” attr(href) “) “;
text-decoration:none;
}

Veja esse exemplo:

E como ele magicamente vira:

Espero que tudo isso tenha sido útil.

Filed by rhwinter at February 5th, 2007 under css, firefox, codigo
2 persons have commented this post