The 2020 business website design checklist

Have a great website idea but not sure where to start? Follow our comprehensive guide to learn how to turn your website idea into a reality in 2020.
9 minute read
Edward Kost @EdwardKost
Technical Co-pilot
Cover photo for The 2020 business website design checklist

Haberdar Kalın

Haber bültenimize abone olun ve önemli konulardan haberdar kalın.
Abone olduğunuz için teşekkürler! Sonraki güncelleme için gözünüz gelen kutunuzda olsun.

Not sure how to build your website? This guide will help

So you have an amazing business idea but when it comes to building a website you're completely at a loss. 

What type of platform do you need? How do you optimise your design for conversions? How do you write website copy? 

In this post we'll take you by the hand and meticulously guide you through all of the necessary steps to building a sensational website.

Well show you how to get a logo done, how to build a website, how to design your website, and even how to write web copy that will get you on the first page of Google.

Designing your business image

The first thing you'll need to create is your business logo. A great business logo represents the unique character of a business and it's unique solutions. It should be clean but memorable, distinct but not too ostentatious.

No pressure right?

If you're not a very creative person, don't worry, you can appeal to some of the most creative people in the world for inspiration.

On Freelancer.com you can submit a contest for your logo design and get inspired from the many wonderful entries you receive. The freelancer you choose as the winner can even complete the design to your exact specifications, so you don't need to do any of the design work yourself (phew!).

We've written a great step-by-step guide to submitting a contest, you can read it here.

Freelance Graphic Design Experts
$15 USD / hour
(700 reviews)
Graphic Design
Grafik Tasarımı
Logo Tasarımı
Broşür Tasarımı
Kurumsal Kimlik
$40 USD / hour
(213 reviews)
Graphic Design
Animasyon
Video Servisleri
Video Düzenleme
3D Animasyon
$10 USD / hour
(861 reviews)
Graphic Design
Grafik Tasarımı
Logo Tasarımı
Photoshop
Arapça
$20 USD / hour
(241 reviews)
Graphic Design
Çeviri
İngilizce (Amerikan)
Almanca
Fransızca

On Freelancer.com there are two options, you can post a project if you want to hire an individual freelancer or post a contest if you want freelancer to demonstrate their specific capabilities for your project.

For more details on the differences between the two, and to learn how to manage freelancers effectively, refer to our freelancer management post.

WIth your business logo now complete, let's venture deeper into the design room and stop over at the brand identity pottery wheel.

Your brand identity is the complete graphical representation of your business. It's far beyond just your logo.

There are 3 primary elements of a brand identity, let's go over each of them.

Brand identity element 1: Archetype identification

If your business was suddenly ignited by the spark of life and transformed into a human, what would its personality be?

Would it be warm and bubbly, or thoughtful and calculative?

Defining the unique personality archetype for your business will help you maintain a uniform voice throughout all of your communications channels. Also, if you ever need to outsource any of your content creation, your blog writers will have a clearly defined framework to work with.

To identify your business' unique identity the first thing you will need to do is select all of the Jungian Archetypes that are most applicable to your business. They are all listed below:

1) Innocent - Free to be you and me

2) The Sage - The truth will set you free.

3) The Explorer -  Don't fence me in.

4) The Outlaw - Rules are made to be broken.

5) The Magician - I make things happen

6) The Hero - Where there's a will there's a way 

7) The Lover  - You're the only one.

8) The Jester  - You only live once.

9) The Everyman - All men and women are created equal

10) The Caregiver - Love your neighbour as yourself 

11) The Ruler - Power isn't everything, it's the only thing.

12) The Creator / Artist - If you can imagine it, it can be done

 

Next, you will need to come up with a list of adjectives that describe your business in light of your chosen archetypes.

brand identity design

When you're done compiling this list you might find that some of your chosen archetypes are less relevant than others. Remove any outliers so that your lift with a final list of archetypes and adjectives that more accurately reflect your business.

To learn more about identifying your business archetypes, refer to our brand identity design guide.

Ideally, your business archetype should be identified first and used as a reference point for all of the other elements of your brand identity design.

Brand identity element 2: Topography

Everyone has different handwriting. It's a subtle identifier of each person's unique character. That's why topography is an important element of your brand identity.

The primary purpose of having a well defined brand identity is to help customers readily identify your business. So your topography needs to be uniform across every medium, this includes your website, advertising campaigns and even business cards.

Take a look at Uber's website banner image. Notice their unique topography? 

brand identity design

Source: Uber.com

Uber's topography sets them apart from every other business. If you were to take a stroll down the street and notice that font somewhere, your subconscious mind will connect it to the Uber brand. That's some pretty powerful marketing psychology.

If you need some inspiration for your topography, here are some examples of great font designs on the web.

For more details on how to design your topography, includes some helpful font library resources, refer to our brand identity design guide.

Brand identity element 3: Color schemes

Every business has a specific color scheme.

For Tesla it's red + white + black:

brand identity design
Source: car-brand-names.com

For Freelancer.com it's blue + white + orange:

brand identity design

And for Niel Patel it's orange + white:

brand identity design
neilpatel.com

There are three different categories of your color palette:

1) Your primary color

2) Your secondary color

3) Your accent color

Once you've selected all three categories of colors, you should apply them to your website in the following ratios:

  • 60% of your website should be colored in your dominant color.

  • 30% of your website should be colored in your secondary color.

  • 10% in your accent color.

brand identity design
Souce: medium.com

We'll run through the website creation process shortly.

If you already have a primary color in mind, you can populate a list of matching colors to help you decide on your other categories.

If you're hopeless at identifying matching colors (many of us are) you can use Canva's free color palette tool.

It's important to also keep in mind the unique definitions of colors. Yes, different colors mean different things.

Here is a summary of some of the definitions of popular colors. You should ideally choose a color pallet definition that aligns with your prescribed archetypes.

brand identity design

Source: canva.com

For more details on how to choose your color palette, refer to our brand identity design guide.

With your brand identity now fully defined, it's time to smear if all over your shiny new website.

How to create a business website

Creating a website is extremely overwhelming if you've never done it before. Don't worry, if you follow our step-by-step process it's really easy..

Background information

Here's a bite size website basics masterclass to bring you up to speed.

Web Hosting

You need to 'rent a space' in order to have somewhere to put your website. This is also known as website hosting.

Think of a website host as a giant bookshelf, and each individual shelf as the individual location of the websites that host supports. Each shelf has a unique location (or IP address).

The reason why you need a shelf is because you need room to store all of your website data (pictures, files etc). 

Some web hosts let you share your space with other websites. Think of multiple websites on the one shelf all sharing the same space to store data. This is not ideal and is, in fact, a major security risk because you don't want any of your storage shared with any questionable characters.

These shared IP solutions are easy to identify because they are usually dirt cheap. When choosing a web host you should always ensure that you are choosing a dedicated IP option (so you get an IP address all to yourself).

Here is a list of some popular web hosts:

Godaddy

Bluehost

Hostgator

Hostwinds

Domain name

The domain name is your website address or name.

For example,

www.YourWebsiteName.com

You should register your domain name after coming up with your business name so that you have a nice harmonization going.

You can search available domain names though free online search tools, a few are linked below. You could even use these tools when brainstorming your business name ideas so that you definitely choose a business name with an available domain.

Domain name search tool for GoDaddy

Domain Name search tool for Squarespace

General domain name search tool

Website security

Security should always be your #1 concern when conducting business over the internet, and fortunately there should security solutions you can adopt to keep your business as safe as possible.

It's imperative for your website to have an SSL certificate this ensures that all of the data you collect from visitors (contact forms and payment information etc) is kept secure.

A website with an SSL certificate is easily identifiable by a tiny padlock symbol in the URL, as well as the web address beginning with "https".

This visual proof gives visitors peace of mind and encourages them to step through your sales funnel.

sales funnel

If you're building your website from scratch you will need to purchase an SSL certificate separately from your web host.

If you are using a drag and drop builder, they usually come with an SSL certificate already installed (more on that to come)

These different website build environments are also known as website platforms.

Wireframing your website

OK, no we're switching over to some heavy machinery, let's start designing your website!

When drafting your website design, there is a certain framework you need to follow. This will ensure everyone you collaborate with understands what features you want and where you want them.

This is also known as 'wireframing.'

But before you start unravelling your wire spool, you should determine how many pages need on your website, and how they will all relate to each other, also known as your 'sitemap'.

Here is an example of both a sitemap and the common set of pages on a business services website:

sitemap
Source: quicksprout.com

Now you will need to create wireframes for each of these pages and indicate the user journey through a wireflow.

Here is an example of a wireframe design:

wireframing design

And here is an example of a wireflow design, which is a representation of how users will interact with these pages.

wireflow design
Source: justuxdesign.com

To learn how to create wireframes and wireflows, refer to our guide to wireframing a website.

Designing your website

WIth your wireframing done, it's time to fill this mould with some stunning web design elements.

Your web design process should strictly follow a UX framework.

UX, stands for "user experience." Your website should be designed to give your visitors the best possible navigational experience, otherwise they will leave and never come back!

A UX optimised designed makes it very obvious for visitors to comprehend what you would like them to do.

Do you want visitors to subscribe to your email newsletter?

Do you want visitors to make a purchase?

Do you want visitors to read a certain section of your website?

All of these desired actions can be hinted at with some clever UX designing.

To learn how to create a UX optimised website design, read our guide to designing a beautiful website.

Choosing a website platform

Now that you have your entire website blueprint complete, it's time to start transforming it from  concept to reality.

To build your website you will need a website platform. Let's help you decide which website platform is best for you.

If you are a complete beginner with no coding experience, a drag and drop builder is a great choice. They are designed to be incredibly intuitive, so there is little to no learning curve.

Some examples of drag and drop builders are.

The advantage of choosing a drag and drop builder is that they come preloaded with an SSL certificate, so there is no need to pay for one separately.

But the convenience of having a lightning fast design solution comes with a considerable caveat, you have very little complexity bandwidth to play with.

So if you have a complex website design in mind, these drag-and-drop builders won't help you. Instead, you should settle for a more rugged platform with considerably greater customization capabilities

For a detailed overview of these platforms, refer to our guide to choosing a website platform.

If you want to build an ecommerce website, this guide will help you choose the best ecommerce platform0

Writing content for your website

With your website now finally designed, it's time to add words to it. But just like every other design stage we've covered, your web content should also follow a strategic framework.

There are three primary things you need to keep in mind when writing your website copy.

This first thing is your brand identity, make sure you are always adhering to it. So maybe avoid using gifs if you have a very serious archetype. 

The second thing is SEO. SEO (Search Engine Optimisation) is a methodology of making your content favourable to Google's search algorithm. When your content is SEO optimized it helps you rank on the first page of Google.

And when you rank on the first page of Google you get free traffic!

To learn how to write SEO optimized content, refer to our 2020 SEO guide here.

To learn how to also weave in highly effective sales strategies into your content that will increase your conversions, follow our 8 tips for writing copy that sells.

If you want to outsource your SEO efforts to the experts, learn how to do it here.

Final thoughts

Seeing your business idea transform from concept to fruitful reality is one the most exciting experiences in life. This first step to achieving this is having a well designed website.

Follow this post to ensure you don't skip any of the important steps when crafting your website.

Haberdar Kalın

Haber bültenimize abone olun ve önemli konulardan haberdar kalın.
Abone olduğunuz için teşekkürler! Sonraki güncelleme için gözünüz gelen kutunuzda olsun.

Talk to one of our Technical Co-Pilots to help with your project

Get Help Now
Sizin için Tavsiye Edilen Makaleler
If you want to stay competitive in 2020, you need a high quality website. Learn how to hire the best possible web developer for your business fast.
11 MIN READ
Want to get into web development but don't know whether to be a front end or back end dev? We'll teach all of the skills required for both jobs.
8 MIN READ
Scaling your startup is a delicate balancing act. Scale too quickly and your funding is depleted. Scale too late you've missed your opportunity.
23 MIN READ
Struggling to come up with the best idea? Our exhaustive guide runs through the idea generation process to help you tap into your inner Steve Jobs.
10 MIN READ