The Codest
  • Sobre nós
  • Serviços
    • Desenvolvimento de software
      • Desenvolvimento de front-end
      • Desenvolvimento backend
    • Staff Augmentation
      • Programadores Frontend
      • Programadores de back-end
      • Engenheiros de dados
      • Engenheiros de nuvem
      • Engenheiros de GQ
      • Outros
    • Aconselhamento
      • Auditoria e consultoria
  • Indústrias
    • Fintech e Banca
    • E-commerce
    • Adtech
    • Tecnologia da saúde
    • Fabrico
    • Logística
    • Automóvel
    • IOT
  • Valor para
    • CEO
    • CTO
    • Gestor de entregas
  • A nossa equipa
  • Case Studies
  • Saber como
    • Blogue
    • Encontros
    • Webinars
    • Recursos
Carreiras Entrar em contacto
  • Sobre nós
  • Serviços
    • Desenvolvimento de software
      • Desenvolvimento de front-end
      • Desenvolvimento backend
    • Staff Augmentation
      • Programadores Frontend
      • Programadores de back-end
      • Engenheiros de dados
      • Engenheiros de nuvem
      • Engenheiros de GQ
      • Outros
    • Aconselhamento
      • Auditoria e consultoria
  • Valor para
    • CEO
    • CTO
    • Gestor de entregas
  • A nossa equipa
  • Case Studies
  • Saber como
    • Blogue
    • Encontros
    • Webinars
    • Recursos
Carreiras Entrar em contacto
Seta para trás VOLTAR
2016-05-07
Desenvolvimento de software

HOW TYPOGRAPHY AFFECTS THE USER’S PERCEPTION OF THE WEBPAGE

Klaudia Migacz

Ever since I noticed that the application we prepared has expanded significantly, I have decided to find a completely new method for automation of the process of its launching.

What is typography and why is it important? The huge development of the printing art in the last decades is the result of the general development of civilization and still growing cultural needs of mankind. Typography is one of the areas which function is to hide in the shadows. Reading articles, scanning the pages and looking for information shouldn’t make user pay attention to the fonts, line spacing and text alignment nor enlarging or reducing the font size. Unfortunately, the need of invisibility also causes difficulty in understanding the significance of it. Typography is art of using the best matched forms of lettering to the media.To choose the right font face it is important to ask a lot of marketing questions as: what’s the length of the text, what’s its purpose, what’s the most important, what the text should help to achieve? And questions about technical issues about readability and aesthetics, the feel of the text (does it have to feel serious and professional or rather unofficial or decorative) and if the text will be read or just scanned by users. If we know the specification of requirements and the audience, it’s easier to choose the right typography for the projeto and aim all the goals set for the text.

HOW THE USER WANTS TO SEE THE TEXT ON THE WEB – READABILITY

The brain likes harmony, and the eye moves easily through the text if there’s adequate space for it – subsequent lines appear in predictable places. If line height, font size, paddings and margins are matched in a consolidated manner, there should be rhythm in the text block.

It is important that all the subsequent lines repeat the same rhythm, just like the other elements on the page. Picking the right height depends on the font size and face. The higher the size, the height of the line should be higher. Traditionally it is determined that the optimum ratio of the line height to the font size is 1.3 to 2 (or even more for special cases). The selection affects the size of the padding and margins that should be used. To get the elements arranged well and the distances to be accurate, it is very helpful to place the image of horizontal lines and try to put elements so they begin and end with both lines, and the text is among the latter. Defining the height of the line is a less sophisticated method than the baseline alignment but it does the job well, and at the same time is easy to código and maintain.

The least noticeable element of typography is whitespace, but at the same time its possibilities are huge. Whitespace is not only light between the words and line spacing, but also all the spacing between elements. Leaving margins blank is not a waste of space, but assisting the hierarchy. Proper selection of white spaces may also specify the nature of the design.

The font size is also important. Too small fonts, although they are often associated with professional design, are generally difficult to read or at least reduce the speed and ease of reading. Not without reason, almost all browsers as a default font size accept 16px. Too large font can be difficult to read too. Among things that determine readability there is also contrast – it’s expected to be optimal, and people are more accustomed to reading on a light background. Pages with lots of text should avoid dark graphic designs. In recent times it is common for web designers to reduce the contrast between white and black in order not to strain the reader’s eyes.

In all that, the most important thing is moderation and transparency. First of all, you can’t really see good typography – it just melts into the background and lets you read your thing. From a technical side, two fonts make a good equipa, more in a simple design is already a crowd. In most cases the selection of two fonts is sufficient to achieve all purposes. There should be one style for headers and the other for block text. Links should be easily identifiable. Poorly chosen fonts via @font-face can be cumbersome to the eye when using antialiasing. The same thing happens if fonts are carelessly used in Flash. Blurred letters tire the eyes and slow reading. Also, bold, italic, caps and other highlighters should be used alone (bold italic already too much). The decision about highlighting the text parts and what is the rule of making them should be made at the beginning.

Reading long texts requires concentration. Very often the user’s attention is distracted by ads filling column on one or both sides of the article. If we want the user to read them to the end, the number of items that can be distracting should be limited.

THE ART OF TYPOGRAPHY AS A MARKETING TOOL – TYPOGRAPHY IN LOGOTYPES AND ITS ASSOCIATION WITH THE WEBSITE OR APP PROJECT

New patterns of the typography and lettering were developed mainly by expansion of commercial advertising. Visual identification containing posters, brochures, packaging or advertisements and the most important one – the name and the logo in addition to graphic contain text information. This text in order to fulfill its purpose should be communicative, clear and attractive, and also harmonized with the illustration and the nature of the produto being advertised. Adequately formed trademark can reflect the nature and style of the organization. At the same time the positive qualities and associations symbol will be the basis for building a favorable image of the company. Each organization is unique and its identity should grow out of its roots and experiences. The identity of the company should be simple and clear because it makes up a pattern to “measure” products, behaviors and actions of the company. That’s why it should be visible and covering all of the aspects to be an affirmation. Typography is a part of company identity, that’s why it should reflect its character and values. Corporate materials should correspond with the company and its goals, this means that all of the from business cards, letterhead, the manuals of products, newspaper advertising on the website and multimedia presentations should have uniform character. Properly selected typeface with their variations and layouts carefully designed elements will create an image of the company stable and effective in operation.

Therefore, typographic elements on the website or web/mobile application should be consistent with guidelines in a company’s brand book or if the use of the designated font family is provided only for printing – at least formed in a coherent relation.

There are trademarks consisting of the logotype (text) and signs containing a symbol (graphical element) and logotype. The signs made only with the symbol are quite rare. If the trademark is only a company sign, it’s necessary to provide maximum readability in all sizes of letters. The logo should not impede the reading of the name, which sometimes happens when for example the first letter of the name is distinguished. Adhering to the principles of correct typography lets the company appear as a professional, trustworthy and reliable partner, which can only lead to success for both sides!

Artigos relacionados

Ilustração de uma aplicação de cuidados de saúde para smartphone com um ícone de coração e um gráfico de saúde em ascensão, com o logótipo The Codest, representando soluções digitais de saúde e HealthTech.
Desenvolvimento de software

Softwares para o setor de saúde: Tipos, casos de uso

As ferramentas em que as organizações de cuidados de saúde confiam atualmente não se assemelham em nada às fichas de papel de há décadas atrás. O software de cuidados de saúde apoia agora os sistemas de saúde, os cuidados aos doentes e a prestação de cuidados de saúde modernos em...

OCODEST
Ilustração abstrata de um gráfico de barras em declínio com uma seta ascendente e uma moeda de ouro que simboliza a eficiência ou a poupança de custos. O logótipo The Codest aparece no canto superior esquerdo com o slogan "In Code We Trust" sobre um fundo cinzento claro
Desenvolvimento de software

Como dimensionar a sua equipa de desenvolvimento sem perder a qualidade do produto

Aumentar a sua equipa de desenvolvimento? Saiba como crescer sem sacrificar a qualidade do produto. Este guia cobre sinais de que é hora de escalar, estrutura da equipe, contratação, liderança e ferramentas - além de como o The Codest pode...

OCODEST
Desenvolvimento de software

Construir aplicações Web preparadas para o futuro: ideias da equipa de especialistas do The Codest

Descubra como o The Codest se destaca na criação de aplicações web escaláveis e interactivas com tecnologias de ponta, proporcionando experiências de utilizador perfeitas em todas as plataformas. Saiba como a nossa experiência impulsiona a transformação digital e o negócio...

OCODEST
Desenvolvimento de software

As 10 principais empresas de desenvolvimento de software sediadas na Letónia

Saiba mais sobre as principais empresas de desenvolvimento de software da Letónia e as suas soluções inovadoras no nosso último artigo. Descubra como estes líderes tecnológicos podem ajudar a elevar o seu negócio.

thecodest
Soluções para empresas e escalas

Fundamentos do desenvolvimento de software Java: Um Guia para Terceirizar com Sucesso

Explore este guia essencial sobre o desenvolvimento de software Java outsourcing com sucesso para aumentar a eficiência, aceder a conhecimentos especializados e impulsionar o sucesso do projeto com The Codest.

thecodest

Subscreva a nossa base de conhecimentos e mantenha-se atualizado sobre os conhecimentos do sector das TI.

    Sobre nós

    The Codest - Empresa internacional de desenvolvimento de software com centros tecnológicos na Polónia.

    Reino Unido - Sede

    • Office 303B, 182-184 High Street North E6 2JA
      Londres, Inglaterra

    Polónia - Pólos tecnológicos locais

    • Parque de escritórios Fabryczna, Aleja
      Pokoju 18, 31-564 Cracóvia
    • Embaixada do Cérebro, Konstruktorska
      11, 02-673 Varsóvia, Polónia

      The Codest

    • Início
    • Sobre nós
    • Serviços
    • Case Studies
    • Saber como
    • Carreiras
    • Dicionário

      Serviços

    • Aconselhamento
    • Desenvolvimento de software
    • Desenvolvimento backend
    • Desenvolvimento de front-end
    • Staff Augmentation
    • Programadores de back-end
    • Engenheiros de nuvem
    • Engenheiros de dados
    • Outros
    • Engenheiros de GQ

      Recursos

    • Factos e mitos sobre a cooperação com um parceiro externo de desenvolvimento de software
    • Dos EUA para a Europa: Porque é que as empresas americanas decidem mudar-se para a Europa?
    • Comparação dos centros de desenvolvimento da Tech Offshore: Tech Offshore Europa (Polónia), ASEAN (Filipinas), Eurásia (Turquia)
    • Quais são os principais desafios dos CTOs e dos CIOs?
    • The Codest
    • The Codest
    • The Codest
    • Privacy policy
    • Website terms of use

    Direitos de autor © 2026 por The Codest. Todos os direitos reservados.

    pt_PTPortuguese
    en_USEnglish de_DEGerman sv_SESwedish da_DKDanish nb_NONorwegian fiFinnish fr_FRFrench pl_PLPolish arArabic it_ITItalian jaJapanese es_ESSpanish nl_NLDutch etEstonian elGreek cs_CZCzech pt_PTPortuguese