Tenho uma fonte de 40 pixels que estou tentando traduzir em imagens personalizadas. Estou tentando corresponder exatamente ao tamanho da imagem, mas “Estou tendo alguns problemas para obter o tamanho exato. Basicamente, o que acontece é isso. Quando uma fonte diz que é X pixels, o que isso significa fisicamente?

Comentários

Resposta

Esta é uma excelente pergunta, que tem uma resposta bastante insatisfatória.

O o tamanho do tipo, seja especificado em pixels, pontos (1/72 “) ou milímetros, é a altura de um em-quadrado, uma caixa invisível que normalmente é um pouco maior do que a distância do ascendente mais alto ao descendente mais baixo.

Dado que esta é uma medida um tanto arbitrária que

  • é dependente do design técnico exato da fonte
  • não pode “ser medido com precisão a partir de um impresso ou amostra rasterizada

não é muito significativo ou útil, exceto como uma aproximação.

No seu caso, determine o tamanho que você precisa especificar no Photoshop para corresponder à renderização do navegador por experimentação. Você deve achar que esta é uma proporção constante para qualquer fonte, mas eu não esperava que fosse o caso se você mudar de navegador ou sistema operacional.

Resposta

Hora ASCII! Finja que as duas caixas abaixo são peças de chumbo de 1900 ou mais. Naquela época, as fontes eram fundidas em chumbo (ou roteadas em madeira). Para o tipo a ser definido em uma impressão travamento, eles deveriam ser conectados a blocos sólidos. É daí que vem a dimensão do tipo (em pontos):

+--------------+ +-------------+ <----+ | | | | | | XX | | | | | X X | | | | | XX XX | | | | | XX XX | | X | | XXXXXX | | X X | Point size of the type | XX XX | | XXX | | XX XX | | X X | | | XX XX | | X X | | | XX XX | | | | | | | | | +--------------+ +-------------+ <----+ 

Observe os dois as letras acima têm tamanhos diferentes, mas a caixa delimitadora é a mesma. Como tal, em termos de pontos, ambas as fontes têm o mesmo tamanho.

Hoje em dia, não fazemos muita digitação em chumbo e madeira e a maior parte é digital. No entanto, o conceito de dimensionamento em pontos ainda existe em que existe uma caixa virtual que tem a mesma altura para cada letra em que o tipo é colocado. Novamente, é esta caixa virtual que define o tamanho do ponto, em vez das medidas físicas das próprias formas das letras. O tamanho real das formas das letras costuma ser menor do que o tamanho do ponto (mas também pode ser maior).

Medir o tipo em pixels não funciona por causa disso, entretanto, você pode “definir” o tipo em pixels em CSS e similares. O navegador faz uma tradução da melhor maneira possível entre o tamanho em px declarado. Mas é sempre uma estimativa confusa.

Em última análise, não há maneira precisa de obter duas formas de letras exatamente do mesmo tamanho, a não ser olhando para elas visualmente e alterando o tamanho de cada uma até que você as veja como sendo do mesmo tamanho.

Comentários

  • Em seu computador, você calcula Pontos para Pixels como este PX = Pontos * SystemDPI / 72. DPI em um mundo de vídeo (monitor) é um valor puramente arbitrário introduzido pela Apple em 1984. Os dispositivos de vídeo usam apenas pixels; DPI não ‘ existe no mundo do vídeo / imagem. As fontes modernas são baseadas neste conceito onde 1 ponto, 1/72 é definido como 1/72 de uma polegada.
  • @AbdiasSoftware Sim, 1 ponto foi calculado para 1/72 de uma polegada e o primeiro O Mac tinha uma tela de 72 ppi. Mas não tenho certeza do que isso tem a ver com a pergunta feita ou a resposta que dei. O fato é que as fontes, sejam elas digitais ou analógicas, têm uma caixa delimitadora e é a essa caixa delimitadora que o tamanho se refere.

Resposta

O “tamanho da fonte” de uma fonte se refere à “s” altura da fonte, que não é necessariamente igual à altura de caracteres específicos na fonte.

Normalmente a altura em de uma fonte segue a mesma ideia básica – será aproximadamente definida como a distância do descendente mais baixo (como a parte inferior da letra g) para o ascendente mais alto (como o topo da letra h):

Como você pode ver, nenhuma das letras individuais cobre toda a extensão.

Com fontes digitais, a “altura em” de uma fonte é uma escolha feita pela fonte designer, e não precisa obedecer a esta convenção: um designer de tipo digital pode escolher qualquer base para o tamanho do em. No entanto, as fontes ainda tendem a aderir, pelo menos aproximadamente, ao tipo de convenção descrita acima.Antigamente, quando o tipo consistia em blocos de metal, a “altura em” era a altura de um desses blocos, que precisava ser alta o suficiente não apenas para qualquer caractere nessa fonte, mas também para quaisquer ascendentes, descendentes e acentos. / p>

Agora, muitas fontes modernas incluem acentos em letras maiúsculas também (como Ć) – esses acentos se estendem fora do tradicional ascendente tipográfico e, portanto, esses (e possivelmente outros caracteres especiais) ficam fora do topo do “em”. Por razões históricas, não ajustamos o tamanho do em para permitir isso, mantemos o tamanho do eme apenas estendemos para fora dele – qualquer tipógrafo que use tais acentos precisará garantir que haja espaço para eles se estenderem, embora geralmente o lacuna de linha é adequada no corpo do texto.

A lacuna de linha no corpo do texto é um espaço deixado entre o descendente de uma linha de texto e o ascendente da linha abaixo dela – ou seja, o “tamanho da fonte” não inclui essa medida de lacuna de linha. Ele pode ser influenciado pelo campo CSS line-height, onde 1.4 significa que a lacuna de linha é 0,4 vezes a altura em e, portanto, uma linha inteira do corpo do texto ocupará 1,4 vezes a altura em incluindo a lacuna de linha. Em outras aplicações, a lacuna de linha pode ser especificada de forma diferente: processadores de texto geralmente especificam em termos de um múltiplo de espaçamento entre linhas “simples”, mas ao contrário do CSS, normalmente espaçamento “simples” não significa nenhuma lacuna de linha, mas alguma lacuna de linha “padrão”, onde o ap plicação tenta criar um padrão baseado nos metadados do arquivo de fonte. Existem vários padrões para especificar métricas na fonte (por exemplo, no Truetype, existem diferentes padrões para Mac e Windows / OS2), então a lacuna de linha padrão pode variar entre aplicativos e sistemas operacionais.

Agora, mesmo se um designer não segue uma convenção previsível para sua altura em, isso ainda não informa o tamanho das letras maiúsculas (altura da tampa) ou o tamanho de, digamos, o (altura x ou linha média), pois podem variar livremente entre as fontes em relação à altura ascendente. No entanto, dentro de uma família de fontes, geralmente são consistentes. Por exemplo, Times New Roman Bold e Times New Roman Regular têm os mesmos tamanhos de caracteres para o mesmo tamanho em, que deve incluir ascendentes, descendentes, cap-height e x-height.

Comentários

  • Sim – existem convenções (como em estar da parte inferior de ‘ g ‘ até a parte superior de ‘ h ), mas ainda há variação, e os formatos de fonte não mantêm os designers com essas convenções.

Resposta

Experimente digitar o caractere da barra vertical (“|”) e meça. Se eu dupliquei sua situação corretamente e seu anti-serrilhamento não a está desfocando muito, deve ser 22px.

22px representa a altura do bloco do tipo. Mas cada caractere preenche o bloco de maneira diferente. A “g “ou” q “ocupará a região inferior desse 22px, enquanto letras maiúsculas e letras minúsculas como” b “ou” d “ocuparão as partes superiores. ” | “é um dos únicos (se não o somente) caractere que preencherá inteiramente o espaço de 22 pixels.

Não sei como comparar as configurações de CSS, mas isso explica como o Photoshop interpreta a altura do texto .

Comentários

  • Além disso, você pode definir duas fontes do mesmo tamanho e ‘ ll frequentemente vemos que as formas das letras, elas mesmas, não são. Eles simplesmente têm o mesmo tamanho do ‘ bloco ‘.
  • O tubo nem sempre preenche o espaço total alocado. É ‘ uma preferência do designer de tipo. Ele ‘ geralmente corresponde ao topo dos ascendentes e inferior dos descendentes, mas mesmo assim, o espaço alocado para os caracteres ainda pode ser muito maior.
  • O caractere da barra vertical nem sempre é igual ao tamanho em (por exemplo, ” altura total “) da fonte, não. Na verdade, normalmente será menor.
  • Os caracteres de desenho de caixa verticais devem, teoricamente, cobrir toda a altura do em (e provavelmente se sobrepor uma pequena quantidade). Mas muito poucas fontes incluem esses caracteres. A barra vertical normal (|) NÃO será geralmente igual ao tamanho em. Ele não ‘ nem mesmo faz isso nas fontes principais da Microsoft (Arial, Geórgia, etc.).
  • O caractere de barra vertical não ‘ para preencher toda a altura. Acentos para caracteres maiúsculos, por exemplo ” Á ” estão posicionados acima.Compare-se: ” Á ” ” | ”

Resposta

Você tem certeza de sua fonte é medido em pixels? Na maioria das vezes, as fontes são medidas em pontos. Um ponto é 1/72 de polegada. Portanto, uma fonte de 40 pt tem 40/72 “ou 5/9” de altura. O retrocesso é que essa é a dimensão do topo dos ascendentes nas letras altas até a base dos descendentes nas letras que ficam abaixo da linha de base. É por isso que a altura x às vezes é usada, conforme mencionado acima. Essa é a altura das letras minúsculas que não ficam para cima ou para baixo.

De qualquer maneira, as medidas nunca são exatas de qualquer maneira, infelizmente. Você só terá que medir e calcular (e / ou tentativa e erro) para realizar o que está tentando.

Comentários

  • Mas os pontos são relevantes apenas para o tipo físico (impresso, entalhado, gravado, etc.).
  • Não totalmente correto. O tipo isn ‘ t medido do topo dos ascendentes até a base dos descendentes, mas sim ‘ é medido por uma caixa delimitadora que pode ou não se correlacionar com a altura ascendente / descendente. Isso remonta aos dias de chumbo e tipo de madeira, onde o tipo era colocado em um bloco. Era a altura desse bloco que ditava o tamanho do rótulo. Como tal, duas fontes, ambas definidas em 12pt, podem ter tamanhos muito diferentes em comparação uma com a outra. (Não consegui ‘ entrar no fato de que 1pt não ‘ t tradicionalmente = 1/72 de polegada …;)

Deixe uma resposta

O seu endereço de email não será publicado. Campos obrigatórios marcados com *