ruído / noise » css http://ruido.rhwinter.com noise, dust and heat Mon, 08 Mar 2010 18:29:47 +0000 http://wordpress.org/?v=2.9.1 en hourly 1 Como imprimir páginas que não foram feitas para serem impressas http://ruido.rhwinter.com/2007/02/05/como-imprimir-paginas-que-nao-foram-feitas-para-serem-impressas/ http://ruido.rhwinter.com/2007/02/05/como-imprimir-paginas-que-nao-foram-feitas-para-serem-impressas/#comments Mon, 05 Feb 2007 11:46:50 +0000 rhwinter http://ruido.rhwinter.com/2007/02/05/como-imprimir-paginas-que-nao-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:

Typographer interview before applying CSS

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:

Typographer interview after applying CSS

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:

Example of simple blue linked text

E como ele magicamente vira:

Example of expanded URL

Espero que tudo isso tenha sido útil.

]]> http://ruido.rhwinter.com/2007/02/05/como-imprimir-paginas-que-nao-foram-feitas-para-serem-impressas/feed/ 2