DEV Community

Cover image for What I Learned from a 20-year-old Book on Web Design
Gabe Romualdo
Gabe Romualdo

Posted on • Edited on • Originally published at xtrp.io

What I Learned from a 20-year-old Book on Web Design

A Quick Background

At my school (yes, I am a teenager), there's a school library, which I go to often. One particular day I decided to see if they had any books on web design and development. I've been building websites for a while, but, just for fun, I wanted to see what my school's library had to offer.

I wasn't expecting much, but, to my surprise, there was one book available, called "Don't Make Me Think" by Steve Krug. The cover said on the bottom "A Common Sense Approach to Web Usability". I picked it up, and as I flipped to the front cover, I noticed the copyright statement: © 2000 Steve Krug.

Wait. This book was published before I was even born. Before the web had even existed for more than a decade. Before HTML5 and CSS3 were the standard and before Google Chrome even existed.

This raised a few red flags in my brain, but I reluctantly continued reading. At this point, I really wasn't expecting much from this book.

But I can say now that after reading it, it was worth it. Because a lot of the general principles and user behaviors that were present 20 years ago on the web are even more prevalent now, and the lessons of web design the book teaches are still very applicable today.

Lesson 1: Everything on a Web Page Should be Self-Explanatory

Krug starts off with a "simple fact of life": We don't read pages. We scan them.

Users are generally in a rush, and most definitely will not read everything on a webpage. If your page has long blocks of text or lots of things going on, users will definitely not read everything.

As Krug explains, users figure things out as they go along, looking for things to click on, reading big headers and looking at images.

What does this mean for designers?

Since users only scan pages, pages have to be organized and self-explanatory.

A great way to do this, as Krug explains, is by using web conventions. Web conventions are sets of components in websites that are used everywhere and have really caught on with users.

Examples of common web conventions include:

  • The Main Navbar
  • Carousels
  • The Shopping Cart Icon
  • The Footer
  • Tabs

As Krug writes, it is important to use existing conventions rather than trying to come up with your own. If you use a convention that your users have never seen before, then they won't know how to use it, and it's much less likely to be effective.

As for making a site organized, Krug gives a few conventions and tips, which include.

  • Use headers, subheaders, and smaller headers to indicate hierarchy
  • Separate a webpage into clearly defined areas
  • Use nested sections for subsets of things
  • Make it obvious what's clickable

In general, Krug says, things that are related logically should be related visually.

Lesson 2: Remove Useless Content

Krug gives another rule in Don't Make Me Think, which is "Remove half of the words on a webpage. And then remove half of what's left."

This rule relates to the previous section, because users won't read everything. And the less content there is on a webpage, the more likely a user is going to see and look at what is actually important.

Krug gives the huge example of "happy talk". Happy talk is the introductory text and instructions on a webpage. Unfortunately, as Krug says, most users will only glance at that text. And that's why, in Krug's words, "Happy Talk Must Die".

Removing useless content on a page, especially text, will likely improve user engagement, and make your site more usable and elegant.

Lesson 3: Make the Homepage Straightforward

The homepage is undeniably the one the most, if not the single most important page on any site.

The homepage of a site has two purposes:

  • Tell the user what the site is about
  • Show the user where to start

Any clutter that isn't there directly to influence one of those purposes should probably be omitted.

Lesson 4: Testing is Key

Usability testing is much easier these days than it was back when Don't Make Me Think was written. Sites like HotJar make it really easy to get sample users testing your site, really quickly.

As Krug points out, usability testing will help you find the biggest problems in your site with just a few tests. Why spend hours thinking about how users will use your site when you can test your site on real users?

Conclusions

Written almost 2 decades ago in a world in so many ways different than today, Don't Make Me Think proves that while the technologies and sites behind the web have changed so much, the essence of how users use the web is still the same. The book demonstrates how to best design sites with usability and the users in mind.

I would really recommend reading Don't Make Me Think for yourself, and I hope you enjoyed this post. As I wrote earlier, there is a new, revisited version which I recommend you read rather than the original. Since finishing Don't Make Me Think, I've found out that the book is still extremely popular today. I was not surprised. In my eyes, it is the single guidebook of the fundamentals of web design and usability.

Of course, everything written in this post is my opinion, and I encourage you to do your own research on this topic. Some of the quotes from the book have been slightly paraphrased for context, and special thanks to my school library for having this book on their shelves!

— Gabriel Romualdo, October 24, 2019

Top comments (11)

Collapse
 
ssimontis profile image
Scott Simontis

I have found that with B2C websites, usability is far less of a concern. Our customers know our products and all their configuration options better than we developers do and at this point, if things were to change majorly, they would flip out over how confusing the "different UI" was because they've been used to things behaving that way for ten years.

I'm also in a very niche industry so everything I'm saying might be full of shit 🙃 I'm trying to get more of a focus on analytics and data-driven decisions, but that is going to be a long battle.

Collapse
 
gaberomualdo profile image
Gabe Romualdo • Edited

I assume you meant B2B instead of B2C?

If that's the case, I would definitely agree, Don't Make Me Think is more targeted at devs and designers building sites primarily for the average web user, rather than B2B sites. The book is more about design patterns that increase user experience and engagement, which isn't as relevant in B2B sites as you rightfully pointed out, but very relevant in sites targeted at average web users again.

Thanks for reading.

— Gabriel

Collapse
 
byrro profile image
Renato Byrro

Hi! Very good article!

I would think a site targeting the average web user is a B2C site... I'm curious what is the concept of a B2C site to you?

Thread Thread
 
gaberomualdo profile image
Gabe Romualdo • Edited

Clumsy mistake, sorry. I mistook B2C for B2B. Will edit the comment now.

— Gabriel

Thread Thread
 
byrro profile image
Renato Byrro • Edited

Ah, makes sense! I had this view as well until very recently.

I worked on a B2B application for ~2 years. Users have a technical and analytical job. But yet I've seen the same patterns of B2C ("don't make me think").

UX is equally important to B2B and B2C users, I consider now.

May sound obvious, but all users are people, regardless of acting on their own or on behalf of a corporation.

Collapse
 
byrro profile image
Renato Byrro

Hi, in comparison to what do you think usability is less important for B2C?

Collapse
 
bbarbour profile image
Brian Barbour • Edited

Looks like there's a 3rd edition brought out in 2014.

sensible.com/dmmt.html

Collapse
 
sduduzog profile image
Sdu

This is the best book I have ever read. I still need to get myself a copy so that I keep on going back to it. I don't that it will ever lose its value in terms of the knowledge of provides.

I highly recommend this book to everyone!

Collapse
 
scrabill profile image
Shannon Crabill

I've seen Don't Make Me Think on a few must reads, but I have yet to read it myself. I'll have to see if my library has it.

Collapse
 
amiamigo profile image
Ami Amigo

Thanks for the article.

Collapse
 
ddm50 profile image
Din

I read this book a few months ago, good for beginners.