Find Your Perfect Font! How to Find Your Best Font for Writing Online
Short of time? Skip to Step 5 for the list of high-quality fonts to choose from.
Or, if you want to go deeper and see the full picture of the designer-at-work, just follow along. I will show you the nitty-gritty of how my font picking process works.
When I wrote about my writing process last week, I knew I had to do the same with my design process. There was a problem though. It would be so long. I was sure that would bore the hell out of non-designers. So, instead of going into the tiniest detail of the Deep D process, I thought it would be more beneficial to cover something more accessible like choosing an appropriate font for writing online.
Before we go on further, let me just say I agree with you that picking a font is a very small part of the successful online presence equation. Just like writing a high school or college essay, sticking with a default font is the way to go. No question about it. Your bang for buck ratio is probably better if you spend your resource on improving your photos.
However, a really neat thing about picking your perfect font is that you can change how you look, sound, and feel online without hiring anyone or going through years of training.
You don’t have to be able to draw like an artist or do some under-the-hood developer stuff. You could just pick a font from the settings of your web service, right? Oh, did I mention a lot of fantastic-looking fonts are available for free?
Choosing a font is like choosing an outfit. It could improve your online style and life’s outlook by following a simple recipe: Put on a piece that fits you.
Let’s say the default font is like dressing appropriately for work. Some people dress appropriately with wardrobes that fit them well, and those who wear something too big/small and shortchange themselves.
What I’m saying is that anyone can pick the right font for him/herself. You just have to know a few simple tricks and take a time to apply them to your online self.
One more thing before we get started. I chose Not Boring newsletter and its author, Packy McCormick’s website and logo for this typeface styling project. On top of publishing an awesome newsletter (more on this later), he happens to be a really nice person. I know because when I wrote to him, he responded to a complete stranger like me in a completely nice manner. Not everyone does that and I appreciate that.
Now, taking a cue from his newsletter, “let’s get to it!”
Step 1: Identify His Brand Attributes
For any design project, I want to get to know my client as much as I can so that at the end of this step, I would know which goal post to aim for. More specifically, I want to find out the essence of his brand condensed into a few keywords that we could both agree upon.That means reading his newsletter and website audit is in order.
I’m a fairly new subscriber to his newsletter, and to be honest, I’ve only read a couple more posts for this project. Fortunately, he was nice enough to do the heavy lifting for me by clearly stating his focus: Business strategy and pop culture.
My first impression was that the combination felt mutually exclusive to me as I drew two big imaginary circles separated from each other. I suppose The Not Boring newsletter needs to have two personas.
In one circle, there is a business face with an MBA persona dealing with ROIs and number-crunching boring business stuff. Then on the other circle, there is another persona following religiously The Kardashians and Tik Tok trendsetters.
Trying to integrate these two tribes with different interests into one coherent narrative seems very ambitious and intriguing to me. And like me, his readers are liking it. The expanding readership tells that his strategy has been working very well. (You can subscribe and read it for yourself from here.)
Next, let me analyze his current font, logo, and website.
His current font appears to be Droid Serif which is an open-source font for use in the Android platform.
His current logos (above left) for both his name and the newsletter are a circular letter mark with a light grey background containing outlined yellow letters. His initial is fine but depending on the screen size, Not Boring could be hard to read on a small logo. Also, there may not be enough color contrast between the light grey and light yellow (above right).
Finally, for the website (above left), it is hosted by Squarespace and the template appears to be a very popular one as I have seen it more than a few occasions. The simple monochromatic color palette works fine and dandy.
Step 2: Understand How the Brand Attributes are Expressed Visually
Once I know the keywords defining Packy’s brand, I want to know how others are treating the same concepts visually.
For the “business strategy,” I analyzed logos from global brands because when I think of successful businesses, they are the ones with the biggest mind share. I know there are far more small businesses in existence but the smaller businesses tend to imitate the bigger ones for better or worse, so keeping in mind about how those big brands visually behave themselves is a good starting point.
As I went through the logo collection by Design Beep (above left), I observed that many of them rely on sans-serif typefaces. Because sans-serif style has no decorative pointy thingy and varying stroke width like serif typefaces, they have simpler look and are easier to read. Even big fashion brands are abandoning their “fashionable” serif fonts to more flat-looking styles of sans-serif in the past few years. Also they are very good at providing high contrast to make the logo instantly recognizable. Due to the sheer size of their organizations, they have the obligation to make their visual design accessible to all parties. But sometimes, their professional-look comes with the cost of losing a distinct brand voice.
For the “Pop Culture,” I googled it to see what kind of images may turn up. The result (above right) included images with vibrant (or just loud), highly saturated colors. Their fonts tend to have round and chunky lines with occasional handwritten variety thrown in. Furthermore, they often add shadows, thick outlines, and 3D letter arts like arch and slope. Putting all these together, the concept of pop culture exhibited a whole lot more of individual character sans the refinement of big brands. In other words, you can see them screaming for attention.
Step 3: Blend and Define the Target Font
Having seen other brands as the references, I am ready to merge the two different concepts of “business” and “pop culture” into one visual language. The target typeface has to represent the brand voice of Not Boring by conserving the sophistication of big businesses while bringing out the real human being with a multitude of interests.
Step 4: Find a Brand That’s Already Using the Target Font
Are there any brands that speak the visual language of business and pop culture combined?
Off the top of my head, Wallace and Gromit (above left) came to my mind. It’s a classic stop-motion animation film series featuring Wallace the WFH inventor and his faithful four-legged friend, Gromit. They don’t have much in common with Packy on the surface. But I could feel something in sync between them.
For a starter, Wallace is a tech-savvy businessman. He has been featured as a serial entrepreneur with ranging business interests. In one film, he was renting a room to a criminal mastermind. Then in other films, he was in window cleaning, pest control, and baking businesses. As for the “Pop Culture,” the film series clearly checks the box as it has been winning multiple Oscars throughout its 30-year history.
Another brand that popped up with some loosely linked similarities is Casamigos (above right). Their brand story goes like a bunch of guys making a beverage they like and began selling to the public. It then became a hit and their business got bought by a multinational company (Business). And their product so happened to be tequila (Pop culture).
Both Wallace & Gromit and Casamigos cater to different demographics and have unique visual styles, but when looked from their brand attributes, I could make some nonlinear connections to add extra breadth to the design process. It’s always nice to have multiple sources of inspiration to flex my creative muscle.
Step 5: Choose Your Font from the List of 88 Fabulous Fonts
This is the step I actually start comparing fonts one by one. But there are thousands of fonts out there. If you go to a site like Whatfontis, they claim to have 98,552 free fonts and 533,790 commercial fonts indexed. Sadly, many of the fonts are inappropriate for professional use owing to their low quality. They are not just plain ugly but have a shoddy design with missing characters and poor spacing between each letter. Sticking with your default font is 100x better then.
So, does that mean only designers and artists have access to beautiful typefaces? Absolutely not. Let me narrow it down like 7000 times for you. Instead of searching from over 600,000 fonts, you will only have to check out a shorter list of high-quality fonts.
Here is a link to my favorite fonts. (Depending on how you count them there are 60-80ish fonts. Hey, if you make a designer count, you get a “designer math.”)
61 Best Logo Fonts and How to Pick the Right One
These fonts are used by top-level designers and stood the test of time as they have gone through multiple iterations (i.e. Garamond).
As for Not Boring, I probably went through more than two hundred fonts from the lists above (and more) and selected two of them: Foco and Posterama.
I liked Foco (above left) for its soft and round edges. It looks cute and welcoming but it doesn’t lose the functional legibility of a serious enterprise. Posterama (above right) shares similar soft edges and legibility features but comes with a bit more of an artsy vibe with distinct letterforms to spice it up a notch. Hmmm… Which one speaks Not Boring better?
Step 6: Dig Deeper for Extra Credit
I could’ve stopped there, but I wanted to go a step further. I typed “alternatives” in the search field next to Foco and Posterama to keep exploring. The result didn’t disappoint—It revealed two more candidates. Plume and Regulator Nova.
Plume (above left) is a modern slab serif typeface packing the visual punch that a respectable business needs while keeping everything together with good ol’days-honesty seen in Clarendon.
Regulator Nova (above right) is a clean sans-serif typeface with a whimsical lowercase “g” and plenty of typographical heft. It also has many weight variations (15 to be specific. Plume has 6 only), so it’s a very versatile collection of fonts that might come handy in the future.
At last, it’s time to decide which font to use for Not Boring.
Foco may look too yummy and skewed toward the pop culture side. Posterama seems to have a too strong of character. Plume’s lack of weight variation could become restricting down the road. All of them are great typefaces but for Not Boring brand, I’d feel more comfortable with Regulator Nova. It demonstrates the best balance of business and pop culture, and its versatility is hard to ignore from a practical point of view.
Step 7: Logo Research
Since we’ve come this far, why not go for a logo-to-go? I don’t want to just leave him hanging with a set of fonts. I want to have something of value that he could actually use right away. So, based on his new typeface, I’m going to design a wordmark logo.
Just like what I did with the beginning of the typeface search process, I need to understand the market by looking at lots of references. Simply googling a “logo with a letter P,” informed me of a couple of things.
Because his new logo is intended to be used for his website and newsletter, it needs to be in a format of a wordmark with maximum legibility in mind. A graphic symbol like the swoosh of Nike looks cool but it doesn’t automatically tell what Not Boring stands for. It needs to be explained in words. Likewise, monoline logos could be interesting ways to show off his personality but it might be difficult to read in a smaller screen using his current website.
Step 8: Logo Design
Using Adobe Illustrator, I made a bunch of rough sketches to test out logo variations derived from the new typeface.
Step 9: Logo Application
The logos are ready! I chose the round background to honor the fun vibe present in the original logo. The fluorescent yellow outlining the letters is reused to decorate Packy’s portrait. Although the new color scheme is simple black and white, I arranged the placement and shape of the letters in “Not Boring” ways to keep things amusing while maximizing its legibility with the bold uppercase letters. For his website’s homepage, I swapped the original Droid fonts to Regulator Nova and cropped his portrait in a circle.
Step 10: Writing about the design
All my design projects end with writing to go with it. The aim is threefold.
First, writing about design helps me design better. If forces me to review my design from a more logical point of view.
Secondly, writing makes me more accountable to my clients. I need to be able to clearly explain my reasonings behind design decisions so that the clients could feel we are on the same page and that the design is hitting the intended business targets.
Finally, writing about my design process provides a necessary context to make it more share-worthy.
When my design is explained in plain everyday language, it’s much easier to share with everyone including designers and non-designers alike. Carefully curated Instagram photos and sleek designs are pleasant to look at but they are so easy to swipe away too. They provide instant gratifications, but they don’t stay.
And so, making a decent design is just a starter. Ugly websites get clicked away in less than 15 seconds. But to meaningfully engage with customers, I need to provide real values like context, or more simply, a story. That’s why in this piece, I tried to tell you my story about how I picked a font and designed a logo.
I hope something was interesting for you and if you know a better way of doing it, do let me know!
Also, if you are an online writer and/or solopreneur with a website, I’d be happy to pick a perfect font for you, free of charge! I’m in the process of building my portfolio, so your help would be much appreciated!
Thanks for reading and see you next time!
