estamos criando um site agora no Photoshop e estamos usando 12pt para as fontes. Mas quando vemos as fontes na Web com 12pt, elas parecem muito maiores. Parece que temos que usar 12px na web para que pareça igual ou semelhante.
Então, minha pergunta é: como pode ser que os 12 pontos no photoshop sejam diferentes dos 12 pontos na web?
obrigado
adobe-photoshop
website-design
fonts
Steven
fonte
fonte
Respostas:
Por algumas razões.
Eles são mídias diferentes, com diferentes mecanismos de renderização de fontes. Simplificando, o Photoshop não é um navegador da web. Não é renderizado com base em CSS e HTML.
Pontos, para o tipo de medição, não é uma medida exata. Os pontos se referem à caixa delimitadora da letra - não à letra em si. As diferenças nos arquivos de fonte e nos mecanismos de renderização também podem contribuir para essa diferença.
Níveis de DPI e zoom no Photoshop vs. níveis de zoom no navegador. Eles podem simplesmente variar.
Lembre-se também de que você provavelmente não obterá a correspondência de tipo de navegador para navegador ou mesmo dispositivo para dispositivo. Existem simplesmente muitas variáveis fora de seu controle. Como tal, nunca se deve assumir que o que eles construíram no Photoshop será o que eles vêem no navegador. O Photoshop simplesmente não é uma página da web. Tudo bem como ponto de partida, mas não o trate como um plano imóvel.
fonte
O tamanho da fonte renderizada (no nível de zoom de 100%) também depende das configurações de dpi da sua imagem.
Experimente um destes:
fonte
Adicionando à resposta de Scott, a razão pela qual o tamanho da fonte é muito diferente no Photoshop ou na Web pode ser porque o Photoshop usa pontos, enquanto a Web usa pixels (ou
ems
, contra os quais eu recomendo fortementepx
).O cálculo para o relacionamento seria algo como:
Portanto, se você tiver uma imagem do Photoshop com fonte 13pt a 72 ppi, o tamanho da fonte correspondente em pixels para exibição em um navegador da web é
Você pode ver uma tabela de conversão aqui .
fonte
O Photoshop e o Navegador são diferentes, por isso é possível no tamanho do texto. Também tenho esse problema. Pesquisei no Google http://pxtoem.com Você pode ver como o tamanho da fonte funciona e qual o tamanho da fonte que você pode usar para o seu texto.
fonte
Você deve se lembrar de que o PhotoShop é construído de maneira diferente de um navegador. Portanto, o que é 12 px no PhotoShop pode ter 14 px em um site online. Às vezes, até os navegadores exibem as coisas de maneira estranha ou movem um elemento 2 px para a direita.
Quando o navegador renderiza um site, ele usa px em vez de pt. Nada ficará igual em tudo, apenas lute para que pareça bom.
fonte