It’s easy to overcomplicate web design, especially when we’re building a website ourselves. But creating a successful website is not rocket science. In fact, even if you’re building your own website, it’s easy to create something clean, simple and, more importantly, successful.
Our B.R.A.N.D. framework
We’ve come up with a simple way to explain what a perfect personal brand website should look like. It’s a framework we use to create every single website we build. And we call it the B.R.A.N.D. framework.
You do not have to be a techie to follow this framework, in fact, we created it with non-techies in mind.
B.R.A.N.D. is an acronym and is based on 5 core areas that each website should have:
- B for Build trust.
- R for Relevancy.
- A for Authority.
- N for Noteworthy.
- D for Direction.
So let’s break down every single area in more details.
1. Build trust
Building trust is the first and most important aspect of the entire framework. We need to trust the people we buy from. If your visitors don’t trust you, they’re not going to stick around long enough to buy from you.
It’s as simple as that.
So when someone lands on your website for the first time, they’re probably going to ask themselves a few questions. Things like:
- Do these people know what they’re talking about?
- Will they try to sell me something?
- Does this website look secure?
Your job is to reassure your visitors. And you do that by building trust.
So how do you actually build trust with your audience through your website?
1.1 Building Trust: Branding
Does your website look and feel like a nice place to be? Does it ‘look the part’? In other words, is your website ‘aesthetically pleasing’?
Now, when you’re building a website yourself this can be difficult. After all, you’re not a designer, right? How can you design a beautiful website if you don’t have the skills?
The likelihood is, you’re website is not going to look the same as a website designed by a professional agency BUT this does not mean your website won’t be successful.
In this case, we recommend you find a good WordPress theme that you like (there are thousands out there) and stick within the parameters of the theme. I.e. don’t change too much! What you want is something clean and professional.
You can edit fonts and colours to match your branding. You can add your logo. And, most importantly, you’ll be able to add your images and text which will really help you stand out.
Ultimately, this is about avoiding a crappy looking website that looks like the 90s threw up on the page. No one trusts those websites! So, keep it simple, stick to a theme and use other methods to stand out!
Example of Good Website Branding
It’s no secret that we love Col Grey’s work. His website is a great example of good branding – bold, memorable colours, consistency of fonts and text, plenty of white space, great use of shapes and consistent use of images.
You instantly feel at ease on Col’s website. You know you’re in the hands of a professional.
1.2 Building Trust: Images
One of the best ways of making your reader feel at ease is by using images of yourself on your website.
But a lot of people feel nervous about using their face on their website. Will it make you look egotistical? Or self-absorbed?
The purpose of having your image on your website is so your reader can see who they’re potentially going to work with/invest in. It’s for their benefit, not yours. You’re not self-centred for putting your images on your website. Far from it.
Using images of yourself and your team throughout your website gives the reader a sense of who you are. We actually recommend business owners invest in professional photography BEFORE they invest thousands and thousands on a website. It’s amazing what you can do with a half decent theme and some good photographs.
We’ve written an article with some tips on how to get some amazing photographs for your website.
Example of Good Website Imagery
We love Teresa’s images on her website. As soon as you land on her homepage you feel at ease and welcomed by Teresa. It automatically builds trust and a connection.
1.3 Building Trust: Testimonials and Case Studies
Do you have any testimonials or case studies that tell a story? Testimonials and case studies can be a great tool to help you build trust with your audience. Remember though, your visitors know that testimonials can be manufactured. So don’t share testimonials that simply say how good you are! (We know you are!)
Instead, feature examples of customers or clients who came with you with a problem and experienced a transformation as a direct result of buying your products or services.
If you want to find out more about how to get great testimonials from your clients, head over to our blog post How to get client testimonials for your website. Or you can listen to episode 17 of the Make Your Mark Online podcast.
Example of Good Website Testimonials
Chris Marr, at Content Marketing Academy, features fantastic testimonials on his website. They aren’t just the standard ‘Love it’ testimonials, they are real stories and experiences that give detailed results.
1.4 Building Trust: Security
And last but not least, in order to build that trust with your visitors, make your website is fast and secure. If your website takes over 3 seconds to load, your visitors may get impatient or suspicious. They’ll be wondering whether they’re being re-directed elsewhere and asking themselves why it’s taking so long. More often than not, they won’t wait for your page to load.
They’ll click the back button.
So get yourself a nice speedy website. If you’d like to buy a speed up service, we recommend TechCrunch.
When someone visits your website,
- are they clear on what you do?
- Can they see how relevant you are to them?
- Can they see how you can help them get from A to B? Solve a problem they have?
- And can they immediately tell whether you’ve helped people like them in the past?
If your visitors don’t understand how you can help them, they won’t stay on your website long enough to listen to what you have to say.
People don’t want to waste their time.
And you don’t want to waste yours, so get to the point quickly and show your ideal customers and clients exactly what it is that you do.
Show them that you’re relevant to them.
2.1 Relevancy: Your Big Bold Statement
A big, bold statement is the first sentence or phrase someone will see when they land on your website. It’s usually situated in the first third of your homepage, and it’s where you should clearly state what it is that you do. If you don’t do this right, your visitors won’t know whether they’re in the right place.
Your big, bold statement doesn’t have to be overly creative or clever. In fact, sometimes it’s best to avoid this and just clearly state what it is you do.
If you want to find out more about what Big Bold Statement, you can listen to episode 5 of the Make Your Mark Online podcast – Why You Need a Big Bold Statement and How to Create One.
Example of Good Big, Bold Statement
Mike and Callie at Membership Guys are so clear about what they offer and who they help. Take this big, bold statement you see as soon as you land on their website ‘Proven Practical advice for successful memberships’ – couldn’t be more clear!
2.2 Relevancy: Images and photos
We already mentioned photos and images in the context of building trust with your audience. But photos can also go a long way to show your readers that they’re in the right place and allow them to connect with you.
Take us, for example. Some people might want to work with a huge agency with a big team. They can clearly see from the get-go that there are two of us. They’ll know straight away that we’re not right for them.
A lot of people use stock photos to try to hide who they are, but using images makes it clear whether you’re the right fit for your end-user.
Example of good images and photos
We love Sara’s images on her website. She shows herself in her home office at her laptop and drinking coffee, looking very relaxed and so approachable! These images show the reader immediately shows the reader who Sara is and what she does.
2.3 Relevancy: Testimonials and Case Studies
Testimonials and case studies might help you build trust, but they also show the reader the type of clients you work with. So if you’re targetting well-known speakers, make sure you only feature them in your testimonials and case studies! It’s also a good idea to cull old testimonials that might not be a reflection of who you work with anymore.
Example of a good case study/testimonial
We love Lauren Pearman’s case studies such as this one. Lauren puts the focus on her client, not herself. She talks about what they want to achieve and how she helps them do this through photography. But best of all, Lauren shows exactly who her ideal clients are through her case studies. It’s very clear to see the types of people that she works with.
2.4 Relevancy: Website Copy
One of the best and most obvious ways to convey to reader what it is you do and how you help is through your website copy. But it’s amazing how many people get this wrong. They focus on ‘fluff’ – when they were established, the entire work history to date, or they use generic terms like ‘we’re professional and friendly’.
Your copy should focus on the reader, not you. It should show them who you work with (and who you don’t work with), and it should people how you help and why it’s beneficial for them to hire you.
Example of good website copy
John Espirian is the king of good website copy and making the complex, simple. In the example above, you can see how John helps solve a problem for his clients with the phrase, ‘Let’s help your clients go from “umm, what?” to “ahh, I get it now”. There’s no ‘extra fat’ in John’s copy, it’s concise and most importantly, it demonstrates to the reader who he is, what he does and how he helps.
Being seen as an authority in your field or niche is fundamental because, in order to buy from you, people need to see you as an expert.
People want to know things like:
- Are you qualified to help them?
- Can you be trusted?
- Have you got any proof of things you’ve done in the past?
- Is working with you a safe investment of their money?
So how do you build authority on your website?
3.1 Authority: Big Hero image
We talked about images before. They can help with trust and relevancy, but also with authority.
If you’re a speaker, use images of yourself speaking on stage, for example. If you’re an author, have a photo of yourself signing books.
Use that Big Hero image on the home page of your website wisely – it’s a great opportunity to tell your website visitors that you’re an authority.
Example of a good authority image
Love him or hate him Gary V does showcase his authority in this image on his website. His back is turned away from the reader, which gives us a full view of an engaged audience. It speaks to his authority.
3.2 Authority: Media badges and social proof
Have you been featured on The Guardian, the BBC, or the Huffington Post? Have you appeared in a well-known podcast?
Then add those media badges to your website.
This tells your audience that you’ve received ‘the stamp of approval’ from well-recognised sources, and it will help you build trust with your website visitors more easily.
Similarly, if you have a good number of subscribers on your email list, you could add a section on your website that includes something along the lines of: “Join another 500 like-minded business owners who are already on our list”.
This boosts your social proof and makes you come across as trustworthy.
Example of good social proof
Amy Landino is an international speaker and YouTube expert. Her website does a great job at reflecting her level of expertise and authority. Amy uses the logos above subtly on her website, but it works to show what an authority she is. We also like how she’s worded it ‘Brands Who Trust Amy’. Nicely done!
3.3 Authority: Signature Programmes
If you offer any sort of coaching or consulting, then having your own ‘signature programmes’ can really help you be seen as an authority. These programmes are your proven steps to success. They’re based around your experience and what’s worked for you and what hasn’t. And they’re usually given a name that’s unique to you.
Example of good signature programmes
Janet Murray delivers her own signature programmes that help people build their audience and grow their business. She named the above programme ‘The build your audience’ programme. Only Janet offers this unique programme and with it all the training and resources. Having your own proven programme such as this one helps show your authority in your industry.
- Are you noticeable and memorable?
- Interesting and entertaining?
- When people land on your website, how will you make sure they stay long enough to listen to what you’re saying?
- Can people relate to you?
Because that’s all we all look for – human connection. And if your visitors can’t connect with you, they’ll just find someone else to connect with.
Truth is, you’re not going to be loved by everybody.
But that’s fine because you don’t want everybody to be your customer. You just want a selected few.
So how are you going to use your website to relate to your ideal customers and clients on a one-to-one level? How are you going to show people that you’re noteworthy?
4.1 Noteworthy: Your Tone of Voice
What’s your personality?
One of the biggest mistakes people make with their website copy is making it boring and stuffy. A lot of people get their personalities across on social media, but when it comes to web copy they go formal.
Make sure you show people who you are. Yes, not everyone will love you, but it doesn’t matter about the people that don’t like you. They aren’t your customers.
If you’re still struggling with this, check out our article on how to create your tone of voice.
Example of Good Tone of Voice
We love Amy’s site from Joy Junkie. You can immediately get a sense of who she is from her copy. Her personality just shines through and you will remember her! She writes very much like she might talk and it feels like you’re having a real conversation with her when you read her words.
4.2 Noteworthy: Your story
Do you have an interesting story to tell? One that your readers will connect with? If so, then your story is definitely going to help you to stand out and make you memorable.
So make sure you tell your story well – don’t be scared of adding a bit of character and personality to it.
But make sure it’s a genuine story too. A lot of people feel the pressure to tell something amazing. But keep it simple and real. None of this I had $1 in my pocket and now I’m a millionaire with a Lambo crap.
Example of a Good Story
Patt Flynn tells his story of how he started Smart Passive Income. What we love about this story is that it’s humble, simple and something we can all relate to. Patt talks about how he struggled in his career after the 2008 economic crash. He talks about how he set up his business so he could be closer to his family and work around them. There’s no ego in his story. And no Lamborghinis!
4.3 Noteworthy: Images and videos
By now, you’ll have noticed that images come up a lot when talking about the features a great website should have. That’s because they are a key element for creating a great personal brand website. Use them to be memorable and stand out and create a sense of who you are.
Think about your brand values – are you fun, cheeky, humourous, serious? Let this show through your photography and use props if you want to help you.
Example of a Good Personal Brand Photography
Andrew and Pete nail their brand. Everything they are is reflected across their website, and in particular in their photography. Their photos are fun, relaxed and relatable, just like Andrew and Pete themselves!
4.4 Noteworthy: Colours
Your brand colours are often what will make you memorable. There are many things to consider before choosing your brand colours…
- Who you are and what you stand for – for example if innovation is your thing you wouldn’t pick something super traditional looking like maroon
- What your competition does – sometimes, it’s good to go against the grain of your competition (think someone with expertise in plants going pink rather than green!) But this is a risk. It will make you memorable but sometimes it works and sometimes not!
- Colour psychology – red symbolises passion or danger, pink symbolises femininity or happiness. Think about what the colours could mean to your audience before you choose them.
Example of a Good Personal Brand Colours
When I go to conferences and say I’m from Jammy Digital, I often hear people reply, ‘You’re the guys with that green and pink website, right?’ Yup! Our weird combo of bright colours does make us memorable to a lot of people. They’re also very much a reflection of us and our brand.
4.5 Noteworthy: Your Opinions
We all have our own opinions about industry, right? We work in it every day and we live and breathe what we do. Sometimes, you might go against the grain of your industry or work in a unique way with your clients. Part of you brand values might be honest and transparancy. In which case, stating clearly how you work or what makes you different can work well. It makes you memourable and unique.
A Good Example of Sharing Your Opinions
I always remember this website from A Little Bit of Something. They really do get their feelings across on their website (and we can certainly relate!) Again, some people might hate this, but it doesn’t matter, because their target audience will love it. It creates strong emotions either way. Remember, it’s better to be loved and hated rather than forgotten.
Direction is the last piece of the puzzle and the fifth component of the B.R.A.N.D. framework.
If you want your website to perform well, you need to consider how you’re directing people from page to page. Because if your visitors don’t know what to do next, they’re going to do nothing.
Or click that dreaded back button.
When people land on your website, they want to know things like:
- What do I do next?
- Where do I start?
- How do I get in touch?
- What services do you offer?
We’ve written more about how you can use your Home page as the ‘reception area’ of your website, directing people to where they need to go, especially if you have more than one audience. Check out our blog post How to Appeal to More Than One Audience Using Your Website.
So here’s what you can do to help people navigate your website easily.
5.1 Direction: Menu items
Use obvious phrases on your menu items to help your readers go where they need to go. Don’t call your menu items something vague or obscure that people aren’t familiar with like ‘my journey’ for ‘blog’ – you’ll just end up confusing them!
Example of Good Menu Structure
Amy’s website is so easy to use and follow. Amy has clearly thought about the pathway her end-user will follow. Amy has a simple and clean menu structure, no obscure names or complicated dropdowns.
5:2 Direction: Buttons and Calls To Action (CTAs)
Use colourful buttons and clear Calls To Action or CTAs. Make sure your CTAs are prominent and enticing and include them in the body of your content as well. If you’re going to ask your readers for their email address in exchange for some in-depth content, for example, the best time to ask them is while they’re consuming your content.
But also use language and tone of voice that helps you direct people to where you want them to go in a non-intrusive way. Use words like ‘get’ and ‘grab’, for example, when you’re asking people to download a free resource. Or ‘click here’ to help hop onto the next page on your website.
Example of Good Buttons and Calls to Action (CTAs)
Ann Handley makes it really clear what you need to here. There are four clear pathways to her services, each with a bold-coloured button to click. This may seem obvious, but it’s amazing how many websites get this wrong!
5.3 Direction: Promo Area
The ‘promo area’ of your homepage is usually under the big hero section. It features 3 or 4 different options for your end-user to choose. This could be your services, blog, about page etc. You’re the best person to decide what goes here, but it’s a great way of directing people from your home page to the next page.
As we’ve said before, think of your home page as the ‘reception area’ of your website. People will visit the home page looking for more info about your services, your blog, your contact page – and your job is to direct people there.
Example of a Good Promo Area
When we worked with Janet Murray, she did a great job of streamlining what she offered and coming up with three key areas for her audience to visit on her website. We created this within the promo area. It creates a clear path of where to go.
5.4 Direction: A Learning Centre
For those with a lot of content or content on different formats – such as blog posts, video and a podcast, a learning centre can prove helpful to your visitor. Instead of trailing through all of your content or only seeing your most recent content, a learning centre allows you to search through content easily. You can break down content via the format, the topic, the date published, your most popular pieces etc.
We wrote a more in-depth article about how to create a learning centre here.
Example of a Good Learning Centre
Pete at Meaningful Money has had over a million downloads of his podcast which has spanned over 14 seasons! He really did need a learning centre for the amount of amazing content he produces. Now, it’s much easier for his readers to find what they are looking for.
5.5 Direction: Contact information
And last (but certainly not least!) have visible contact information for your business. If you rely on people getting in touch with you over the phone, have your phone number at the top of the page and a button that says, ‘Get in touch with us’. Make sure it’s mobile friendly too, so people can just click on the number and call you straight from mobile.
Would you like some help to build your own personal brand website?
So this is our B.R.A.N.D. website framework. We use religiously to build personal brand websites for our clients. But we also share this framework inside our signature membership, Make Your Mark Online, where we help personal brands build and grow a successful business website. All the videos in our membership library are based on these 5 key components. And this framework can work for any website, not just personal brands.
So if you want to find out more about each individual area of the B.R.A.N.D. framework and understand how it can apply to you, check out our membership community. The doors are currently open, and it’s been amazing to see so many of our members get great results with their websites since they joined in October last year.
If you enjoyed this post, you can also listen to our podcast episode How to create the Perfect Personal Brand Website (ep 30).