Typography: Giving My Design a Voice

Color had set the foundation, but typography gave my design its voice.

A New Layer of Design

After working on my app’s colors and accessibility, it felt like I had made real progress. The design was starting to feel more intentional, cleaner, and easier to navigate. But something was still off.

It wasn’t the layout or the colors this time—it was the text.

I had spent so much time focusing on color that I hadn’t really thought about the words themselves. Not just what they said, but how they looked. And once I started paying attention, I couldn’t stop. Typography, just like color, was shaping how my design felt and functioned, and I had barely scratched the surface.

Noticing Typography Everywhere

Once this was on my mind, I started noticing typography everywhere—in the apps I used, on websites, even in physical spaces like restaurant menus and street signs. Some fonts felt inviting, while others felt outdated or hard to read. Some layouts guided my eyes smoothly, while others made me work harder to understand the content.

I asked myself:

  • Why did news websites favor serif fonts?

  • Why did tech products lean toward sans-serif fonts?

  • Why did some apps have text that felt overwhelming, even when the font was simple?

I didn't have the answers, but these questions pushed me to pay closer attention.

Looking at My Own Typography Choices

When I went back to my own project, I started noticing things I hadn’t before:

  • The body text looked sleek at first glance, but on smaller screens, it was hard to read.

  • My headings and body text were too similar in size, making the content blend together.

  • Some paragraphs felt cramped, while others had too much space, breaking up the flow.

I had been making typography choices without really thinking about how they affected readability. So, I started tweaking things.

Fixing My Typography for Better Usability

I made three key changes to improve my typography:

1) Choosing the Right Fonts:

  • I used a slightly bolder, more distinctive font for headings to create contrast.

  • I kept decorative fonts to a minimum—because while they look cool, they don’t always support usability. I was able to find a common ground in between style and usability.

2) Creating a Clear Hierarchy:

  • I established consistent font sizes for headings, subheadings, and body text.

  • I ensured there was enough contrast between text sizes so users could scan the content easily.

  • I followed best practices like keeping body text at 16px minimum for readability.

3) Improving Spacing for Accessibility:

  • I adjusted line height to at least 1.5x the font size for easier reading.

  • I increased letter spacing slightly on smaller text to improve legibility.

  • I made sure buttons and links had enough padding so users could tap them easily on mobile devices.

Typography and Accessibility

Since accessibility had been on my mind with color choices, I wanted to apply the same thinking to typography. I checked contrast levels, avoided relying on color alone to differentiate text, and tested my design on different screen sizes to make sure the text scaled properly.

I’m still figuring things out, but fixing my typography made a bigger difference than I expected. It didn’t just make the design look better, but it made everything feel clearer and easier to use. There’s so much more to learn, but for now, I’m just excited to keep experimenting and improving as I go.