Most websites are built to look good and show your business off. But if these are the only issues you take into account then you might be making the biggest mistake I see with websites. Which is ignoring whether your target audience is able to read it and find what they are looking for easily. There are lots of traps you can fall down. Are you falling down any of these?

Resources:

Find us at https://beyondthekitchentable.co.uk

Free PDF download: https://beyondthekitchentable.co.uk/downloads/

Blog post https://beyondthekitchentable.co.uk/blog

Follow us at https://www.instagram.com/beyondthekt

Hello, welcome to episode number 80 of the website, coach podcast.

And this week, I'm going to talk to you about what I think is the

biggest mistake I see on websites.

And that's to do with the readability of websites.

So somebody has found your website.

They might be your ideal client.

They're excited to find out more about what you offer and poised to work with.

You.

But they can't easily read or follow what is on your website.

So they leave.

Without becoming a client.

Now, I'm not talking here about people who are visually impaired.

That is a whole other episode.

But what you might call ordinary people.

People who make up a large proportion of your clients.

And sadly, a lot of websites are not built with readability in mind.

Was yours.

So what exactly do I mean, and how might you fix readability issues?

That's exactly what I'm going to talk about in the podcast episode today.

So.

First of all, let's talk about your choice of fonts.

I love a beautiful font.

There are thousands and thousands of fonts you can choose from.

Some, a very elaborate.

Some pretty simple.

And because there are so many, it's easy to choose the wrong one or ones.

We've all been in canvas and got lost down a rabbit hole of different fonts.

Oh, maybe that's just me.

But the most important factor when it comes to choosing fonts

for your website is readability.

You want to make sure that your font is legible?

And it doesn't strain the eyes of your target audience.

If I see a website with too much cursive, handwritten script.

I know it's going to be hard to read.

Especially on a mobile device.

It may look stunning.

But I'm know, I'm unlikely to read it.

Or read it all.

It's not that I look at it and say, I'm not going to read it.

I would just get partway down.

And my brain thinks this is too difficult.

And I just don't finish it.

Sorry, this is the truth.

And I know I am not the only one.

Of course, if I'm very interested in the content.

I may persevere.

But even then I'm unlikely to read as much as I would do with an easier to read font.

Because it's harder.

And if you choose.

W a website font, which is not very legible, you're making it

harder for yourself to get clients.

So what kind of font should you use?

Well, the main body of your text should be either a serif or a Sans serif font.

So Sarah fonts are the ones with small lines of flourishes

at the end of the letters.

A bit like you normally see on a typewriter.

And these are sometimes thought to be more traditional or formal.

But I think they work really well.

And in fact, I use one on my own website for headings.

Sansera fonts have clean lines and no flourishes.

And they're thought to be more contemporary.

Now, some might say they lack personality, but you know,

that's very much a personal view.

It doesn't really matter.

Both types of fonts are generally readable.

And should be your first choice of font on your website.

Whether you go for Saraf or sansera over the mixer to is

an entirely personal choice.

You can use a fancier font, like a handwritten font for

headings or accents, if you want.

But you use these sparingly.

And even if you do choose a fancy font for that, you use sparingly that I

would choose a one that's easy to read.

So a couple that I quite like are dancing script and Parisien,

they're both handwritten fonts.

And I also like a Matic, which is quite fun and childlike.

And all three of these are free Google fonts too.

You don't need to pay a lot of money to have a more personal font.

Another really common mistake is having faltered.

Too small or too thin.

So small fonts can be difficult to read, especially on smaller

screens like smartphones.

Well, thin fonts can appear blurry or Percy on some screens.

And it's a bit of a shame cause I actually quite like then font, but

we're talking about meta ability here.

And I know these fonts can look good, but if they're harder to read,

there is a significant portion of the population who just won't read it.

And I'm not just talking about the visually impaired or the elderly.

If your target audience includes those over the age of 40.

You need to be very mindful of this.

Our eyesight is just not what it used to be.

Much as we might try and deny it and put all, getting reading

glasses, as long as we can.

You know, significantly before you might need reading glasses,

you're going to have an issue with reading small fonts on screens.

And another factor con.

To consider when it comes to font.

Readability is a spacing between letters and words and the line spacing.

It's spacing is too narrow.

It can be difficult for the eyes to distinguish between

individual letters and words.

And of course it's, the spacing is too loose.

It can make the text look disjointed and hard to follow.

So you want a balance between the two is enough spacing to

make the text easy to read.

But not so much that it looks awkward.

Yes.

I know it's a bit like Goldilocks and the porridge.

But seriously, as a website designer, I spent a lot of time

making sure we have the right fonts.

In the right size.

In the right place, uh, news, the right amount of time.

I know, I'll test out different combinations to see what I think works.

And then I look at these on a mobile too.

Not because I enjoy doing this.

And for the avoidance of doubt, I do not enjoy this part of my job.

But because I know how important it is.

So the sec, second.

Mistake.

I see with regard to me to ability is color contrast.

And I have a real thing about color contrast on a website.

And I remember a couple of years ago, a well-known coach in the UK.

Very proudly revealing her new website.

And so many people, gushing Lee telling her how much they loved it.

And it did look great.

But she used a lot of paleo text on a dark colored background.

And I found it hard to read.

I know she paid a lot of money for her website.

A lot more, more than I charge.

Just saying.

And to be honest, I don't think she got the best result.

Now she did end up having her website redesigned again by another

website designer a few months later.

And it's now so much better.

But in that interim.

Can you probably lost people because of that issue of the color contrast, abusing.

Pale text on a dark background.

I'm not saying you should never do this.

I often build websites with sections, whether it's some white rice tink

on a dark colored background.

And it can be really effective to highlight something.

But like the elaborate font.

You need to use it sparingly.

And the other mistake I see is colored backgrounds with writing

that does not have enough contrast.

So it's harder to make out.

And this is a bigger mistake as it's harder for anybody to read.

And there are checkers that will tell you if the contrast is enough.

So one is using colos.co.

So that's C w O L O R s.co.

And that's a fab website that has lots of things with regards to colors.

Um, and one of which is actually, you can put in two colors that you're

looking to put together and it will tell you what the contrast is like.

So use colos or something similar to check if you're not sure.

The other thing on using colors for fonts is to be really, really careful with this.

I am a massive fan of using gray, um, and a relatively dark shade of gray somewhere

sort of a mid grade to a dark gray.

Black is quite harsh if you're using a white background.

And the contrast is that is often too great for people

to be able to read easily.

Nope.

I see a very pale gray is, is too light, but I've seen people use different colored

fonts, like purple or something like that.

And they're just not easy on the eye either.

So.

Great it's definitely my preferred color of choice for font um you can

get away sometimes with other colors but you've just got to be quite

careful as to which ones you choose and obviously if you're using them

sparingly that is fine but don't use them really for big chunks of text

And while we're on the subject of colors using white space and headings to

break up text will improve readability.

Just like, it's hard to find what you're looking for.

On an untidy desk, it's hard for your audience to find what they're looking

for on a website, but this cluttered.

Don't be afraid to space everything out

Okay, next one is text placing and this is another issue of readability.

I often see, especially on website that have not been professionally

built or built by VA's, et cetera, that don't specialize in website design.

So, what am I talking about?

Well, things like text that on a desktop, goes from one side of the

screen, all the way to the other.

Because if you're viewing on a desktop, you have to scan your eyes too far.

So just try this now, try and look at something where you just have to

move your eyes slightly to the left and then slightly to the right, and

then try and look at something else where you need to move your eyes more.

It's quite nauseating.

If you have to do this repeatedly.

So when I'm building websites, I limit the width of text to 1080 pixels wide.

S I know that's quite precise.

That's what the I can easily read and that certainly best practice.

I'm related to that is the alignment of text.

So centralized text can look really cool.

But again, Too much is not easy as easy to read as either left aligned or right.

Aligned text.

Why.

Well, because your eyes are starting and finishing in a different place each time.

And they don't like that.

Okay.

The next important factor in website design is navigation.

And I know this is readability, but bear with me because I think it is

related very closely to me to ability.

Now I did a whole podcast episode on navigation.

So if you are interested in finding out more than it's only back episode 60,

uh, on just called website navigation.

So go and check that one out.

But clear and concise navigation is really key to making your website user friendly.

So keep your navigation simple.

Posted at the top of the screen.

And use menu labels that are easy to understand.

Basically, you want to make it as easy as possible for your target audience

to find what they're looking for.

This is not a treasure hunt.

We're all busy and we will give up or get distracted if we can't

find what we're looking for easily.

The fifth one is mobile responsiveness.

Now I am shocked.

I'm not easily shocked, but I'm shocked at how many websites are

still not easily readable on a mobile.

You probably encountered some, I encountered one just yesterday.

Um, well, the mobile version is exactly the same as the desktop, but shrunk.

And I mean, this basically for started, it's very dated, but it also makes the

font too small to read on a mobile device.

I mean, come on.

This is 2023.

Mobile and responsive websites have been around for, I don't

know, eight years or so.

And there is literally no excuse for that these days.

So if your website.

Is on a mobile, just a shrunken version of your desktop.

And it's time to upgrade.

Because over half of all websites and now viewed on a mobile.

So you're basically not showing a readable website to half the people

who are checking you out online.

I'll just leave that one with you.

Okay.

The final one is browser compatibility.

So I recently started to use image is in web P format for some

of the websites I was building.

Don't worry.

I'm not going to bore you with technical details.

But basically this is a format that Google prefers, so it will

potentially rank your website higher.

And it gives good quality images with a smaller file size.

That means your website will load quicker.

And a lot of website designers are now using this format of images

because it's basically better.

Except.

One time when I did this, I got a message from a client who didn't

like the website I had designed.

She said I hadn't taken on board, her comments, et cetera.

Oh, I emailed her straight away and we had to see him call.

And what she was seeing on her screen was not the same as I was seeing on mine.

And I completely understood why she was confused.

I didn't take it on board.

Her comments.

And I didn't realize it at the time.

But web P was screwing up her website on her PC.

And I had something similar a few days later, it was another client.

I really did think I was going mad.

So I spoke to a help desk.

I use when I need to, and they were asking how this client was viewing their website.

Which browser.

So that's that Chrome safari, et cetera.

And what version.

So both of these clients, I think we're using an old version of safari.

Which doesn't support web P images.

So of course the help desk, which is full of khaki, people said the solution

was that they needed to update their website browser to the latest version

of safari, which obviously does support this image format because all the

browsers support this image format.

Now.

But this was not the solution.

Because we don't know.

What version of a browser?

My client's target audience might view the website on, we

don't know which browser they be.

Debut it on.

We can't tell everybody.

Oh, I'm sorry, but you actually need the latest version of these different website

browsers in order to view the website.

I mean, come on.

That just doesn't work.

You're not going to go and update your website, browser.

Uh, in order to be a website.

So, what I did was I actually converted all the images back to

JPEG and the problem is now fixed.

And at some point in the future, we can probably be comfortable that almost

everyone is viewing a website on a browser that supports web P, but not yet.

And I guess the point of this long and slightly technical story.

Is basically to make sure that what you are building.

Is it using some things that some people will not be able to be your website on?

Or script their viewing experience.

Okay.

So.

Just to wrap up.

It can be easy to get caught up in the look of your website.

But it's important to remember that real people will be viewing your website.

Real people who want to find out more.

And if they like what they see may become paying clients.

You don't want a website it's frustrating and or difficult for

users to read or find what they need.

Imagine trying to use a website that has tiny font.

Say a dark green font on a paler green background and confusing navigation.

You have to be pretty dedicated to keep going.

And that's not how you want to treat potential clients.

You want to make it as easy as possible for them?

That's the best way to convert them into clients.

So, how can you make sure that your website is user-friendly and readable?

Well, here's my summary of the tips.

So, first of all is an easy to read font, everything except

potentially headings and highlights.

And even then don't choose a font for those, which is Q difficult to read.

Make sure your font is large enough to be easily read.

And the spacing between letters in line supports it.

Use white text on a dark background sparingly.

Checks the color contrast of your text on your background using a color

contrast tool to ensure it's appropriate.

Keep your website, text left or right.

Aligned for most of it.

And don't let it go all the way across the page.

Yes, Claire navigation.

With the menu at the top, that's visible on the desktop.

Ensure your website is easily readable on a mobile.

And finally checks or any new things you try and work on different browsers

and especially older versions, unless you're competent, your audience

will be using the latest version.

And actually you should always check how your website looks on different browsers.

And finally.

Cast your website on real people, ask them to navigate your

website and provide feedback.

And of course, if this all sounds too much like hard work, then use a

professional website designer like me.

And that's it for this week.

I hope you found this episode useful and I will be back in your earbuds next week.