When we think of “branding,” there are several big name companies that come to mind that every business hopes to emulate:
But sometimes, in admiring these brand heroes, we miss the simple steps they took to get there. It’s easy to become enamored by high-budget ad campaigns and forget the simple, consistent steps they took to build a great brand.
In this blog, we’ll cover exactly what those simple steps are to building a brand worth following, starting with your website!
Whether you’re building your site from scratch, or redesigning your current site, you’ll want to think of this as your checklist. Without any one of these items, you won’t have much luck building an engaging brand. With all 6 items, however, you’ll be grabbing the attention of your target audience quicker and easier than ever.
Let’s jump into it.
1. HIGH-QUALITY IMAGES
High-quality images elevate your site and help you look more professional. Check out our site as an example.
To your users, low quality images are more than just an unattractive photo. It says something about your entire business – in the user’s brain it’s an indication of the quality of products you sell, the type of service they may receive from your company, and generally, what it’s like doing business with you.
Plain and simple: blurry images are a sure way to turn away users.
Lucky for you, there are a ton of great free resources for stock photos available for any type of business. Unsplash and Pexels are two of our favorites for freebies. Adobe Stock is another great option for those who own Adobe Suite, but you’ll have to pay per image if you don’t have an account.
One thing to keep in mind here: Google favors original photos over stock photos, so original photos are always preferred. Nevertheless, quality is king here. And if your only option for high-res photos is stock photography, then that’s the route you need to go!
Things to think about when searching for the perfect photo:
- Don’t be afraid to pay for it. Hire a photographer for a day to get original content. I promise, it’s worth it (and your website visitors will thank you for years to come). Just think, thousands of people may be seeing these photos. Don’t turn them away with blurry images.
- Be cautious to not stretch your images or logos if you need to resize them.
Choose images that are relevant to your brand and compliment your site. The more your images match the offers you present on your page, the higher conversion rate you will see.
In a world where we are bombarded by clutter and alerts, great spacing is like a breath of fresh air.
But keep in mind, it doesn’t always come naturally to us.
Instinctively, when building our websites, we want to cram as much “above the fold” as possible. We cram all the images, buttons, tabs, and copy into as small a space as possible to make sure our website visitors see everything. The result: LOW CONVERSION.
The reality is this: your users can’t digest all the information you want to throw at them. Instead of giving them a mouthful of information, adding white space and appropriate spacing between items will help your users wrap their heads around what you’re selling.
Here’s a few things to consider to help you master spacing on your website:
- Line spacing: The space between the lines directly affects how readable it appears. Too little space makes it easy for your viewer to glaze over from one line to the next, too much space makes it easy for your eye to get lost from one line of text to the next.
- Padding: Text should never bump up against other elements. Padding is the space between elements and text, and using it makes your text more readable and aesthetically pleasing.
- White Space: First, it doesn’t need to be white. It simply refers to empty space on the page. Use it to give balance, proportion, and contrast to the page.
- Be aware of line length of text
As mentioned in the section on spacing, it’s easy to overwhelm your users with information. One of the ways we can help them digest the content on our site is by guiding them through our site with clear copy and messaging.
When designing your website, it’s important to design with the Z-pattern layout in mind. The “Z-pattern” refers to the route the human eye travels when it reads: from left to right, zigzagging from top to bottom.
Just like reading a book, your users will visually navigate your site with the same Z-shaped pattern.
Considering the Z-pattern layout, there are a few simple ways to help guide your user where to look.
- The top right corner of your website is prime real estate. Place your CTA button in the top right corner and in the center of the hero section of your website. With a button in both places, your user’s eye will come across your call to action button twice within the first few seconds of being on your site.
- Use color accents
- Incorporate high contrast to make things stand out
- Play with contrast in sizing. Obviously items and text that are larger will take precedence over smaller items.
- Use design elements such as arrows or borders
4. COHESIVE BRANDING
Think of your website as the face of your brand. It needs to be something people are excited about and want to engage in.
But often, making a beautiful website is not as difficult as making your other marketing materials match.
Here are a few things to keep in mind when unifying your business’ brand and your new website.
- Color: Take a minimalist approach to color. Implement your brand colors sparingly to keep your website design elevated and to give your site a streamlined look and feel.
- Fonts: Beware of choosing too many fonts, or illegible fonts. Don’t go flashy with your color choices, you run the risk of your users not being able to read your copy.
- Text Layout: Do your best to avoid rags and widows by tailoring your content or increasing the paragraph column width. These irregularities are distracting to your user, and take away from the purpose of the paragraph – to educate your user.
- Rags: Take a look at the right side of your paragraph. Is there an irregular or uneven vertical margin? If one line of text is much longer than the others it can distract the user from the content.
- Widows: While you’re looking at the right side of your paragraph, you can also keep an eye out for widows. You’re looking for a small part of text, usually one word or part of a hyphenated word, that occurs at the end of a paragraph. You’ll want to bump those words to the next line to create a clean vertical margin.
Users associate colors, typefaces, and design elements with brands (for example, when I think “red”, I think “Coke”). Having a cohesive brand not only looks professional (inconsistencies will stand out and look like a mistake), but it helps solidify your brand in the mind of the user.
5. SIMPLIFIED MENU NAVIGATION
Imagine this with me…
You’re walking into the grocery store to find milk. But this grocery store is a bit different than a normal grocery store… it has no signage! You’re staring at aisle after aisle of food items with no indication on where the milk is located.
Unfortunately, our users often come on to our websites and get a similar experience. They are bombarded by messaging, buttons, and copy with no sense of how to find the one thing they actually want!
The solution? Simple, easy-to-use website navigation.
Simplified menu navigation increases the amount of time your users stay on your site. And, the longer your users stay on your site, the more likely they are to convert.
Your users will spend more time exploring your offers and less time becoming frustrated by a cluttered menu with 20+ options (even more than 5 can be overwhelming).
Use categories that are clear and to the point! Think of your navigation as a place where you only put your most important links. What are the pages that you want to help your customer navigate to the fastest? Those should be the pages you’re linking to in your top navigation.
“But, what about all the other important pages on my website?!”
Great question. The footer is a great place to put all those less-important-but-still-essential pages in your site. Think of it as your junk drawer, and your top navigation as the mantle above the fireplace-only the best stuff is allowed!
6. RESPONSIVE WEB DESIGN
So what exactly is responsive website design and why is everyone talking about it?
Responsive web design is the intentional layout of each page to make it respond to the user’s behavior and environment based on screen size, platform, and orientation.
In the last decade, responsive web design has become a big deal in the world of UX/UI design. Why? Because browsers are now interacting with our sites from an array of platforms and screen sizes. The rise in mobile alone, has forced developers to rethink the way our websites are designed in order to be more mobile friendly.
- Build your site on a platform that makes it easy to build responsive designs. Some of the best out there include WordPress, Webflow, Forefathers, and Thrive Solo.
- View your site from all kinds of screen sizes and resolution, as well as browsers. Be sure to check your site on desktop, tablet, and mobile before going live.
- Think through your website from the perspective of your users. Are your buttons large enough to be clicked on smaller screens? Are any of your design elements running off the screen? Is the text large enough to read on all mobile? If you can find answers to these questions ahead of time, it will save you many time and money later.
Today, users no longer see responsive sites as a luxury, but rather, as an expectation. A site that isn’t responsive will be very frustrating for a user and cause them to “bounce” from the site.
Remember, building a brand that’s worth following isn’t all about elaborate ad campaigns or advanced vector animations on your website. Although we all aspire to have brands that other companies emulate, we build the brands by first being great at the basics.
Read over this list of 6 things again. Share them with your team. See them as a checklist to ensure you’re doing everything you can to create a unified brand experience for your users across all platforms. If you do that, you’ll see the bottom-line results in no time.