How to Tell Good vs Bad Web Design
What does “Good” mean to Intuitive Digital?
First, I want to start by defining what we mean by “good.” When it comes to website design, “good” means a site that is effective and efficient at converting a visitor into a lead. Websites can be sexy, stylish, and absolutely visually stunning, but if they’re confusing, difficult to navigate, or rickety from a technical standpoint, then they’re failing to engage their potential customer beyond a first cursory glance.
Good design builds trust
A strong, effective website design establishes trust with your audience. Intuitive Digital navigation and well-organized information show that a business has a clear understanding of its users. On the flip side, a lack of important information, typos, and mistakes demonstrate a lack of credibility.
A polished, cohesive visual aesthetic is your first impression, which you only get to make once. Using a contemporary visual design, with well-thought-out colors, images, and branding will establish a sense of trust and confidence in your users immediately.
Cider Riot, a Portland-built cidery, has an excellent visual handshake through their homepage design. It’s clean, their story and product are summed up in one line, and the hero image is of their product itself. In short, their home page reflects who they are. Oh and their cider is delicious.
(Some) elements of good design
Books upon books upon essays upon articles have been written about every design element, the psychology behind it, the history of its use, etc. For today’s blog, we’ll focus on a handful of principles that we, at Intuitive Digital, like to hang our hats on when approaching website design.
Keep design clean
Clutter is ineffective. It creates distractions, interrupts the ability for a user to scan information, it feels messy, and it creates decision fatigue. When a potential client doesn’t know where to look first, not only could they miss the most important message – what your product is and why they should buy it – but they can become so quickly overwhelmed that they bounce.
Here’s a fun example. Just looking at this site causes me anxiety! On top of that, I’m not sure where to look first, where to click first, or what this site wants me to do next.
As people and as customers, we crave visual order. Like I said above, that sense of order and organization builds trust. It also creates a clear pathway to your main call to action.
On Warbyparker.com, they use a clean, inviting hero image, with one overall call to action: shop now. They use their unique selling proposition as their primary message (try 5 frames at home for free) and use a simple navigation menu across the top. As a potential customer, I know exactly where to go right away, and the visual beauty and simplicity puts me at ease.
Use high-quality images
This is a must. What is a high-quality image?
- Usually high-quality means professional. Even if it’s amateur it needs to kill it on all of the following:
- Depth and perspective
- High quality definitely means HIGH resolution. When providing images to your web designer, get them the highest resolution possible. It may end up being much lower once your site is published and live, but a better starting quality opens up a lot more opportunity in the design and layout process.
- Limit stock photography! This can be really challenging, depending on your service or product. If you’re a law firm specializing in personal injury, you’re not going to have professional photos of past cases to use – nor would you want to! Yikes. In this case, well-selected stock photography can work. We’d still strongly recommend including professional photos of your team, your office, your neighborhood, etc., depending on your business.
On that last note, what exactly IS good stock photography? Here’s a good checklist:
- Use a great professional stock site, and buy the rights to the photo
- Purchase it at a high resolution
- Choose an image that isn’t too cliche or silly
- Select an image that is cohesive with your brand and colors
- Check out our blog post on this!
Let’s hit some final design basics: font & color
Choosing the right font(s)
There are infinite numbers of fonts to choose from, making this seem like a daunting task! Unless you have a very good reason, you should stick to 2 or 3 fonts total for your website. Too many different fonts overwhelms the eye, and leads to problems we already talked about like trust, bouncing users, distraction, etc.
Your fonts should complement each other from a design and aesthetic perspective, and above all, they must be readable. This is especially important when choosing the font for the bulk/body of your text. This is the text that is smallest usually (smaller than your headers), and by far away, a sans serif font is much easier to read than a serif. Here’s a great list from VistaPrint, and a list of great, go-to fonts for any professional website from Canva.
Planning your color scheme
This one is hard! But luckily, you probably already have a logo and maybe even a branding guide, that will set you on track right out of the gate. If you’re starting fresh, or if your logo is black and white or monochromatic, picking color themes is a big task.
Wordstream has a great graphic on the psychology of color. Actually, the whole article is fantastic. Color evokes various emotions from each of us, and you’ll want to start with a color family that evokes the feelings you want your brand to evoke. This chart is a great starting point:
To use color effectively, you don’t always need that much, and you definitely don’t want too many different colors. Similar to font, less is often more when designing with color. Using a lot of different colors must be done incredibly skillfully and intentionally, and only when there’s a really compelling reason for it.
Color is an area where a professional designer can really help. They are versed in complementary colors, and they can help you pick a palette and provide guidance on where to use what. This is a fantastic time to create a brand guide if you don’t already have one!