• ARTIGOS
início | novidades | web | artes gráficas | multimídia | preços | orçamento | artigos | mapa
PC x Mac: como resolver esta questão?
artigos >> tipologia >> PC x Mac: como resolver esta questão? >> pág. 2
(artigo originalmente publicado no site Aranha Internet e design)

Fábio Carvalho
12/8/2001

o que pode ser feito?

Quanto aos "nomes" das fontes do conjunto básico, quando você for usar a tag <font face> para especificar qual fonte você quer que seja usada para um bloco de texto, especifique não apenas uma fonte, mas toda uma lista de alternativas. Veja um exemplo:

<font face="Verdana,Arial,Helvetica,sans-serif">seu texto entra aqui</font>

No exemplo acima, o browser tentará mostrar o seu texto com a fonte Verdana. Se ela não estiver instalada no, ele tentará usar a Arial (PC), ou Helvetica (Mac), e assim por diante.

Esta técnica é recomendável não apenas para HTML tradicional, como acima, mas também quando do uso de Cascading Style Sheets (CSS).

<style type="text/css">
<!--
.texto-principal { font-family: Verdana, Arial, Helvetica, sans-serif }
-->
</style>


Quanto ao problema da diferença de resolução, e conseqüentemente de tamanho do texto, entre as plataformas, sugiro duas soluções. A primeira, mais simples (mas menos eficiente) é escolher um tamanho de texto que seja pequeno mas ainda legível no Mac, e maior mas não necessariamente grande no Windows. Isto nos limita a algo em torno de 9 pontos (equivale a size=2, aproximadamente). Mas lembre-se que desta forma você garantiu apenas a legibilidade do texto, mas não sua distribuição e alinhamento.

A segunda solução, mais completa e complexa, utiliza-se de Cascading Style Sheets (CSS), pois desta forma você pode especificar o tamanho do texto em pixels, ao invés de pontos. Desta forma, você estará falando o mesmo "idioma" em ambas plataformas, e terá certeza que seu texto será apresentado o mais igual possível, em qualquer um dos dois sistema. Veja o exemplo abaixo:

<style type="text/css">
<!--
.titulo {font-family: Arial, Helvetica, sans-serif; font-size: 12px;}
.corpo {font-family: Arial, Helvetica, sans-serif; font-size: 10px;}
-->
</style>


Como pixel é a unidade de medida das imagens em ambas as plataformas, você terá certeza também que os blocos de texto irão fluir de uma única forma em torno das imagens.

considerações finais

Mesmo que você empregue todas as técnicas apresentadas aqui, não há com ter 100% de certeza que suas páginas estarão OK tanto no PC quanto no Mac, e nem mesmo entre computadores da mesma plataforma, pois devemos lembrar que os browsers podem ser configurados de forma a mostrar o texto de uma forma geral maior ou menor que o padrão, pode-se desabilitar o uso de CSS ou ignorar as especificações para fontes

Além disso, há ainda um (pequeno) percentual de pessoas que usam browsers antigos, que não suportam CSS ou mesmo os comandos HTML para fontes. Portanto, você deve sempre projetar suas páginas tendo em mente a possibilidade do texto fluir na página de forma diferente da desejada. Se a relação entre o posicionamento de texto e imagens for crítica, use tabelas para posicionar os elementos de suas páginas. Mesmo que um bloco de texto encolha ou expanda, as imagens permanecerão ao menos próximas do local planejado originalmente.

Finalmente, um conselho antigo mas muito válido ainda: Uma vez tudo pronto, teste suas páginas no maior número de configurações que você puder, para ver até que ponto elas "sobrevivem" à selva de diversidade de máquinas da Internet. Se você souber qual a configuração mais comum do seu público alvo, tanto melhor: concentre-se nesta, mas sem deixar de lado os recursos que ensinamos para que você consiga a maior fidelidade possível entre o seu projeto original, e o que acontece em cada diferente máquina. Bom trabalho!

<< volta
neXt digital design © 1999/2000/2001/2002
www.next.page.com.br
direitos reservados - é expressamente proibida a reprodução total ou parcial de textos, ilustrações
imagens, fotos, ou qualquer outro material publicado nestas páginas, sem autorização prévia.

início | novidades | web | artes gráficas | multimídia | preços | orçamento | artigos | mapa