How Does Website Typography Evoke Emotion?

Visual marketing is an undeniably crucial part of your online presence.

Images brought a huge boost to brands’ social media and web visibility and video is set to rob pictures of that crown. It’s estimated that 80% of all online traffic will be video by the year 2020.

The thing is, writing and written content will still be with us, no matter what.

Content marketing remains – for the time being – one of the best ways to reach potential customers and create a strong online presence.

But what about website typography? Believe it or not, that can have an effect on how your brand is perceived.

The Role Website Typography Plays In Emotions

Have you ever looked at an ad and felt a certain way about the product because of the style of font that was used?

We’re willing to bet you said yes. It’s a very natural human reaction and one of the reasons typography is a key advertising element.

Whether a fantasy book uses curlicues in its font or a diner uses fat letters to convey fullness, typography has a subtle – yet important – influence on human thinking.

You need to harness this power via website typography. Thinking about how your words look will give you a leg up on the competition that sticks with the first font that pops up.

Plus, if your design is pleasing to the eye it’s more easily read and you get your message across clearly.

Basics of Website Typography

Let’s go over a few important terms that will help you master website typography.

The two main things to keep in mind are font and typeface. What’s the difference?

Typefaces are a main family of fonts. Fonts are smaller branches within the larger typeface category. For example, serif and sans serif are categories of typefaces. The popular font Times New Roman can be found under the category of serif typefaces.

Speaking of serif fonts, let’s break those down.

Serif fonts have small lines on the tops, sides, and bottoms of letters. These marks are called “serifs”.

Obviously, fonts without these markings are called san serif fonts.

Serif fonts work well in print and san serif fonts, with their clean lines, are ideal for website typography. Although san serif fonts look good, do they evoke the right emotion? Read on!

Why Use Emotions With Website Typography?

What people read on your site is a representation of who you are. Why not tap into their emotions to influence how they feel about you and your brand?

Humans are ruled by emotions. Your feelings control so much of your day-to-day decision making.

Even a humble font can access your emotions. You can create positive – or negative – associations by harnessing certain feelings.

Think of how certain brands seem “fun”, “luxurious”, or “edgy”. They know how to use website typography to get at your emotions.

Want someone to take action with your brand? Trigger their emotions. Decisions are often made from the heart or the gut and less from our rational brains.

Fonts and Brand Associations

Think of your brand. Does a certain phrase, word, or feeling come to mind immediately?

Good. Hold on to that thought while we take a detour into the psychology of fonts.

Wichita State University conducted a study with 500 participants regarding how certain fonts made them feel and the results are very interesting.

Here’s what they found:

  • Serif fonts: gave a feeling of respectability, seemed traditional and comfortable
  • Sans Serif fonts: participants felt these were modern, clean, and fresh-looking
  • Script fonts: these unique handwritten-looking fonts brought creativity and elegance to website typography
  • Modern fonts: came off as stylish and chic, also very bold
  • Display fonts: these playful fonts were seen as unique and friendly

Now you’re starting to get an idea of how you can evoke emotion with your website typography!

Readability and Functionality

A huge thing to keep in mind when designing your site is functionality and accessibility.

If the website typography is thick, confusing, and hard to read, your bounce rate will go up, especially on mobile. More and more people are consuming media from phones and tablets so keep that in mind when creating your design.

By using the right typography, you’ll keep your target demographic engaged with your content!

Talk To Your Readers

Have you ever been online and saw someone write something in all caps? How did you read it?

You probably felt like they were yelling and yet you didn’t hear a single sound. Website typography can be like that.

Although we talked about making your website readable and able to scale for mobile, that doesn’t mean you can’t have a little fun. Think about livening up your text with italics, bolds, and even different font sizes.

Italics can be used to emphasize a portion of text. You can even evoke a pinch of sarcasm if you do it right. Bold is a good choice to pump up your readers. Caps lock can do the same, virtually shouting with your text.

Combine bold and caps lock at your own risk, though!

Think about breaking up large chunks of text with a line or two in a completely different font to give your readers breathing room.

Alternate the text size to make a tiny ten point whisper or a 30 point paragraph divider. Have fun and be creative while maintaining readability with the right website typography.

Be Yourself!

While sending a picture or uploading a video might show a carefully cultivated image of yourself, it has limitations.

You can write as much as you’d like – and website typography is there to help you express yourself. Don’t neglect your customer’s emotions; use everything in your power to reach out to them and connect in a meaningful way. Ultimately, your customers are buying you, so make sure you infuse your voice into everything that you do.

If you’re ready to work with an amazing team on bringing your unique voice to your site, contact us at Studio 98. We’ll help you craft an online presence that not only gets results but speaks to people’s emotions.

Have you seen a font that really tickled your fancy? We want to hear about it! Share it with us and show us your favorite website typography!