Logo of Tracy Raftl - Brand Strategy & Web Design for Purpose-Driven Women

7 Design Elements You Need to Have On Your Website

7 Design Elements Your Website Needs to Have
Pin this for later!

I know you want a snazzy website that attracts awesome clients and makes you look like a doggone pro.

But epic websites don’t just happen haphazardly. Ever wondered why some people’s sites look so freaking good, while others just look so hideously home-made?

It’s because the good sites follow these important design rules, which may not be so obvious if you’re not a designer.

So here’s the 7 design elements you need to take your site from meh to wowza:

1. Your Logo

I mean, this one’s pretty obvious. You need a memorable logo, preferably one that doesn’t look like an 8 year old made it. This should be placed in your header so people see it and recognize your brand right away.

Here’s a website logo tip:

Most logos in the usual .PNG or Jpeg formats, especially text based ones, end up looking really blurry when you size them down really small. It doesn’t matter how high quality the image starts as, they just get blurry for reasons that will bore you so I won’t get into it.

Either way, blurry photos and logos make your site look amateur.

There is a way around this though: make your logo into an .SVG file and upload that instead. Making something into an .SVG file is sort of complicated so just get someone on Fiverr to do it for you. Thank me later.

2. Typographical Hierarchy

You need to choose approximately four fonts or font variations for your website that go from the largest on the page (your accent font), down to the smallest on the page (your paragraph font). Like this:

This makes your site easy and pleasing to read and draws attention to the things people should look at first (ie the headlines).

Related Post: How to Choose Fonts for Your Website that Make You Look Seriously Profesh

3. Images That Tell a Story

A picture’s worth a 1000 words, right? The best websites have beautiful, high quality imagery with colours and tones that stay consistent and match the brand’s personality.

But of course, the images also have to tell a story and not just be completely random.

For example, if there’s a part of the website where I’m talking about my audience’s pain points, I’m probably going to accompany that part with images of people looking, sad, frustrated etc.

If I’m talking about the future when they’ve solved their problem, I’m going to have images of happy people.

To reverse those just wouldn’t make any sense.

Basically, the images make your brand’s message more powerful, and let’s face it — a lot of the time, people don’t actually read and ONLY look at the pictures and skim the headlines – so you want the images to to tell the story that the person may be skipping over.

4. Interesting Graphic Elements

Okay this one may not be an absolute requirement in the eyes of some designers, but I sure think it is!

I believe that if you want to be memorable it’s important that your website does choose a few motifs, or textures, or patterns to incorporate that differentiate you from others.

It just gives the site visual interest that boring ol’ cookie cutter websites don’t have. It makes you stand out like the star that you are.

For example, the arrows in this image are pointing at graphic elements that we used throughout my client Melissa Turner’s website, as well as the background textures and patterns:

Graphic elements in website design

5.  A Colour Palette

It’s important that your website has a set of colours it uses, and that you don’t go overboard!

Just because you like every colour in the rainbow doesn’t mean that every colour of the rainbow should make it onto your website. Too many gets overwhelming.

My advice? Choose about 7 or 8 colours… two of these colours should be distinct and used the most throughout the site and be somewhat related, and then you want to reserve one or two contrasting colours for your accents, like for your buttons.

For example, this could be a turquoise blue and a navy blue, and then a peach colour and a yellow for the accent. Like this:

Color palette example for your website

The rest should be muted neutral colours that you can use for backgrounds, and other details.  These would be like off-whites, light greys, and light, muted versions of your main colours.

Honestly, colour is a pretty big topic, but basically the point is just to choose a few, not too many, and stay consistent. Note that if you already have established brand colours, those should be used for your website.

Related Post: How to Choose Your Brand Colours in 5 Minutes Flat

6. Lots of White Space

Everybody needs a little space… and that includes the elements on your web page! Nothing makes a site look worse than photos and fonts and graphics that are all bunched up together with no breathing room.

What makes the following website so abhorrent? Well, a lot of things, but the main one being the lack of white space. Everything is just way too close together which makes it unpleasant to read and look at:

Bad web design no white space

Instead, look around my website that you’re reading now and notice how every element has space around it – including space between paragraphs and lines of text. It’s just easier to breathe this way.

7. Consistency Throughout Your Pages

This one is so important! The fonts, colours, motifs, and photo styles should stay consistent across your whole website (and across your whole brand for that matter).

People are going to get confused if you use red all over your homepage, and then the rest of your pages are bright yellow with completely different font, graphics, and feel. It should be obvious you’re on the same website from page to page.

Staying consistent simply makes your website and brand look more professional, more memorable, and leads to more impact and sales!

Related Post: This Simple Brand Trick Can Increase Your Revenue by 23%

So there you have it folks! 7 things you should have on your site if you want it blow minds with it’s gloriousness!

Hope you found this helpful – and if it’s overwhelming, then I get it – that’s what designers are for. Get in touch if you need help!

Share this post, If you wanna.

Share on pinterest
Share on facebook
Share on twitter
Share on linkedin

Keep Reading

Picture of Tracy Raftl - Brand Strategist and Web Designer for Purpose-Driven Women

Hi! I'm Tracy

My team and I do custom, strategic brand & web design for women with purpose. ​Click here to learn more about us!

Catch us on Instagram: