Before users start reading a single word of text on a web- site, they are already judging the typography. More than any other design element, type sends instant messages about a site’s content and purpose. Typography — its size, style, and system help to tell people what all this content is actually for. The quality and tone of a website’s typography also send instant messages about the people who made the site. Good type makes you look good. Bad type makes you look bad. We’ve all landed on a website that we immediately know is a dumping ground for stolen content and crappy ads. Without even reading that come-on for pimple cream or the latest work-at-home scheme, we’re already hitting the back button in search of a more savoury place to invest our time. Type is design’s smallest atomic unit — the framework for everything we try to communicate with our boxes, grids, CSS properties, and the other elements that go into making a website. A typeface’s contrast influences how small you can set that typeface so it’s still legible on your phone. The tools we use and the choices we make affect a design up and down the supply chain. Typography is a design’s voice.

When you choose a font, you not only make yourself aware of how you affect communication, but you also put yourself in reader’s shoes. Don’t just throw up your hands and use Helvetica (or, gasp!, Arial). You can do better than that, and I’ll show you how. Let's move on and nail each and every aspect related to typography

Type and typography wouldn’t exist without our need to express and record information. This is what makes typography not only an art of communication but one of nuance and craft because, like all communication, its value falls somewhere on a spectrum between success and failure. Reading is so intrinsic to every other thing about typography, it’s the best place for us to begin. Wait wait what? Did I use the two words Type and Typography? But you might be thinking they are same! Let's make your concepts clear :

Type: Characters or letters that are printed or shown on a screen.

Typography: Typography is the art and technique of arranging type to make written language legible, readable, and appealing when displayed. The arrangement of type involves selecting typefaces, point size, line length, line-spacing (leading), letter-spacing (tracking), and adjusting the space within letters pairs (kerning).

When I first started designing websites, I assumed everyone read my work the same way I did. It’s appealing to think that’s the case, but reading is a much more nuanced experience. Reading is not only informed by what’s going on with us at that moment but also governed by how our eyes and brains work to process information. What you see and what you’re experiencing as you read these words is quite different. As our eyes move across the text, our minds gobble up the type’s texture — the sum of the positive and negative spaces inside and around letters and words. instead, our brains do the heavy lifting of parsing the text and assembling a mental picture of what we’re reading. Without getting too scientific, let’s look at the physical process of reading isn’t linear. Instead, our eyes perform a series of back and forth movements called saccades, or lightning-fast hops across a line of text. A saccade’s length depends on our proficiency as readers and our familiarity with the text’s topic. If I’m a scientist and reading, uh, science stuff, I may read it more quickly than a non-scientist, because I’m familiar with all those science words.


Thank you, folks, for reading, this article was on special request of my friend Kushal Shah! I hope you guys like it!