7 Steps to Creating a Cohesive Look For Your Website

This post may contain affiliate links, which means I will receive compensation if you click through and make a purchase.

7 Steps to Creating a Cohesive Look For Your Website

When it comes to your website, consistency is key. This is especially true in terms of your website’s aesthetics. Having a cohesive look to your website increases brand recognition, which means people will be more likely to know, like, and trust you. And when it comes to running a successful business, you want people to know, like, and trust you, right?

Think about some of your favorite brands. What comes to mind when I mention the following:

Starbucks? Target? Pepsi? Apple?

Each of those brands has a distinct visual brand. For example, when you think of Starbucks, you think of that iconic green, the mermaid logo, and white cups. But what if one day Starbucks decided to completely redo their branding with orange and purple and swapped out the mermaid for something completely different?

How would that make you feel? You’d probably be a bit confused. After all, you’ve come to associate Starbucks with certain visuals. Changing them up affects how much you know, like, and trust them. Could you imagine if they made significant changes to their brand every other month?! You’d get whiplash from their constantly changing branding!

So now you can see why a cohesive look is essential to the success of your business.

But how do you create a cohesive look that will be able to grow with you?

Here are 7 steps to creating a cohesive look for your website.

1. Analyze your goals

Before you can open up Photoshop or hunt down fonts, the first step is to analyze your goals. After all, creating a brand without your goals in mind is not going to get you anywhere. But if you take some time to figure out what you want to achieve and who you’re targeting, your branding will work with you and make it much more likely that you’ll be able to reach those goals.

Grab a notebook and a pen and answer the following questions:

What is your business’ mission statement?

What 3 words would you use to describe your brand?

Who are you targeting?

What makes your business different?

Creating a cohesive look for your site starts with analyzing your goalsClick To Tweet

2. Collect inspiration

Once you have a clear idea on your goals and who you’re targeting, the next step to a cohesive look is to start collecting inspiration. Rather than going in blind and haphazardly putting your brand’s visuals together, collecting inspiration allows you to see the bigger picture so you can have something to reference when it’s time to get into details.

My favorite tool for collecting inspiration is Pinterest. If you don’t have an account, go ahead and create one.

Once you have an account, you’re going to create a private board. To do this, visit your profile and scroll down to the bottom. You’ll see a secret boards section. Click on the create a secret board button to create your board. Title it something like “my brand” or something else descriptive.

Now’s the fun part. With your answers from the first step in mind, start pinning! Don’t stress too much here. Just pin anything that catches your eye that fits your brand values and ideal client. Don’t stop until you have at least 50 pins, but if you can get closer to 100, that’s even better.

3. Edit and refine

Now that you’ve collected all your inspiration, it’s time to go through it and edit it down.

Yes, you just pinned 50-100 images and I’m going to have you deleted a bunch of them. I know, but it’s worth it!

Look through your board and you’ll likely see a common themes among most of your images. That’s great! This will be the starting point of your branding.

Now if you see more than one recurring theme, you have a decision to make: which one fits better with your brand values and your ideal client? The one that meets that criteria better will be the one that you’ll want to move forward with.

Once you’ve pinpointed the theme, it’s time to go through all of the pins on your board and delete any that don’t fit that theme. Keep paring down your pins until you have a carefully curated board with a cohesive look. You’ll know you’re done when all the pins on your board work well together. By this point you should have refined your board down to about 20-30 images tops, but less is okay too. If you have more than that, ask yourself if the pins are really cohesive. Odds are they’re probably not and you can be a bit more ruthless.

4. Select fonts

Okay, so now you have a solid theme for your website and it’s time to break it apart and pick the individual elements that will make up your site’s cohesive look.

First up are fonts.

Take a look at your Pinterest board. Are there any pins with fonts? What types of fonts show up repeatedly?

For example, maybe a bunch of your pins have handwritten elements. Or maybe there’s a lot with editorial style serif fonts. Make a list of what font styles show up.

Then narrow them down. If your list has 4+ fonts that’s way too many. I like to cap a site’s font palette at 3 (one for the body text, one for headings, menus, etc, and one for accents).

Here are some guidelines I use:

Body – simple serif or sans-serif font

Headings – a serif or sans-serif with a bit more personality

Accent – handwritten or display fonts to be used sparingly.

Once you know what types of fonts you’re looking for, it’s time to hunt down the perfect ones. I would start out at Google Fonts (as they’re incredibly easy to implement and free!). You can also check out Font Squirrel, Typekit, Fontspring, or any of the other numerous font shops out there.

But remember, you need fonts that have a webfont version available (that is unless the font will only be used in graphics), otherwise they won’t work on your site. And since we’re trying to create a cohesive look for your site, that’s kind of important.

When choosing fonts for your site, make sure there's a webfont version availableClick To Tweet

5. Choose a color palette

Next up is choosing a color palette. Again, let’s take a look at your Pinterest board. You should see a bunch of similar colors already, so your palette is pretty much already chosen for you. Yay! You just have to refine it a bit and choose the exact shades so you know exactly what you’re working with.

Back to your Pinterest board. Pick 3-5 colors that stand out. You want them to work well together and provide enough contrast with each other. Once you know what colors you want to use, it’s time to hunt down the hex codes.

If you have a color picker extension installed, you can quickly use it to pick the exact shades from your pins. If not, save some of the images to your computer. Then using a tool such as Canva’s color palette generator, upload the image to get the colors.

When you think you have your palette, it’s time to double check that the colors do in fact work well together. You can use Photoshop or Canva and create a set of squares (one for each color). Or you can use a tool such as Coolors, which will allow you to visualize your color palette right in your browser.

6. Identify a photography style

The last piece of the cohesive look puzzle is photography. People are highly visual so adding photos across your site is a must.

Let’s go back to your Pinterest board one last time. Look at all the photos. What commonalities do they have? Are they all light and airy? Are they black and white? Dark and moody?

Figure out what they all have in common. Once you do, you’re going to use this style for all the photos on your site. Whether you’re taking your own photos or using stock photos, this will be the style you’ll want to make sure all your photos are in.

7. Put it together

Now that you have all of your brand’s visuals figured out, the next step it to put them to use!

It can get overwhelming updating all the visuals of your site at once, so start small. Maybe just update the font on your website and change the colors. Then add in some photos on the more important pages. Create blog post graphics for your 5-10 most popular posts.

Related: 4 Ways to Extend Your Brand Beyond Your Website

The key here is to focus on changes that will make the most impact. And remember, nothing is ever perfect. At the end of the day, if an old blog post doesn’t perfectly match your new brand, it probably won’t affect things that much.

Think about the big picture. Does your brand as a whole convey your brand values and successfully target your ideal client? If so, then that’s a win!

Just keep your brand elements in mind whenever you create something new for your website and you’ll be on the right track!

Tweet this: Learn how to create a cohesive look for your site in 7 stepsClick To Tweet

Leave a Comment

Your email address will not be published. Required fields are marked *