Learn to create a website – or improve your website – today

Do you want to create a website for yourself or your business? Or learn how to improve an existing website? Here’s everything you need to know to become your own web developer.

This course, written for students of the one-day website workshop, takes you through the whole process, step by step. With a special emphasis on content.

I am making it available to the world because not everyone can afford to pay. If you find this information valuable in any way, please do something nice for someone else today.

Building a website, with WordPress or another website builder, is the easy bit. But what words should you use? And what pictures? That’s what this is all about.

Alex Crowe – yourwebsitecourse.com tutor

Please click this button (redirects to Paypal) if you recognise the value of this course and would like to thank the creator:

For a limited time, you can book one hour of free website advice with
no further obligation. Click here for details.

yourwebsitecourse syllabus starts here

The all-important brief

Before the course, you should complete a “brief” to the best of your ability. The brief contains the essential elements you need to create a website that’s right for you. Whatever website you are building – e-commerce, non-profit, personal, corporate, educational, community, portfolio, resumé, business directory or something entirely new – you must start with a brief.

The different sections of this document make you think about:

  • Why you need to create a website
  • Who your website is for
  • How many pages it must have
  • Which words are essential
  • What images it must include
  • How often you should update it

Above all, the brief will reveal the single most important message of your website – the foundation on which your entire website will be built – the unique selling proposition (USP).

brief to create a website
This brief will help you create a website that works
paperclips for briefs

Professionals always use briefs

I spent decades working in advertising agencies, in the UK and USA. I worked on thousands on jobs – websites, brochures, press ads, billboards, TV and radio commercials, coupons, direct (aka junk) mail and more – and every job started with a brief. (In fact, every project is called a “brief”.) 

The more time you spend working on your website brief, the better it will be, which is why you should download and start filling it in now. Once complete, you will refer to the brief constantly, to make sure you create a website that stays on the right track.

Keyword search

Keyword search on "website"
A keyword search result on answerthepublic

The first practical exercise on yourwebsitecourse relates to keywords and demonstrates why choosing the right keywords is so important. There are several useful tools available online, including:

You can use these tools to research the keywords your website needs to rank highly in search engines like Google, Yahoo and duckduckgo.

Keywords are so important, they appear throughout one-day workshop – and this website. You will use them to create website headlines and subheads, captions and tags for images, and body copy (advertising industry jargon for text like this).

Ten years ago, using keywords on websites was repetitive and frustrating from a creative point of view. Happily, search engines now recognise words related to your keywords, which means writing websites is more natural – and more fun.

image of pencil and sharpener

Create a website plan

create a website plan
Creating a website plan is a pen and paper job (pencil is also good)

After the brief, the next step is to create a website plan. This is not the site plan you will submit to Google and others after your website is finished. This is the plan for your site before it’s even begun. Sometimes also called the site structure.

During the one-day workshop, you team up with another student to decide what pages your site really needs. You already have some idea, but your partner will have ideas that could spark genius.

Teamwork works wonders

Two minds are better than one, which is why creative teams in advertising agencies traditionally have two people – a copywriter and an art director. If you are working on your own, with this website for guidance, meet a friend to play around with some ideas.

  • “Homepage” is a given – this is the page your visitors see when they type in your domain name (aka “url”) or link to your homepage from somewhere else (aka “external link”). It’s the page you’re looking at now. 
  • Contact” is also normal, so visitors to your website can get in touch with you easily. 
  • About” is also common, where you can talk about yourself and/or your business for anyone interested in your story.

You can call these pages whatever you want, but don’t confuse people off by being too “out there”. (The contact page on this site is called “Get in touch”.) Clever is rarely better.

How many pages?

You may think you want three pages but actually need eight. Or you may think you need 20, but all the information can be grouped into five. Or a Homepage that scrolls for ages (like this one – which is great for mobile devices). When you have more of an idea, you can run it past the group (in the workshop), or helpful friends, and get more feedback.

Content is king

Now you know who your website is for (it’s on the brief). What you are telling them (the brief again). And how many pages you need. So it’s time for one of the most exciting and enjoyable stages of the process: creating content.

Content falls into two broad categories – words and images.

section of computer keyboard

Create a website | Content: Words

Create a new folder on the desktop of your computer, and call it: “Website”. Inside this folder, create a new folder called “Words” (for example).

How to start writing

Open a new document in the word-processing software on your computer. Welcome to the blank page. (It doesn’t stay blank for long, so enjoy the moment.)

Have another look at your brief and start by typing “(Homepage)” – including the brackets. Under this, type the “Proposition” (aka USP) from the brief, which will act as a working headline. (All of this will change before you are finished. You are just arranging the pieces of the jigsaw before putting it together.) You can underline this headline, or put it in bold, or increase the size of the text (aka “point size”) – or a combination of these. It won’t affect the website, but it will make you feel professional.

You’re a writer now.

On a new line, type “(Pic of XXXX)”. [Instead of XXXX, type something that makes sense with your headline. More on this, later.]

Now select everything you have typed so far and centre it all (aka “align centre”). Now save the document in the “Words” folder you created a moment ago. You’re off. You can now reward yourself with, as the genius Douglas Adams would say, a nice, hot cup of tea. (Other beverages are available.)

Create a website copy sheet
This is how I typically start to write a website.

The first paragraph

Refer back to the brief, to remind yourself who your target audience is. Now, begin your first paragraph with the magic word: “You”. This is the most important word in this document. In terms of communication, it’s the most important word in the world. 

You, you, you

As you write, you will use “you” almost exclusively – and you will almost never use “us”, “we” and “our”. No one is interested in hearing you talk about yourself (sorry) they want to know what’s in it for them. (This will change when humans realise that loving everyone and everything – without exception – is what life is really about. But this teaching falls outside the scope of yourwebsitecourse.)

Your first paragraph will be filled with keywords relevant to your website and your target audience, and words related to those keywords. Eventually, you will link to all the other pages on your website. Include them now and you can create internal links later. Like this one, to my “About” page

You will write the first paragraph many times. You may even start it and come back to it later.

True story: I once spend a day and a half working on the first sentence of a letter, for a car launch. The effort paid off, when the work won an international copywriting award. (Note: This is totally meaningless outside the ad industry. And barely meaningful inside.)
create a website using "you"
You is the most important word in the writing world

I used to play a game when I wrote advertising material. I would try and get the word “You” as close to the beginning of the piece as possible. One of my most successful opening lines, in a letter, was this: “Let’s talk about you.”

Alex – yourwebsitecourse creator

— Hit save —

How to beat writer’s block

Sometimes, when writing your website, you can feel stuck when faced with a computer screen. If so, reach for a pen and paper and write the old-fashioned way. There are two great things about this method:

  1. You will not lose any of your work. When you cross out a word or phrase, you can still see it. (When you delete a sentence in a word processing document, it may be gone forever.)
  2. As you transfer your handwritten work onto a computer, you will naturally edit the text. Your second draft (the one going onto the computer) will be better. It will improve with every edit until it is “finished”. (Narrator: It will never be finished.)

Big Friendly Fact: Roald Dahl wrote all his books by hand, in pencil. In a comfy armchair. It’s a wonderful way to write.

The most important words in the (advertising) world

“You” may be the most important word in the world of advertising. But other important words, which you already know (but didn’t know you knew) are:

  • Free
  • Now
  • Today
  • Discover
  • How
  • Easy
  • Win

Next time you see a headline that says something like, “Now you can discover how easy it is to win a free <whatever>” you will know the writer was too lazy or hungover to come up with anything original that day.

Or the headline was written by the client.

Possibly both.

Create a website tip: Do not use exclamation marks “!” or leader dots “…” in headlines. (Or even body copy.)

typesetting headlines and text

Creating website headlines and subheads

Google pays particular attention to headlines and subheads. Because people do too. 

Research shows that readers scan pages of text, reading headlines and first sentences of paragraphs. So you can use those headlines and subheads (aka H1 and H2 in webspeak) to tell your story.

Under your subheads, write a few words to flesh out the text. Sometimes, your writing will flow easily. At other times, just note down phrases or half sentences. You can come back and finish them later. That’s what editing is for. Editing is great! (See that tip above, about not using exclamation marks? This is why. Does it really add to what you’ve said? Probably not.)

Elephant face on

Two things to remember as you create your website

  1. Keep sentences and paragraphs short 
  2. Try and make only one point per paragraph

Image awareness

As you create the words for your website, think of images that could illustrate the points you are making. Make a note of those images in brackets in your word-processing document…

(Photo of XXXXX)

…centred on the page so you can easily find it later. (And because it looks good.)

Have fun. Remember to smile. (You are saving money by doing the work yourself. And you’re the only person in the world who knows this stuff. Woohoo!)

Editing text

You will not finish writing your website in one day. (Great news!) Or even in one week. (Even better news! The fun goes on!) But little by little, it will come together. (Satisfaction guaranteed!) (That tip about not using exclamation marks… As soon as you make a rule, it tries to get broken.)

When you feel frustrated, take a break. Or change your activity. When you come back, go through your document from the beginning. Keep referring back to your brief. Remember your target audience. Draw from your research – or do some more. 

The office between the ears is never closed

Steve Warrell—Art director

While making dinner – or in the middle of the night – you will think of a phrase you need to add. Grab a piece of paper and write it down. It’s another piece of the jigsaw. (Sometimes, these genius lines turn out to be terrible. And that’s OK too. Throw them away. Inspiration is inexhaustible.)

The overnight test

Even if you think you have created the best website page ever written, leave it overnight and come back to it in the morning. With fresh eyes, you will see something that could be improved. (Professional writers do this every day.)

Final draft?

When you have finished working on your copy, read it out loud. Does it sound natural? If you were having a friendly drink with your target audience, would you say it like that? Would they understand? Does the USP from your brief appear at the top of the page? (Although not necessarily exactly as it appears on the brief.)

If so, finally – and importantly – are there any:

  • Spelling mistakes?
  • Mistakes in grammar?

Your word-processing software may be able to help. But it might not catch  everything. (There is a double space between those last two worms. And that should be “words”. Argh!) You can use an online grammar checker like grammarly.com (which caught the double space but not the “worms”), or pay a professional poofreader. (Did you see what I did there?) 

You want to create a website that’s as good as possible. Or better.

overnight test

Avoid lengthy, unnecessary, repetitive, superfluous, extravagant and indecorously pretentious words. Like that. As one Creative Director asked me: Why use “narcotics” when “drugs” will do?

8 useful website-writing tips

  1. Use short words
  2. Use short sentences
  3. Use short paragraphs
  4. Use lists
  5. Use links
  6. Use images
  7. Use keywords
  8. Use the save button

Its or it’s?
“It’s” is only ever used instead of
“it is” or “it has”.
The rest of the time, it’s always “its”.
Isn’t it?

Alex—yourwebsitecourse grammar police

Repeat for every page

photo of pencil and sharpener again
Each page will have…

Go through the same process for every page of your website. Each page will have its own keyword or key phrase (aka “focus phrase” in SEO speak*). Depending on your business, it may even have its own target audience.

Try and link every page to every other relevant page using internal links. So you can show your readers everything you want them to see. And show Google your website is worth including nearer the top of their results page.

*We will come back to SEO a bit later.

pencil and sharpener
…a different angle

Revisit your Homepage

When you have written all the pages on your website, go back to the Homepage. By now, you know exactly what your target audience is looking for and exactly how your product or service is the answer. You are the world’s leading expert.

A final game to play is this: You have just six seconds to grab and hold the attention of your reader before they move on to another website. Have you done enough?

— Hit save —

The end?

If you are creating a website to sell something, can you answer these 10 questions with “Yes”?

Does your website:

  1. Describe the problem it will solve?
  2. Show you understand the problem?
  3. State the solution?
  4. Introduce the product?
  5. Say how the product solves the problem?
  6. Show how the product is different from the competition?
  7. Show how the product is better than the competition?
  8. Describe the result of using the product?
  9. Overcome the barriers to purchase?
  10. Tell your reader what to do next?

If so, congratulations!

celebrate creating your website fireworks

— Hit save —

create a website - images

Create a website | Content: Images

Now it’s time to put down the pencil. You’re about to become an artist. In the “Website” folder on your computer, create a new folder, called “Images”. 

Choosing the right images

Images are not there to fill up white space and make your page look pretty, they are an opportunity to:

  • Establish and reinforce your brand
  • Show your product or service
  • Support the point you are making
  • Help the reader understand the benefits
  • Generate a positive emotional response
  • Attract readers via online image searches 

Your images must be relevant to your target audience and chosen with the same degree of care as your words. They will also use keywords (or related words) in their names, captions and tags, as you will see.

create a website image search
You can’t create a website without great images

Collect your existing images

If you have photos or illustrations you want to use, move these into the “Images” folder in your “Website” folder. You’re off!

Make a list of missing images

Because you have made notes while writing your pages, you have a list of images to find or create. That list may be quite long. Don’t be alarmed. This is normal.

If you want a slider at the top of a page, you will need at least two images for that. And another image for your introduction. Then another image or two, to illustrate your story. (For example.)

Images tell stories

In the world of film, a scene might start like this: 

  • “Wide” shot – a city with famous landmark (to establish the location)
  • “Tighter” shot – a café on a street (drawing you in)
  • Close-up – sugar poured into a cup (more intimate)
  • Medium shot – two people talking (back to the plot)

How can you draw the reader into your story using images? A mix of wide shots and closeups could be good. 

Images with people and animals

Using people in images can work wonders. It helps your target audience see themselves with your product or service. But you can run into issues of age, race, gender etc. 

Two case studies

1) One world-famous airline solved this problem by using images that showed the presence of people, without showing the actual people. For example, footprints in the sand on a beach.

2) One housebuilder used illustrations of puppies and kittens in their advertising. Foot traffic to the showhomes was good. As an experiment, they tried illustrations of human babies. Foot traffic dropped off dramatically. The animals were back within a week.

Creating and finding photos for your website

create a website image online

Here are four ways you can find the images you need to create a website.

  1. Take them yourself
  2. Employ a photographer
  3. Use a photo library
  4. Online image search
create a website image with a camera

Does this image go with this headline?

Headlines and images should complement each other, and not repeat each other. Compare the two pretend ads. Which works better?

example image with headline
example image with headline

1) Create your own website photos

Creating your own photos makes perfect sense. Who better to photograph the subject you love than you? It’s free. It’s fun. You know where the light is best. You’re guaranteed to learn something – and you might find out you have real talent.

Here are six tips to get you started:

  1. Use the same camera for every shot (your mobile phone might be ideal)
  2. Consider everything that will be in the shot – not just the main subject
  3. Use props that are relevant to your target audience
  4. Take wide shots (you can crop them later on the computer)
  5. Take photos using natural light (ie, next to a window)
  6. If you see something wrong later, shoot it again (it only costs time and effort)
DIY website photography
DIY photography is fun!

2) Employ a professional to create website images

photography equipment
Professional photos should be excellent

If you have the budget, you could employ a professional photographer. You might still do a lot of the work, arranging props and setting up the shots. Or pay more and the photographer will provide a stylist, a model and whatever else is needed. Retouching may also be required.

This option can be expensive, but will give you the excellent results. Depending on ability and reputation, photographers can cost a few hundred per day to thousands (GBP).

I once asked a roomful of art directors in a major London ad agency how much the most expensive photographer they'd ever employed was. I think it was well over £20,000 – per day. A famous car photographer. He came out of retirement to work for a week or more. Many people would.

3) Use a photo library to create your website

For many years, advertising agencies have used photo libraries instead of employing photographers. The picture libraries they use (like these) can be expensive, because of copyright and usage fees.

Agencies just pass these costs on to their clients, which are passed on again to the consumer.

Happily, there are photo libraries where we can all find images that are free to use. Here’s a blog post that includes details on usage rights so we won’t get into trouble. (The yourwebsitecourse website uses images exclusively from pixabay.com. Apart from the one above of the site plan, which I shot in front of a window, and some screen grabs.)

image library search
I use pixabay more than anything

Too much choice?


Now you have access to millions of images, how are you going to find the few you need?


One at a time

Photo fact: Professional art directors and graphic designers get paid to spend hours looking through photo libraries for exactly the right shot. Now it’s your turn. Relax. Have fun. 

Example image search

Here’s an example of how to find an image quickly and easily, using a photo library. (Written as it happened.)

You decide your website needs a cup of coffee (probably because you do). You go to pixabay.com and type “coffee cup” in the search bar. You select “photos” from the “images” drop-down menu (because you are not interested in illustrations, vector graphics – whatever they are – or video). You are shown 37 pages of coffee cups. Lots of them are great, but it will take ages to look through all those images. Nothing grabs you on Page 1. 

Then you have an idea. You type “empty coffee cup” into the search bar. There’s only one page of results (happy face) but none of them are inspiring (sad face). 

Another idea: you search for “espresso cup”. There are 12 pages of results. Most of the images are excellent – and there’s a photo on the second page that stops you in your tracks. A headline idea arrives that works with the image and – voila! Job done. 

To save the image, click on it and download it to your “Images” folder. You can register to download large file sizes.

example create a website image search
Here’s the image. And now I will.

4) Google “Images” to help create a website

Google images hompage

Search engines like Google give you the option of finding images on the web. (This is why you include keywords in the title of your images. You never know where a new reader will come from.) 

If you are not familiar with this, go to Google and click on “Images” at the top of the page on the right. Now type the image you want into the search bar (eg, “coffee cup”). And you will be presented with an enormous number of images.

Click on “Tools” just under the search bar on the right (at the time of writing) to refine your search. Under “Size”, you will want the larger file sizes. Under “Type”, you will want photos. You can also include usage rights so you don’t accidentally breach someone’s copyright.

Create-a-website tip: When you use stock photos, choose images that look natural and believable. No clichés. No impossible situations. You want readers to take you seriously and believe what you say.

Website image formats

Banner image example
16:9 normal format

Your website will need images in various formats (shapes). Such as:

  • Long, thin images for banners
  • Square images
  • Standard formats (eg, 5:7)
  • Contemporary formats (eg, 16:9)

Choose a few formats you like and stick with them. The yourwebsitecourse website generally uses these, except the 5:7, which is a bit ordinary for me. But for your site, you are the photo editor – and what you say goes. Consistency is important, for a professional look and feel. (The same applies to colours, fonts, and font sizes.)

Useful images for creating websites

One advantage of the “Take a short break” coffee cup photo is the space. This is perfect for adding headlines that will be easy to read.

A mistake in black and white

While on the subject of images, avoid having light coloured text on a dark background when there is a lot to read. White text on black is 90% harder to read than black text on a white background. The reader’s mind may treat your important words as an image and not even read them. Or give up half way through because it is too difficult to read.

While on the subject of images, avoid having light coloured text on a dark background when there is a lot to read. White text on black is 90% harder to read than black text on a white background. The reader’s mind may treat your important words as an image and not even read them. Or give up half way through because it is too difficult to read.

Cropping images

Your computer probably has all the photo-editing software you need. You can crop images, adjust the colour, brightness, contrast, add filters and reduce the image file size with a few clicks of the mouse.

Cropping images is another chance to explore your artistic side. Here’s a short video that will give you a few ideas about how to improve the image you will use to create a website. Don’t forget your target audience – your website is for them more than you. 

Naming website images

Image names are important – for you and search engines like Google. One reason the coffee cup above was on page two of the pixabay results was its file name (other reasons include tags – more on that, later).

Every time you crop and save an image, give it a name that makes sense without looking at the image. For example, “coffee-cup-banner”, “coffee-cup-square”, “coffee-cup-16×9”. You do not want a folder full of files called “DSC-0974” and “IMG-427”. 

Resizing images for the web

Mobile phone photo
This image weights just 49 KB

Images taken with a mobile phone, tablet or fancy camera may be enormous – in pixels (px) and in megabytes (MB) . These massive file sizes will slow down your website, and create three unwanted problems:

  1. The site is so slow to load, the reader moves on – and you’ve lost them forever.
  2. Google knows your site is slow and marks you down in their search results page.
  3. Your images use up bandwidth and you may have to upgrade your hosting account.

The solution is “optimisation”. That means making each image as small as possible, without reducing its quality.

How to optimise your website images

Create a new folder in your website “Images” folder, called “Images-FINAL” (for example).

Make a copy of every image and move the copies into the “Images-FINAL” folder.

Using the photo editing software on your computer, reduce the dimensions of each image to the size they will be on your website. This might be 300 pixels wide for an image on a page, or 1900 for a banner. (Do this later, after you have chosen your WordPress Theme). Then use free online image optimisation software like Kraken to reduce the size of your images further.

Save these new, optimised images, in a folder called “Images-OPTIMISED”. (You will see why, later.)

If an image loses too much quality, make a new copy of the original image and start again.

You will need images in various sizes, for your website and for other social media activity. Here is a really handy blog post that tells you the recommended image sizes for social media in 2021.

Last year, a designer told me to save images as .png files with a density of 72 dpi. I am exploring this and it seems to work. I still tend to save images as .jpg files. I wish this was all easier and maybe it will be in time. If you find it a bit overwhelming, take another short break. 
paint brushes
This image is 400 x 711 pixels and weighs 101 KB

Other forms of website content

Your website may also include links to and from YouTube, SoundCloud, Twitter, Instagram, Snapchat, Pinterest, iTunes, Podcasts and other forms of content. Everything is possible.

website designer pen
This image is 1591 x 265 pixels and weighs 82 KB

Create a website | Design

Now it’s time to put down the paintbrush. You’re about to become a website designer. 

Why pen and paper?

Wordpress Themes
There are 4,000 WordPress Themes today. You only need one.

At the moment, there are about 4,000 WordPress Themes to choose from. So it’s important to have an idea of how you want your website to look before you start looking through the options. (Or your brain will melt.)

Go back to the brief. How will your target audience find your website? Will they use a desktop computer, tablet or phone? Will they be at home or at work? Or commuting? How do you want them to respond?

What do you like? A big picture, filling the screen, with a headline, subhead and call to action right there? Or a slider that changes the image every few seconds?

Draw a rectangle on a piece of paper, the size of a credit card, and sketch how you want your Homepage to look. Now draw another. And another. (Professional designers can do this for days.)

Website creation design tips

Here’s an excellent article with some website design tips backed by research. Five points worth mentioning, which are included in most WordPress Themes as standard, are:

  • Logo in the top left
  • Horizontal navigation in the header
  • Search bar at the top
  • Social icons at the bottom
  • Mobile responsive design

Try and change the layout of the page as the reader scrolls down. Sometimes a small image on the right. Sometimes a big image running across the whole width of the “page”. Sometimes text in two columns etc. 

Short columns of text are read more than wide columns. Use the sketches you made on paper to inspire the designs you will complete on the screen. Scroll through this page again and see what you prefer.

WordPress regularly “improves” the way you create pages. The “block editor” introduced in WordPress 5.0 means the choice of Theme is less important than previously (at least, to me). Here’s a sample page I created to show what different blocks do. (More blocks have been added since I made this sample page, but you get the idea.)

If you have worked with the WordPress Classic Editor, here is an article that shows you how to work with blocks. If the change is too much for you right now, here’s a plugin that restores Classic Editor.

ethernet cable

Create a website | Becoming your own web developer

Now you can put down the pen and reach for the mouse (or trackpad). You’re about to become a web developer.

Buy your domain name**

If you already have a domain name (aka url), go to the next section.

If you haven’t decided on a domain name, it’s time to have some fun. You will see the domain name for this website begins with “you” and includes “websitecourse”. Which helps readers know what the site is about immediately. 

A short, memorable name makes sense (to me). To see if it’s available, type it into a search engine. Or use the domain name finder at someone like Penguin UK (go through this link and I will get a £5 referral bonus if you sign up with them).

Prices for domain names through Penguin UK are low and renewable every 12 months.

Here’s a video you might find useful – it’s not about WordPress but it is about doing all this free. And that’s why you’re here. (I don’t do it this way, but you can.)

**If you want a COMPLETELY FREE domain name, go through WordPress.com. Your url will be longer, but FREE. (I’ve made a version of this website at yourwebsitecourse.wordpress.com to show you what that can look like.)

Buy web hosting***

penguin internet logo

If you already have web hosting, go to the next section.

Before you can build a house, you need land. In a similar way, before you can build a website that people can find online, you need web hosting. 

The yourwebsitecourse site is hosted by Penguin UK – a company that offers packages from just a few pounds a month. For more information, click on this link (I will get a £5 referral bonus if you go on to buy.)

If you are paying more than that for your web hosting, you can transfer your hosting to Penguin UK – and save money – by clicking on the link. I’ve been using this company for years and their technical support (if needed) has been very good.

***If you want COMPLETELY FREE hosting, go through WordPress.com. (You’ll have the longer url, and some options are more limited, but hosting will be FREE FOREVER. See the WordPress.com version of this website for a live example.)

Now you have a name, an address, and content, it’s time to build your website. You can do this on your computer, or – if you’re feeling more rock and roll – live online.

1) Build and test a WordPress website on your computer with Wamp or Mamp

wamp and mamp logos
Wamp for PCs and Mamp for Macs

You can build a website on your computer using something called Wamp (for Windows users) or Mamp (for Mac users). This allows you to build a fully functioning WordPress website, including all your images and text, on your computer (aka local host).

  • Windows users can follow the instructions on this post
  • Mac users can follow the instructions on this post

(These links also link to articles on publishing your website online when you have finished building it.)

Then clone your website with a Plugin

You can move your completed website from your computer to online with a cloning plugin. This worked for me a few years ago, but not recently. There are paid plugins that would work, but yourwebsitecourse is all about doing it for FREE. (This will make more sense when you know more about WordPress, in a little while.)

Or copy your website page by page

Another way is to create a website in Wamp or Mamp. Then create it again live online. You just copy and paste, page by page. When you’ve just done it on your computer, it only takes a few minutes. Not as scary as it sounds.

Or upload it via FTP

The professional way to do it would be to build the website in Wamp or Mamp then upload it using file transfer protocol (FTP). I’ve done this, but I prefer to create websites live online. No doubt some people will be horrified by this. I’ll leave the comments open on this page so they can express themselves…

2) Build a WordPress website live online (the rock and roll method)

If your domain name is new, no one in the world knows about it and you can build the site live on the Internet in real time. If your domain name already exists, you may want to build your website on your computer before uploading it to the Internet. (See above section: “1) Build and test a WordPress website on your computer with Wamp or Mamp”.)

After you have a web hosting package, it will only take a moment to install WordPress. With Penguin UK, simply:

  • Go to your Control Panel
  • Scroll down to the Softaculous Apps section
  • Click on the WordPress logo
  • Click install
  • Complete the sections on that page (NB: delete “wp” in the “In Directory” section)
  • Select a Theme (any for now)
  • Click “Install”
wordpress logo
40% of all websites use WordPress – that’s a strong recommendation

(Have another look at that “How to make a website in 10 minutes” video to see how you can do this in GoDaddy.)

The WordPress Dashboard

Now you will see the WordPress Dashboard.

wordpress dashboard image
Your dashboard will look something like this (image from 2019)

Four essential WordPress Plugins when you create a website

Plugins are extra bits of software that help you create a website that works the way you want. Here are four essential Plugins to download before you even start build your site (live or with Wamp or Mamp). Trust me on this.

To download a Plugin, in the black sidebar on the left of the WordPress Dashboard (currently under “Appearance”):

  • Click on “Plugins”
  • Click “Add New”
  • In the search bar, type the Plugin name
  • Click “Install Now”

When you have downloaded a Plugin, “Activate” it and follow the instructions. Within moments your website will be protected from spam, registered with Google etc, have useful extra options to help you build your site, and a powerful SEO helper (see more below).

Premium Plugins

Many Plugins are free but offer extras features when you upgrade to Premium. Start with the free version – you may never need to upgrade.

Read about the Plugins you want before you install them and delete the ones you don’t use. (Plugins take up web hosting space and you want your site light and fast.)

Create a website media library

create a website media library
Create a website media library with a couple of clicks

Because you have done the hard work already, you can create a website media library in a couple of clicks of your mouse (or trackpad).

In the black sidebar on the left of the WordPress Dashboard:

  • Click on “Media”
  • Then click on “Add New”
  • Click on “Select Files” (just like the picture here)
  • Select all the files in your “Images-OPTIMISED” folder (hold down the SHIFT button and click on the first and last)
  • Import them

While they are loading, congratulate yourself on a job well done. Now carry on, step by step.

Apple mouse

Create a website | How to build your site in WordPress

Just follow these next steps and it will become clear why the headlines are what they are. As with all things, enjoy the process. Breathe. Everything will be OK.

1) Create your website Pages (Part 1)

In the black sidebar on the left of the WordPress Dashboard:

  • Click on “Pages”
  • Click on “Add New”
  • In the box where it says “Add title”, type “Home” (for example)
  • Click on “Publish”
  • When asked if you are ready, click on “Publish” again now

Repeat the process for every page you have on your website plan (aka structure). Just type in the titles for now. You will add all the content later. (They will not all have “Home” in the title box.)

create a website page
You are (currently) asked to publish each page twice. Go ahead.

2) Create your website Menu

pic of creating a menu
Just take things one step at a time. Take short breaks as needed.

Creating a website Menu in WordPress is one of the easiest, most satisfying and exciting features. Yes – exciting!

In the black sidebar on the left of the Dashboard:

  • Click on “Appearance”
  • Then click on “Menus”
  • Click on “Create a new menu”
  • Give the menu a name (“Menu 1” is fine – no one will ever read it)
  • Add your Pages to the Menu (by selecting them and clicking “Add to Menu”)
  • Re-order the menu by clicking and dragging the boxes around in the list
  • Click on “Save Menu”

Change the Menu labels

If your Page headline is quite long, you should replace it with a special short title in the Menu. (Aim for Menu labels of one or two words.)

In the “Menu structure” area:

  • Click the arrow next to “Page”. This opens the box to reveal the “Navigation Label” field.
  • Type what you want to appear in the Menu here. Then “Save Menu” to see your changes take effect. 

Change the menu order

Simple click and drag the boxes vertically. (I love this so much.) Then save.

Create sub-menu items

Sometimes, you will want several pages to appear under one Menu label. (These are called “sub-menu items”.)

To do this, click and drag the box one place to the right (as in the picture above). Click “Save Menu” to see what this looks like. You can easily change it back.

Create Menu labels that don’t link

If you want Menu labels that only have sub-menu items, you can create “Custom Links”. These are great.

In the “Add menu items” section:

  • Click on “Custom Links”
  • In the URL field, type “#”
  • Click “Add to Menu”
  • Drag the box to where you want this in the “Menu structure” area
  • Change the “Navigation Label” to what you want the Menu label to say
  • Drag the sub-menu items to the order you want under this
  • Click “Save Menu” to see your changes take effect

For other enquiries, ask Google

If you want to know how to do something unusual with your Menu, there’s a good chance someone already has the answer. Google is your friend and ally.

(You could also ask me for help – hourly rates apply.)

3) Choose your website Theme

In the black sidebar on the left of the Dashboard:

  • Click on “Themes”
  • Click on “Add New”
  • Check out the “Popular” Themes
  • Click on “Latest” to see all 4,000(ish) Themes
  • Try the “Feature Filter” too

Use your hand-drawn designs to find Themes that match your vision for your website. Write the names of those Themes down (so you can find them again) and look at the demos for further information. When you find a Theme you want to use (which may take hours), click on “Install”, then “Activate”.

The yourwebsitecourse Theme is “Customizr” and the Theme at yourwebsitecourse.wordpress.com is “Twenty Seventeen”. Both are free – and easy to set up. All Themes have tutorials, helpful documentation and, often, forums.

pic of choosing wordpress theme
Now you find out why you started with a pen and paper.

Upgrade to Premium?

Many free Themes can be upgraded to Premium Themes to unlock extra features, like customisable colours, fonts and logos. Wait until you are sure you like the Theme before doing this. (You may never need to do this.)

4) Customising your Theme (Part 1)

customise your theme image
It’s a lot of new information at first. Do not panic.

In the black sidebar on the left of the Dashboard:

  • Click on “Appearance”
  • Then click on “Customise”
  • Click on “Global settings”, “Front page content”, “Header”, “Footer” and “Widgets” (or whatever it says here for your Theme).

Just spend a few minutes getting familiar with these sections and this new vocabulary. You will come back to this later.

Before long, you will be able to navigate your way around here quite happily. Right now it might seem quite alarming.

5) Create your Pages (Part 2)

This is where it all comes together. The words you’ve written, the images you’ve found, made and loaded into the Media library – everything.

In the black sidebar on the left of the Dashboard:

  • Click on “Pages”
  • Then click on “All Pages”
  • Click on the Page currently called “Home”

Then go to this example page to see how to add your content to your page using the WordPress block editor. Repeat for each of your pages. (That page was created in 2019 using an earlier version of the new WordPress block editor. Some of the blocks have changed, but you get the idea. It’s play time!)

edit wordpress pages
This is where it all comes together. Enjoy!

6) Customising your Theme (Part 2)

Now you have content on all of your pages, you can complete the customisation process and see what your website will really look like. 

  • Click on “Appearance”
  • Then click on “Customise”
  • Click on “Global settings” and go through every option for your Theme
  • When you find “Front page displays” select “A static page”, choose your Homepage

Every Theme takes time to set up before it looks like the examples on the Themes page – and every Theme is different. But each Theme has documentation and tutorials that will guide you through the process.

You may spend some time customising a Theme before realising you don’t like it. Or it doesn’t do something that’s really important to you. That’s fine. Just go back and try one of the other Themes you liked. I’ve done this more than once and the knowledge is never wasted.

Problem solving when creating a website

create a website keyboard

There are occasionally unexpected items in the baggage area challenges to overcome when learning a new Theme. Sometimes, you must walk away from your computer and have a cup of coffee. (Tea is also good.)

During your break, you may think of a solution to the problem. Or you will think of a question to ask Google, or the Theme Forum, or one of the other students on yourwebsitecourse. You have learnt a lot, but these are still the early days of your new job as a web developer. 

Be assured that all problems are solvable. And it is seriously satisfying when the one who solves that problem is you.

Using SEO to create a website that really works

SEO to create a website
The SEO comments on this page after I thought I had finished
Create a website SEO image 2
The SEO comments on this page after a few more tweaks
Here’s a tutorial made in 2018, updated in 2019 and titled 2020. There is a lesson in that for all of us.

When you install and active the Yoast SEO Plugin, you will see a special section under the editing area of every page you create.

Here, you will:

  • Choose a focus keyphrase for that page
  • Decide how that page will appear in search engines like Google
  • Find a detailed “SEO analysis” of that page

The first of the images here shows the analysis after this page was “finished”. The focus keyphrase is “create a website”. (The is the phrase I decided people would type into a search engine when looking for this information.)

The second image shows the analysis after I made the suggested changes. There is still one outstanding problem. Yoast wants to see the keyphrase included in even more headlines and subheads. I disagree on this point and am prepared to take my chances.

One more thing

When everything is finished, you might like to run your website through gtmetrix. This will flag up any urgent problems that might be marking you down in the eyes of Google.

PS Don’t forget to tweak your website every few days. So Google knows the website is alive and kicking. Just change a word or two on the Homepage, click on “Update” in the page editing window – and all will be well.

yourwebsitecourse syllabus ends here

Share the love

If you find the information on this page valuable – and it is – please do something lovely for someone else today. Failing that, do something lovely for yourself. We are all connected.

To show your appreciation for the time and effort that went into creating this course, click on the link on the right and buy me a coffee. Fairtrade organic Guatemalan is my blend of choice.