Step 6

bUILD YOUR WEBSITE

‘And that is exactly why I told you not to get near them.’


Black Panther just wouldn’t stop.


bom bom pow


The grounds shakes.


bom bom pow


But this time is different than with the Elephants.


bom bom pow


There’s electricity in the air, no... Magic is in the air tonight!’ screamed the MC.


It’s still plain day but the biggest party of the Jungle seemed to have just started.

And it’s your next destination.



Tililitilili *epic song*

A website can be huge to build so start small, start with one page.


First, bring some background, write about your ideal client. In which s(h)ituation are they?

Then, write about you. How do you relate to them?

After, write about your solution. How will you help them solve their issue?

Finally, tell directly and clearly how they can get that amazing solution. Should they email you? Fill in a form? Connect on social media?


Once you have published that one simple page, you can grow your website page by page.

!Attention! This section is longer than any other, and everything is important.


The last two steps, step 4 Search Engine Optimisation and step 5 Web Analytics, are especially technical. I understand it can feel overwhelming at first. Take it easy, it’s only at first. Reread them as many times as you need, you’ll get used to them. It’s gonna all right.


Click on the sections you want to review in the summary below:

1. A website? What website?

1.1. A remote freelancer website

There are many types of websites, blogs, ecommerces or personal websites. When you’re a remote freelancer, the first website you build might simply be your personal website.


It’ll be about you and your freelance work. You’ll explain your work and your goal is to get more clients. The domain name is usually your own name.

1.2. One or many pages?

There are so many things to do when you build your website. You need to choose a domain name, hosting, CMS, write the content, choose a design, review the SEO, implement analytics, and who knows what else.


There are many decisions to make. How will you decide all these? Where do you start?


Building a website with many pages is a big task and takes a lot of time. So break it down into baby steps. Start with one page. After, you can add other pages, one by one.


And now you have only one decision to make. What are you going to tell with that one first page?

2. The tech

2.1. Domain name

Building a website is like building a house. You need to buy the field to build a house on it. The domain name is the address and, usually, the name of your website.


You can choose the name you want, it’s not that important. If it’s a personal website, it’s even easier, it can be your name.


If not, then it must be easy to pronounce, write and be different from other names. Otherwise, your visitors might get it wrong and never reach your website.


Finally, your business name might even change soon. So let’s take this easy.

2.2. HOSTING

The hosting is the field. This is where your content will be. There are many providers.


The loading speed is key here. No one will stay on a website that takes a lot of time to load. It’s recommended that your website loads within 3 sec. Even though, many websites load in 5 or even 10 sec...

For a personal website, shared hosting is enough.


Where should you get it? We’ll see that in the next section.

2.3. Content Management Software (CMS)

This is the house. You’ll decorate it with content, text, images or videos. There are also many providers.


The most well-known are:


WordPress

Wix

Squarespace


But most platforms are not clear about what they offer... Some basic services are only offered in more expensive plans. And I don’t like that. So I chose a CMS that offers both a domain name and hosting at a clear price. That way, you have all services gathered into one price and (almost) one payment.


I chose SiteJet. It’s less well known, and it’s good. Their design templates are modern, clean and simple. The domain name costs about 20$ a year. Their hosting and CMS cost 75$ a year. They’re great value for money. Finally, they also have good support through Slack.

These are the 5 things I check when selecting a provider for a website:


  1. Domain name
  2. Hosting (speed)
  3. CMS (ease of use and features)
  4. Support
  5. Price

3. The content

3.1. Copy or design?

Should you start by writing your website copy first or should you start by designing it? Usually a mix of both.


Here is what I do:


  1. List the general structure of my webpage text on a document
  2. Try out design ideas in Canva
  3. Write the whole text on the same document as in #1
  4. Choose a template in the CMS and adapt the design ideas from Canva to it
  5. Adapt the text and design to fit if needed
  6. Add the text to the CMS
  7. Add the images and videos where needed

3.2. Copy

My favourite website structure is:


  1. Why
  2. How
  3. What


It comes from a TED Talk by Simon Sinek about the Golden Circle.

When we talk, we usually use the structure what, how and what. It’s fine, it’s not great. What sparks us is to start with why.

3.2.1. Why

Why is it important?

What’s in it for me?

What is your ideal client issue?

Why starts the topic.


You already worked on the why when creating your Ideal Client Avatar. You replied to questions like:

What do they fear now?

What can’t they stand?

Who do they envy?

That’s also the start of your copy.

Start with their problem, issue or challenge. Make it about them.

3.2.2. How

Explain how you work, not what you do.


How does it work?

Do you have any routine?

Which tools do you use?

What’s your workflow?


Those kinds of things.

3.2.3. What

What is it exactly that you do?

That’s what most people write and talk about. The exact details of your work, services or products.

3.2.4. Tone of voice

A message is about:


60% body language

30% tone of voice

10% content


When we write, we deliver only 10% of what we mean. Except when you use your tone of voice.


Write like you talk. It’ll get closed to real life. You’ll deliver more than 10% of what you mean.


Don’t write some corporate professional jargon. A result-oriented professional doesn’t even start to describe who you are.


So how do you talk?

3.2.5. Edit vs Censor

Express yourself with your own words. Tell and show who you are. Don’t abuse. That’s the difference between editing and censorship.


Editing is checking your text for typos, grammar mistakes, parts that seem unclear or words you’d prefer to use, or not.


For example, some people swear more than others. You don’t have to swear. If you do, you need to make a choice. Will you keep all those F* words in your text? How much do they tell about you? If that is really how you talk, then go ahead and use them.


Some people will hate you for that. Some will love you. We want to keep those last ones.


On the opposite, censorship is changing the way you talk, because you write, because it’s “professional.” You’re no Mr Smith, no robot, no result-oriented professional. You’re you.


Write like you talk and edit. Typos will always crawl somewhere.

3.3. Design

3.3.1. Canva

You can get inspiration and try out some ideas in Canva.

It’s a free design software. You can create all kinds of visuals, Instagram posts, LinkedIn banner, blog title, etc. They also provide with many photos and graphics.


For example, I liked the theme of the Book of the Jungle for this website. And so I looked at jungle graphics and pictures on Canva. That’s how I got the inspiration for this website.

3.3.2. Template

You don’t need to code to create a website. All CMS have design templates.


It’s like window shopping. Look at some and choose the one you like. You need to be yourself and speak with your own voice, that’s why you use your tone of voice. Design is the same.


Finally, choose something simple and clear. Choose clarity over clever or fun. No one will stick with you if they don’t understand you.


It’s a balance.

3.3.3. Colours and fonts

Choose 2 or 3 fonts and colours. Use them on your website and other illustrations.


You can choose one font and colour for the:


  1. Titles
  2. Text body
  3. Notes (if you want)


Notes can be some tips, links or buttons.


In a CMS, the colours and fonts are part of the template. You can change them to fit what you like or want to express, like your tone of voice.

4. Search Engine Optimisation (SEO)

SEO makes your website look good on Google. We want search engines to have it easy to display all that information.


Google has bots, like little bugs, that scrawl all over the web to gather information. We want the text and images on our website to be easily found by those bots. That way, they’ll list our website, visitors will get the info they need and we’ll get more visitors. Everyone is happy.


When you enter some keywords and make a search on Google, bots will crawl the web looking for those keywords and Google will list all the websites with those keywords. Most people only look at the 1st page of search results. So the higher your website ranks, the more visits it’ll get.


Your website rank depends on many factors like the text quality (copy), load time (hosting) or how many people click on your website link and then actually stay on your website.


For that, make sure you did or are working on those 5 SEO’s:


  1. Web page titles
  2. URL
  3. Images (ALT)
  4. Backlinks

4.1. Web Page Title

Recommended length: 50-60 characters


All web pages have a title. May it be your homepage, about page or a page about a good or service. It’s the text that shows up on your browser tab and the first line of text you see in a Google Search. It’s one of the first things you see.


You have 3 seconds to attract and keep the attention. It’s time to be short and clear. Sum up what your page is about in one short title.


For your homepage, your website name, aka your domain name, is enough. For your about page, “About” and “your website name” is ok. For example:

“About | The RFDM Jungle”


For other pages, make sure there are keywords about the topic of your page in your title. For example, right now, we are learning about SEO, so a page title could be:

“Search Engine Optimisation | The RFDM Jungle”

Or more specific:

“How to optimise your Page Titles | The RDFM Jungle”

4.1.1. H1

They are the subtitles or headings on your webpage. They can but don’t have to have the same keywords as your Page Title or URL.


For example, this webpage is about SEO but the headings are domain name, hosting, CMS, design, copy, SEO and web analytics. That is what those sections are about.


They help both your readers and Google bots understand how your text and page are structured. It’s easier to read and go back to parts you want to reread or refer to.


There are other subtitles, H2, H3, etc. They are not as important as H1. So use H1 for important headings on your webpage and you can use H2 for other less important titles.

4.2. URL

URL's listed on a Google Search page

Recommended length: ~70 characters


It’s the address of your webpage and includes your domain name. It looks something like this:

www.yourdomainname.com/yourwebpage


You can have many mother-daughter pages. They look like this:

www.yourdomainname.com/yourmotherwebpage/yourdaughterwebpage/yourgranddaughterwebpage


You can create many child pages if needed but you don’t need to go that far. www.yourdomainname.com/yourwebpage is already good.


The URL can be like a simplified version of the Page Title. Use only:


  1. Lowercase
  2. Keywords from your Page Title (no punctuation, accent or stop words)


Let’s say my Page Title is:

“How to customise your website SEO so that both Google bots and your visitors understand it”

It’s too long for a URL. A possible URL could be:

www.yourdomainname.com/how-to-customise-your-SEO

It’s shorter and we (both humans and bots) understand it’s like your Page Title.

4.3. ALT

Recommended length: ~70 characters


It’s the alternative text of an image.


It’s shown when:


  1. There’s a bug and your browser cannot display the image
  2. The computer is reading the website out loud, for example, for a visually impaired person
  3. Google bots crawl the web to rank images in Google Image.


Write a brief description of what’s in the image and include some keywords about your webpage topic.

4.4. Backlinks

Backlinks are links on other websites that link back to your website. Thus, backlinks.


In which cases can this happen?

  1. Someone liked your website so much they refer to it on their own website
  2. You wrote a guest post on their blog (or something similar) and your bio links to your website


You can influence #1 by building the best website you can. I hope this Step 6 will help you do that. You cannot influence much more #1. It’s their decision to refer to your website or not.


You can influence #2 a lot more. It’s Step 5 all over again.

If you’re at Step 6 now, it means you’re already working on Step 5. And that’s how you’ll get backlinks. So contact influencers. Do guest posts, take part in podcasts or videos, etc.


One backlink does not equal another. They depend on the website where they are. A website can be ranked in popularity and speciality.

There are 3 types of website on which you want your backlinks:


  1. Popular and specific
  2. Specific
  3. Popular


We do not need any links on websites that are neither specific nor popular. I advise you to focus on the specific (popular or not) websites.


The popular and specific is gold. It’s the website you want to be on. They have been there for a while and are well-known in your industry or topic.


The specific is a website that is also about the same industry or topic than your own website. But they’re not as popular, so they’ll be easier to reach and work with. Start with them.


Finally, there are the popular ones. They’re like general magazines. It’s great if you get a chance to be featured on or work with them. But they’re less interesting because they’re not specifically about what you do.

4.5. Google Search Console (GSC)

You can add your website to a Google directory called Google Search Console.

Thanks to that, you’ll see:


  1. how many times your website appeared in a Google Search
  2. how many it has been clicked
  3. which keywords linked to which web pages


The easiest way to add your website is to first add Google Tag Manager (see step 5.3). Then, GSC will recognise your email address too.

5. Web analytics

Why do you want to build a website?


It can take some time, moreover with many pages. So it’d better worth it.


Then, how do you know if your website is a success or not?


You might want to build your own website for fun. Then you know your website is a success when you’re having fun building it.


If you have other agendas for your website, you’ll need web analytics. Web analytics helps you track your website results.


They can be:


  • Visits
  • What visitors did before coming to your website (if it’s another website, it’s a backlink)
  • Time visitors spend on your website
  • How many pages they read
  • How much of a page they read (25, 50, 75 or even 100% of the page)
  • How many visitors downloaded a pdf or filled in a contact form
  • Etc.


They are many. Too many?

5.1. Goal

Per default, web analytics tools provide much information about your website results. They are not all relevant to your own website. Before looking at any analytics, you must know why you built your website and what is your goal.


For example, I built my own personal website to get more remote clients. That is its one goal. Not many, only one.

5.2. KPI’s

When you know what your website is here for, you can list relevant KPI’s to measure if you’re achieving what you wanted.


KPI’s are Key Performance Indicators. Key is key here. We must be selective.


For example, on my own personal website, 2 KPI’s are important:


  1. How many people read the whole page
  2. How many people filled in and sent the contact form


That’s all.


Your website goal might not change much over time. But your KPI’s will. It’s ok to list only a few now and then change them over time.

5.3. Google Tag Manager (GTM)

To track website results, I use Google Analytics. It’s easier to first install Google Tag Manager. That way, you can easily create all the KPI’s you need. That is what GTM is for, and to add your website to Google Search Console (see step 4.6).


When you create an account, you receive a code snippet to add to your website. Your CMS will have an article in its help centre about it. If it doesn’t, ask the support service.

You create Tags with GTM. Google created documentation to explain how to use GTM and how to create Tags. It’s well made. If it doesn’t help, the Community on Google is always there and helpful.


There is only one Tag that you must create. It’s the Google Analytics Tracking Tag.

Two other useful Tags are:


The Scroll Depth Tag - it tells if visitors scrolled 25, 50, 75 or 100% of your webpage

The Click Tag - how many visitors clicked and on what

At first, create the GA Tracking Tag. That’s the only one you need. After, if you want, you can create other Tags.

5.4. Google Analytics (GA)

You created your Google Analytics account and the GA Tracking Tag on Google Tag Manager. Now Google Analytics is working. Congrats!

5.4.1. Cookies

You’re now tracking visits on your website.


It’s nice to tell your visitors that you’re tracking them, may it be enforced by law or not. So add a cookie banner simply telling them something like:


“This website uses cookies to store information only about your visit here to improve it. If you'd rather not, you can use tools like the Ghostery extension.”


Give them an alternative. If they don’t want to be tracked, it’s their choice.

On the text above, I added a link to Ghostery.

It’s also Google browser extension I use to not get tracked in my own analytics. You should get it too if you check your website regularly.


Otherwise, you’ll see a spike in your analytics whenever you go check your website. And that’s no good.

5.4.2. Views

Per default, GA creates one view. But that view might get screwed, which we don’t want. So don’t keep only one view. I always create 3:


  1. Raw
  2. Test
  3. Master

You’ll never use the raw view. So that, if anything gets screwed, you’ll still have that clean and good ol’ raw view.


You’ll use the test view to test any changes. Once the changes are good, you apply them to the master view.


You use the master view to check your analytics and reports.


Right now, all you have to do is create those 3 views.

5.4.3. Reports

Most of your interesting website results are on the homepage.


They are:


  • Users - or visitors who came to your website
  • Sessions - or visits
  • Bounce rate – how many visitors left your website after checking only one page and did nothing else
  • Session duration
  • Traffic channel – where your visitors come from (if it’s another website, it’s a backlink!)
  • Device
  • Time of the day
  • Country
  • Pages


You can check those 9 metrics, more, or less depending on your own website and goal.


You can ask GA to automatically send you a short report every month. It’s called the “monthly snapshot” and you can find it under the admin menu. It’ll automatically remind you to check your analytics every month.

5.4.4. Events

There’s one last thing you can check about your website.


On Google Tag Manager, you can create the “Click Tag.” This Tag will automatically create events in Google Analytics. You won’t find them on the homepage, you’ll find them under “Events.” There, you can see all the clicks that were made on your website.

They are divided into:


  • Category
  • Action
  • Label


You can edit your GTM Click Tag or add new ones to have more Categories or Actions.


Labels, with our Click Tag, are defined with your website code (the “id” of the element on which the visitor clicked) on your website. Per default, many CMS have standardised id. For example, here, “cookieClose” means the visitor clicked the “ok” on the cookie bar and closed it.


You can customise the Labels by:


  1. replacing the id of the elements on the website
  2. creating more Tags in Google Tag Manager with the Label you want

Pappapappam *reward song*



‘...like someone like me!!’


The show ends in great spirit, Pink Monkey and Brown Bear best friends as ever, and the stadium literally on fire.


All monkeys and your little group are all evacuated in a big mess.



-- Congrats! You won sand bags, the monkeys carrying them and an MC Pink Monkey. --