Skip to content

In this article, we will show you the fundamentals of brand design so you can design your website like a pro.

Brand design can be a fundamental tool for supercharging your sales to the next level. If you’re wondering how you can use your visuals to increase your online sales, then you are in the right place.

Branding is a powerful outlet to visually express who you are as a business or brand. Intentional brand design can also work as a proper customer magnet when done correctly.

Think about the last time you discovered a brand or business online. It probably took you a couple of seconds to decide if you felt a connection to this brand via their visuals.

What made you stay on their site rather than click somewhere else? The overall visual feel is what most likely drew you in, everything else made you stick around.

Yes, first impressions do matter and they matter even more in the online space. But don’t worry if your brand design isn’t where you want it to be at the moment. In this post, you’ll learn how to take it to the next level either on your own or with a designer’s help.

Branding before you design your website helps you go beyond superficiality and instead your design can work as an avenue of expression and connection to your ideal clients or customers. They say a photo is worth a thousand words, but an intentional brand design is worth a million more to your customers.

design your website quote from selz ecommerce for business growth

Don’t think of it as something that has to be perfect, but think of it as a way to communicate to your potential customers that they can vibe with you.

Plus, building and designing a brand is never something that is written in stone forever, but your brand is something that will be ever-growing and evolving as you go along your online selling journey.

Define who you are and what your potential customers want before you design your website

In order to put intention behind your brand, you need to do the inner work that can be expressed through your visuals like your fonts, colors, and other brand imagery that will you be using.

Yes, it can easy to create a beautiful brand but if it’s just pretty for the sake of being pretty than it doesn’t really serve a major purpose to increase your sales and draw in more customers.

Deciding intention before you design your website is about defining who you are and what your ideal customers want. When you input more of you in your brand or business it’s easier for your ideal customers or clients to feel a connection with your brand. This is why getting general in your brand design doesn’t usually work.

When you play it safe with your brand and website design in order to reach everyone, you actually don’t work well at reaching anyone. Having a generic brand makes it so there is no specific avenue that your potential customers can feel a connection with.

The world of online selling is vast and you need to stand out. A visual brand is the best way to get specific and start reaching the people who need your services and products most.

The first step is to know who you are so you can brand yourself accordingly.

What makes you different? How could your differences make you connect with your potential audience even more? How you can represent this in your visuals?

If you are all about glitter and rainbows then embrace this fully. Don’t hold back!

Your customers will notice that you are embracing your authenticity. When you do this you will steer away the people who hate glitter and rainbows but may appreciate that you are fully embracing yourself.

By doing this, you will also attract people who share your mutual love for glitter and rainbows and they will fall head over heels in love with you for that. It’s really a win-win!

Take a deeper look into who you are, who you are trying to reach, what your potential customers are attracted to visually so you can design your website accordingly. Once you have a good idea of this, you can start building your brand design with purpose and direction.

Choosing your fonts

You can either start here at fonts or move onto color. Both of these elements of your brand can work off of each other and there’s no exact formula for choosing the perfect combination. Start with whatever inspires you.

I know when you start choosing fonts on your own, it can get overwhelming because there are millions and millions of different typefaces and combinations to choose from. Think of the endless font palette choices as a creative adventure instead of an exact science.

A great place to start when you are choosing your font palette is to focus on what you want to portray to your potential customers. It’s easy if you choose a couple of pillar words that describe the vibe you are trying to achieve. Is it bold, whimsical, refined, minimalistic, etc.?

Once you have defined the look you want with your pillar words, grab inspiration from Pinterest, print materials, your surroundings, or anything else you feel inspired by. The best place to put all your inspiration in one handy place is Pinterest. Here you can create mini mood boards to organize your inspiration and direction to move forward.

Choosing your fonts takes patience but remember to not take yourself too seriously. Choose 2-3 fonts to include in your palette. It’s best to choose one as your main header font and add an accent font, then your body font.

Think of them as different elements all working together in perfect harmony to create a brand image that you and your potential clients will love.

Here are some guidelines you should stick to when you are choosing your fonts:

  • Your fonts should always be legible. Sometimes you can download fun fonts that look fabulous, but if your customers can’t read them then it completely defeats the purpose.
  • Juxtaposition is a good thing when you are creating your font palette. Choosing two very different fonts can work wonders in highlighting certain content. For example, if you want to highlight your buy buttons, choosing a font that stands out among the rest is highly effective in increasing your sales.
  • Never use more than 3 types of fonts. This can get overwhelming, no matter how whimsical or creative your brand is. Going on font overload can really make things confusing for your potential customers and clients.

All of these brand elements are in place to lead your website viewers where you want them to go. If there’s too much going on people can get overwhelmed and click onto the next brand or distraction.

There are always exceptions to these rules so don’t fear thinking outside the box if you want to try something different. These guidelines are here for you to stay focused and give you inspiration in your font picking process. Honestly, there are no set rules for choosing these brand elements.

Choosing your color palette

Color palettes are one of my favorite details to cover. Mostly because they are one of the most powerful and quickest ways to express something visually to your potential customers.

Colors can make a statement alone or work together in perfect harmony to guide your customers through their online experience on your website.

There is much psychology that goes behind colors and picking the right ones for your brand. I highly suggest looking deeper into what each color can portray, especially if you are choosing one main color for your brand.

Color combinations can also portray different things when put together. To get started choosing your colors, I highly recommend heading to Pinterest and creating a board of inspiration the same way you did with fonts. Start pinning everything you feel attracted to.

Also, keep in mind what your ideal customer would love to see. What colors are they attracted to as well?

Once you’ve pinned about 50-60 pins, go through and see any cohesive themes. Delete pins that aren’t working with your theme. If you don’t have a theme yet, keep pinning until you start to see one on your board.

Once you have your color palette chosen, keep in mind how you are going to use these colors to guide your potential customers through your site. It’s good practice to choose one, bolder color as your call-to-action color.

This means that you use this on your buy buttons, sign up buttons, and any other important details you want your website viewers to click onto. Use this color sparingly and only where you want people to take action on your website.

This is a way of subtly guiding your potential clients to the important things on your site and in your brand experience.

Now that you know this call-to-action color strategy, you will start seeing this all over the place. It’s a simple strategy you can implement today to promote your product.

Before you design your website, put it all together in a logo

Now that you have or you are on your way to choosing your brand fonts and colors you can now put it all together into your brand’s most powerful visual – your logo.

When designing a brand it’s best to have those fundamentals in place so you can basically plug these elements in and design your website logo from there.

Just as all the other visuals in your brand work together to make a first impression to your ideal customers your logo is at the core of this. It’s one of the very first things that your website viewers will see as you usually and should place your logo at the very top of your website.

This is why putting in the work to make sure your fonts and colors are a clear representation of what you are trying to get across is key to making this whole formula work.

If you feel like you need more time with your branding fundamentals (fonts + colors) then take the time you need to truly make these work for you.

When you are designing your logo, one thing that will take your design to the next level is keeping it simple. You may feel like you want to add everything in all at once, but actually less is more here.

You want to make your icon or font combination logo make a quick statement into what your brand is all about. Design your website logo so it can stand alone and work together with your other brand imagery as a clear expression of you and your brand.

Create a brand style guide before you design your website

Once you have everything together, creating a brand style guide is foundational to staying consistent.

A brand style guide is something that you will use to make sure your brand stays consistent via every single marketing material, elements when you design your website and everything else in between.

This guide will consist of your chosen 2-3 fonts and colors, your logo, and brand imagery to stay consistent with the photography and stock photos you use. This will all work together to be a clear guide of how you should design your website and anything that follows after that.

You didn’t do all this work to just plug in any fonts and colors you feel inspired by that day. It’s important to stay consistent because visual consistency creates trust and brand recognition.

Having a consistent brand shows your potential customers that you put in the time to care about what you are doing. This is why having a brand style guide is such an incredible way to stay focused and make sure everything stays on brand.

Here’s a great example of a brand style guide from Twitter.

design your website with selz ecommerce solution

If you are DIYing your own graphics or you have a designer build your website for you then all you need to do is show them this simple guide and everything stays magically consistent.

Not only that, it will also save you time creating something new every single time.

Although, with all of this said, having a brand style guide doesn’t take the creativity out of designing your website.

This is simply a way to save time, stay focused, and make sure all the materials you put out into the online selling world are intentional. Your potential customers will flock to you because you created a brand with purpose but they will keep coming back if you stay consistent with it.

Read more: 40 Proven Ecommerce Homepage Examples to Help You Get Results

About the author

Jessica Safko

Jessica Safko is a Berlin-based photographer specializing in lifestyle, branding, and event photography.

Leave a Reply