{"id":260759,"date":"2023-06-03T12:16:00","date_gmt":"2023-06-03T09:16:00","guid":{"rendered":"https:\/\/inform.click\/guia-definitivo-para-tipografia-web-regras-glossario-ideias-e-melhores-praticas\/"},"modified":"2023-06-03T13:06:00","modified_gmt":"2023-06-03T10:06:00","slug":"guia-definitivo-para-tipografia-web-regras-glossario-ideias-e-melhores-praticas","status":"publish","type":"post","link":"https:\/\/inform.click\/pt-pt\/guia-definitivo-para-tipografia-web-regras-glossario-ideias-e-melhores-praticas\/","title":{"rendered":"Guia Definitivo para Tipografia Web: Regras, Gloss\u00e1rio, Ideias e Melhores Pr\u00e1ticas"},"content":{"rendered":"

\n ‘Uma imagem vale mais que mil palavras.'\n<\/p>\n

\n Na maioria das vezes, as imagens transmitem o que elas t\u00eam a dizer. No entanto, uma imagem com texto causa um impacto mais forte.\n<\/p>\n

\n A tipografia atua como um companheiro para seus gr\u00e1ficos. A tipografia n\u00e3o \u00e9 apenas escolher uma fonte aleat\u00f3ria e um tamanho de ponto no menu suspenso do seu software de edi\u00e7\u00e3o. \u00c9 um campo especializado em design gr\u00e1fico. \u00c9 a arte e a t\u00e9cnica de organizar tipos. \u00c9 uma das habilidades importantes que podem diferenci\u00e1-lo do resto dos designers, se voc\u00ea souber como us\u00e1-lo.\n<\/p>\n

\n O que \u00e9 Tipografia?
\n<\/h5>\n

\n Antes de entrar na arte e na t\u00e9cnica da tipografia, primeiro entenda do que se trata a tipografia. Tipografia \u00e9 a parte visual do texto (palavra escrita). Um texto \u00e9 uma s\u00e9rie de palavras. Todo e qualquer texto exibido visualmente que voc\u00ea v\u00ea \u00e9 basicamente tipografia. O texto pode ser categorizado de tr\u00eas maneiras: visualmente, audivelmente e digitalmente.\n<\/p>\n

\n A tipografia \u00e9 mais do que o desenho de letras e caracteres. Inclui a escolha do tamanho do ponto, espa\u00e7amento e comprimento da linha. Na \u00e9poca em que Johannes Gutenberg introduziu a imprensa, os tip\u00f3grafos tinham que organizar as letras e os caracteres no espa\u00e7o f\u00edsico. Agora, na era dos computadores, esse trabalho \u00e9 muito mais f\u00e1cil. Voc\u00ea s\u00f3 precisa encontrar fontes de c\u00f3digo aberto, organizar letras e caracteres e pronto.\n<\/p>\n

\n Import\u00e2ncia da Tipografia
\n<\/h5>\n

\n A tipografia \u00e9 algo que voc\u00ea encontrar\u00e1 absolutamente em todos os lugares. Diga, pode ser seu smartphone, x\u00edcara de caf\u00e9, outdoor, panos e muito mais. A tipografia est\u00e1 em toda parte. A sele\u00e7\u00e3o de fonte, letra e arranjo de caracteres decide como sua mensagem ser\u00e1 transmitida.\n<\/p>\n

\n Mesmo que pare\u00e7a um fator pequeno em sua opini\u00e3o, certamente n\u00e3o \u00e9. Mesmo um \u00fanico ajuste de tipo pode mudar toda a apar\u00eancia de sua arte. Se voc\u00ea j\u00e1 notou que o Facebook testou uma nova fonte chamada Geneva em junho de 2016. Era uma vers\u00e3o um pouco mais fina e leve da fonte Helvetica original. Mas, a diferen\u00e7a entre essas duas fontes era percept\u00edvel.\n<\/p>\n

\n Regras de Tipografia\n<\/p>\n

\n Na tipografia, voc\u00ea deve escolher o tipo de letra de acordo com seu layout, grade, tema de design, esquema de cores e assim por diante. Aqui est\u00e3o algumas regras de tipografia que voc\u00ea deve ter em mente enquanto trabalha.\n<\/p>\n

\"\"<\/a><\/p>\n

\n Escolhendo a fonte certa
\n<\/h5>\n

\n Se voc\u00ea passar alguns minutos na internet, encontrar\u00e1 uma variedade surpreendente de fontes gratuitas e pagas prontas para uso. Mas isso n\u00e3o significa que voc\u00ea tenha que passar horas procurando as fontes exatas que visualiza em sua mente. Voc\u00ea pode come\u00e7ar a pintar mesmo com uma paleta limitada. Existem algumas fontes testadas e comprovadas, como a Helvetica, que nunca podem dar errado em nenhum projeto.\n<\/p>\n

\n Um tipo de letra \u00e9 uma forma de design formada por artes\u00e3os que contribuem com todos os seus esfor\u00e7os e habilidades durante um per\u00edodo de tempo consider\u00e1vel. As fontes projetadas profissionalmente oferecem uma variedade de personaliza\u00e7\u00e3o em termos de pesos e estilos para criar uma fam\u00edlia completa. Al\u00e9m disso, eles oferecem pares de kerning consider\u00e1veis, suporte para personaliza\u00e7\u00e3o de configura\u00e7\u00e3o de tipos e v\u00e1rios idiomas.\n<\/p>\n

\n A seguir est\u00e3o os termos tipogr\u00e1ficos mais importantes que s\u00e3o considerados:\n<\/p>\n

\n Tamanho
\n<\/h5>\n

\n Nem todo tipo de letra \u00e9 criado igualmente. Alguns usam aspectos gordos e largos, enquanto outros s\u00e3o finos e estreitos. Diferentes tipos de fontes podem adquirir diferentes quantidades de espa\u00e7o na p\u00e1gina.\n<\/p>\n

\n A altura do caractere \u00e9 indicada como altura X. Ao emparelhar tipos de letra diferentes, \u00e9 uma boa pr\u00e1tica usar apenas os tipos de letra que compartilham altura x semelhante. Por outro lado, a largura do caractere \u00e9 chamada de ‘largura definida', que decide quanto espa\u00e7o a letra ocupar\u00e1 e armazenar\u00e1 em buffer com outras letras.\n<\/p>\n

\n O sistema de pontos \u00e9 o m\u00e9todo usado para medir tipos desde o s\u00e9culo XVIII. Um ponto pode ser medido como 1\/72 polegadas e 12 pontos podem formar uma pica. Pica \u00e9 a unidade para medir a largura da coluna. Al\u00e9m disso, os tamanhos podem ser medidos em pixels, polegadas ou mil\u00edmetros. Depende da exig\u00eancia do projeto.\n<\/p>\n

\n Conduzindo
\n<\/h5>\n

\n O espa\u00e7o vertical entre cada linha do tipo \u00e9 conhecido como entrelinha. A raz\u00e3o para chamar isso de entrelinha \u00e9 porque as tiras de chumbo foram usadas para dividir as linhas do tipo na \u00e9poca em que a composi\u00e7\u00e3o tipogr\u00e1fica de metal era usada. A regra geral para obter um corpo de texto leg\u00edvel \u00e9 usar um valor inicial maior que o tamanho da fonte. Voc\u00ea pode usar um valor inicial maior em 1,25 a 1,5 vezes.\n<\/p>\n

\n Rastreamento e kerning
\n<\/h5>\n

\n Kerning \u00e9 o ato que envolve os ajustes de espa\u00e7o entre os caracteres. Ajuda a gerar um emparelhamento harmonioso.\n<\/p>\n

\n Por exemplo, quando voc\u00ea usa uma letra mai\u00fascula ‘A' com a letra mai\u00fascula ‘V', os tra\u00e7os diagonais do canto superior esquerdo da letra ‘V' s\u00e3o kerned com a parte inferior direita de ‘A'.\n<\/p>\n

\n Por outro lado, rastreamento \u00e9 o termo que se refere ao espa\u00e7amento de todos os caracteres que s\u00e3o aplicados uniformemente. Kerning \u00e9 semelhante ao track, mas ambos n\u00e3o s\u00e3o iguais.\n<\/p>\n

\n A medida
\n<\/h5>\n

\n A medida \u00e9 um termo que explica a largura de um bloco de texto. Para uma \u00f3tima experi\u00eancia de leitura, voc\u00ea deve considerar a medida como um aspecto importante da tipografia.\n<\/p>\n

\n Hierarquia e escala
\n<\/h5>\n

\n Todos os tipos n\u00e3o podem ser usados \u200b\u200bno mesmo tamanho, voc\u00ea deve definir a hierarquia dos tipos. Caso contr\u00e1rio, ser\u00e1 dif\u00edcil para os leitores entenderem qual informa\u00e7\u00e3o \u00e9 mais importante que as outras.\n<\/p>\n

\n Geralmente, os t\u00edtulos s\u00e3o grandes, os subt\u00edtulos s\u00e3o menores e o tipo de corpo \u00e9 um pouco menor do que os subt\u00edtulos para ajudar os leitores a entender sua hierarquia.\n<\/p>\n

\n N\u00e3o apenas o tamanho, o uso de cores, pesos e espa\u00e7amentos diferentes tamb\u00e9m podem ajud\u00e1-lo a definir uma hierarquia em seu trabalho.\n<\/p>\n

\n Gloss\u00e1rio
\n<\/h3>\n

\n Cobrimos quase todos os conceitos e terminologias fundamentais que envolvem a tipografia aqui.\n<\/p>\n

\"\"<\/a><\/p>\n