The

Website
Happy
Checklist

www.thewebsitementor.com
WELCOME
Hi, I’m Vicky, founder of The Website
Mentor and Azure Marketing.

My mission is to empower coaches and

course creators to set up outstanding
client experiences and extend their
reach through a well-planned and
strategic website.

So you end up with something that not

only looks great, but which delivers you
results, night and day.

With my custom design clients, and my Rock That Website students, I work
closely with my clients to dig into their purpose and create a website that
attracts and resonates with ideal clients.

I understand that custom design, or my 8-week Rock That Website course, is

not in everyone’s budget, but I believe good design should be accessible to
everyone.

That’s why I created this website happy checklist.

It’s an accumulation of knowledge that I have gained over the 18 years that I
have been building websites, and of the most common questions that I’m
asked.

Whether you have worked with a designer in the past and are spring cleaning
your website, or you have DIY-ed your website yourself, you will walk away
from this checklist with action steps to improve your website.

I hope this demystifies aspects of your website that may have tripped you up
before.

When it comes to websites, even small tweaks can make a big difference in
your client experience and the results you see online. Let’s dig in...

Vicky Etherington

w w w . t h e w e b s i t e m e n t o r . c o m
CONTENTS

Header
01
Footer
03
Images
04
Text
06
Website Jargon
08
 Header
The section of your website that is at the top of each page.
LOGO
Your logo should be at the top of
your website on all pages, either
centered or to the left.
It should be clickable and link back
to your home page. Where possible,
use a horizontally-oriented (long and
thin) version of your logo, and
ensure your business name is clear
and legible.
MENU ITEMS
Your top navigation should link to
the 5-7 most important pages on
your site.
Common menu items include: home,
about, services/work with me, blog,
and contact.
If using dropdown menus, be sure
there is an arrow to indicate that the
menu item drops down.
HOVER ACTIONS
When a user hovers on a menu item,
it should change in some way to
show the menu item is clickable.
This is usually a color change, but
could also be enlarging or
underlining the text on hover.
w w w . t h e w e b s i t e m e n t o r . c o m
HEADLINE
This is a crucial bit of text which tells
people who you work with, what you
help them with, and what their likely
outcome is going to be.
Possibly one of the most important
elements on your website, it tells
people from the moment that they
arrive, that they’re in the right place
and that you can help them.
CALL TO ACTION
If you have a strong call-to-action
(CTA) eg. book a call, download my
best strategy for xyz, you can add a
link to it in the header of your site.
If you don’t yet have a strong CTA,
I’d encourage you to find one. It’s
how you signpost people to the next
stage of their journey with you.
SEARCH
Make it as easy as possible for
people to find content on your site
by including a search function.
01
 Header
Things you SHOULDN’T include in your header

HAMBURGER JARGON
MENUS There’s no place for this on your
website, ever, and definitely not in
Your menu on mobile should be a the header.
hamburger menu (the one with 3
lines).

There’s a trend to also use CLEVER NAMES

hamburger menus on a desktop site,
Use conventional terms, not the
but it’s not a good strategy to force
names of your services, courses or
visitors to your site to click to view
offerings in your navigational menu.
the menu.
Sticking to regular terms may seem
unimaginative, but it helps people
SOCIAL MEDIA find their way around your site with
more ease.
ICONS
Use these with caution at the top of
your page.
VAGUE
You want to encourage visitors to HEADLINES
your site to stay on your website,
not browse your content elsewhere, Don’t assume that visitors to your
so save these for the footer. site know what you do.

Make the headline text descriptive,

so every visitor can tell what you do,
CLUTTER at a glance, within seconds.
The header of your page is no place
for clutter.

Keep it clean with plenty of white

space and room for the content to
breathe.

02
w w w . t h e w e b s i t e m e n t o r . c o m
 Footer
The section which appears at the bottom of every page
PRIVACY POLICY
& TERMS AND
CONDITIONS
A privacy policy states how you are
using customer information like
names and emails.
It’s become more important since
new privacy laws such as GDPR.
A terms and conditions agreement
states the rules, requirements, and
standards users agree to by using
your site.
These links must be clearly visible
but they don’t need to be prominent
SOCIAL MEDIA
ICONS
Include links to any social media
platforms which you use and update
regularly.
INSTAGRAM
FEED
A preview of your Instagram posts
in the footer is a great way to create
visual interest on the page and
encourage users to follow you.
w w w . t h e w e b s i t e m e n t o r . c o m
NAVIGATIONAL
PROMPTS
List any subpages that aren’t listed
in your header navigation, or any
key pages which you want to
particularly drive traffic to eg. a
‘services’ page.
WAYS TO
CONTACT YOU
List your email address / phone
number / contact form, a link to the
contact page or a book a call link.
Make it clear and easy for your user
to get in touch with you somehow
from the footer.
CALL TO ACTION
Include a link to your freebie, blog,
or newsletter sign up.
Make sure that you only have one
primary call to action otherwise it
becomes confusing.
And if you used one in the header,
make sure they match up.
03
 Images
The section which appears at the bottom of every page
IMAGE
RESOLUTION
Images for print need to have a high
resolution (a dense population of
dots per inch - dpi).
Print requires images to be at least
300dpi otherwise they appear fuzzy
when printed.
Those high resolution images result
in large file sizes and hence slow
load times on a web page, so it’s
important to use a lower image
resolution for your site.
72dpi is usually fine, although retina
screens sometimes display
144dpi, so using 144dpi will ensure
no loss of quality across all devices.
FILE TYPE
Photographs should be uploaded as
a JPG.
Images like logos and icons should
be uploaded as PNG or SVG files.
Be sure if you’re having a logo
created to request it in a .png
format with a transparent
background.
w w w . t h e w e b s i t e m e n t o r . c o m
IMAGE SIZE
Be sure to resize your images before
you upload them to your website.
You’re unlikely to need an image
wider than 2000px.
So this should be your maximum
dimension for a full width image.
If the images are too small, they will
stretch to fit the space and appear
pixelated so a good rule of them is
to add an image at 1.5 x the size
that you need it.
So if you need to fill a 300px space,
upload it at 450px. Remember to
resize them first.
at
COPYRIGHT
Don’t lift images from other people’s
websites or Google images.
You will likely find yourself with a
hefty fine if you do.
Ensure you have permission to use
any images on your site that aren’t
your own, and credit the
photographer where appropriate.
You can find royal free stock
imagery in a number of different
places.
04
 Images
FILE NAMES
Change the file name before you
upload it to your website.

Avoid file names such as A14589.jpg.

Use a description eg. woman-in-
park.jpg.

Keep your file naming system

consistent.

ALT-TEXT
Alt text is important for visually
impaired users and also for SEO.

Alt text should use natural language

and accurately describe the image.

Incorporate keywords, but don’t

overdo it.

Don’t include your business name in

your alt text.

Ideally, all images would have

different alt text so that they are
accurately describing the images.

05
w w w . t h e w e b s i t e m e n t o r . c o m
 Text
The headings, sub headings and paragraphs on your pages

TEXT SIZE COLOUR

Web copy should be at least 14px. CONTRAST
You may want to size up a bit for The contrast between your text
your mobile site. colour and background colour
should be at least 4.5 to 1.

LINE LENGTH You can check this using contrast-

ratio.com.
Lines of text that stretch across the
page are difficult for the eye to If the contrast is too low, users will
follow. struggle to read the text.

An optimal line length is between 60-

100 characters. (That’s why
newspapers and magazines are in TEXT CASE
columns) Capitalised text is harder to read.

Limit all caps text to headings and

subheadings.
TEXT COLOUR
Use dark grey (not black) or white Avoid setting paragraph text in all
(for dark backgrounds) text. caps.

Limit the amount of coloured text,

and primarily use it for headings,
subheadings or links. TEXT CASE
Line height is the vertical distance
between lines of text.

Optimal line height is 1.5 times the

text size.

For example, if your text size is

14px, the line height should be 21px.

06
w w w . t h e w e b s i t e m e n t o r . c o m
 Text
TEXT
JUSTIFICATION
Text that is more than two lines long
should be left aligned.

It is hard to read justified text, as

the wide spaces between words
means that the eye has to jump
around too much.

LETTER SPACING
Increased spacing between your
letters can increase the impact of
your headings.

But if you choose to do this, keep it

subtle.

For paragraph text, never increase

letter spacing as it negatively
impacts readability.

JARGON
There’s no place for this on your
website, ever, and definitely not in
the header.

07
w w w . t h e w e b s i t e m e n t o r . c o m
 Website jargon
Terms you may hear when you’re talking about websites
ABOVE
THE FOLD
The section of your web page which
is visible before a visitor has to
scroll.
FAVICON
The image which appears next to
your domain name in the browser
address bar.
RESPONSIVE
Responsive layouts adapt and
change depending on the device
they are being viewed on.
BACK-END
The back end of your website is
where you update software, publish
blogs and edit pages and posts
LANDING PAGES
A standalone page which is
optimised for visitors to take a
specific action, such as register for a
webinar or opt into a mailing list.
w w w . t h e w e b s i t e m e n t o r . c o m
CACHE
A cache is a device's temporary
storage space and improves page
performance.
When you visit a webpage, your
browser will keep a record of the
pages you visit, storing the files in
the cache which means that the
browser doesn't have to re-read
them.
It enables the page to load faster.
LEAD MAGNET
A free resource to encourage people
to opt in for your mailing list.
PLUGINS
Usually on a WordPress website,
plugins extend the functionality of
your site, in the same way as apps
extend the functionality of your
phone.
THEME
A theme is a tool to help you
customise the appearance of your
website.
08
 Website jargon
Terms you may hear when you’re talking about websites

URL
A URL incorporates your domain
name to form a full web address.

COOKIES
Small text files which contain
information about the pages that
you visit.

HOSTING
Web hosts enable our web pages to
be viewed across the internet.

It’s where all our website files are

stored.

HOLDING PAGE
Typically an interim page which is
put live on a domain name whilst the
full website is being built. Often
called a ‘coming soon page’.

09
w w w . t h e w e b s i t e m e n t o r . c o m
 If you’d like more help with your
website, you can book
a free Website Jumpstart Session

thewebsitementor.com/jump

Copyright The Website Mentor 2021. Not to be distributed

thewebsitementor.com