You know when you're on a website and something just doesn't feel
right, it feels a little bit niggly and
you start to feel that no matter how great the product or
the service is, that you're just not going to buy from this website
because just something doesn't add up. Over
animating everything. Oh my goodness.
We've all had that experience. Whether that's landing on a
client's website and they've clearly self built and
it's time for a rebuild, or whether we've followed one of those
meta ads and we go on the website and think, oh yeah,
there's no great shakes here. You get about halfway down the page and you think,
oh, this isn't the right one for me. Whatever it is.
There's a consistency in
bad practice amongst the website design community
that I'm going to call out here because honestly, we
can do so much better than this if people don't like it. Haters going to
hate. Make any money from my personal blog. So it's a really nice.
Hi and welcome to another episode of Websites Made
simple with Holly Christie. That's me. I am a website
designer, a website designer mentor and I
am here to help you have a career that you absolutely love.
All without losing your mind or dropping the ball.
You ready? Let's get started.
So today I particularly wanted to tackle
these things I really, really wish we would stop doing on
websites. And by we I mean you, because I stopped doing this a very long
time ago and my website's got a heck of a lot better
for it. So.
Number one, and this be a tricky one
because this could be a client directive but
over animating everything. Oh my
goodness. You know when you're scrolling on a website and the text
appears and then the images fly in and then you have this and then you
have that and then you scroll down the page and something else happens and every
part of the website is animated. First
of all, it's not a good end user experience. Now
I'm sure that you probably know that people report that
it can make them feel a little bit seasick as well. And it
can be a frustrating experience because sometimes people just
want to get to the information. In fact, I recently
did a webinar with Jo Watson who is an
incredible copywriter and we really talked about we
don't need to see the thesis, we need to know, you know, the highlights of
something and how we can buy it. And it's harder
to navigate and get to that if things are
swooping in and flying out. It just, it does not
give a relaxing experience for people. So animate,
occasionally animate small areas.
Like sometimes if I have kind of a container with testimonials drop in,
I might put them together so they're like puzzle pieces, so they drop
in and out into the side and stuff. But it's an animation that happens once
and once on a page as well. So if you do have to animate
stuff, try and go for once per page.
Trust me, the users who are going to be going on that website, they
will thank you for it. If you have a lot of animation on your own
website, turn it off. It is not something
that people think, oh, I love the animation on that. You know,
this is what's going to make me buy from that person. It just doesn't happen.
And a positive side of it is that you will see
your Google page speed scores go up as well, because animation
slows things down.
My second thing I absolutely would love to
see the back of is really funky menus. And
trust me, I am someone who loves experimenting, I love
creating, I love playing around with these things. In fact, when
I did my simply sites, when I first set them up, gosh, nearly four years
ago now, I had really funky menus in them especially. I
had particularly one that was a shop and it had like the
logo kind of in the middle of this header image and it had a menu
that kind of expanded and kind of looked a bit like an ice cream cone.
It was perfection. Every single person who bought that template, and a
lot of people bought it, were like, I can't really get the menu working. People
don't know how to look at this and they can't get back to there or
whatever else. And I went on to do some research and
it was that people and Google and the other
search engines want a menu that is
predictable. This is at the top of the page which
has proper names on them, like home, about
services, contact, that sort of thing,
testimonials, rather than things like praise or good thoughts
or vibes or, you know, whatever people are putting out there. A
traditional header menu will always, always do you
really well on a desktop version of a website and
actually even a tablet version of a website. These days with the
resolution of tablet screens. When we were first designing for tablets,
like a million years ago when they first came out, we would make
the tablet menu very similar to the
mobile menus and that's because the resolution on tablets were quite
low. So it kind of worked better. But now you just get amazing
tablets and they should have that expanded desktop menu as
well, something really traditional. I mean,
people are always going to have a difference of opinion on whether you
have home about services, blah, blah, blah, contact or whether
you have home services, blah, blah, blah, about contact.
For me, I'm quite traditional. I like home and about. And we know
regardless, that people do not navigate websites
in a linear fashion. They don't start particularly in a kind of
country where they read from left to right as well. They don't start with home
on the left and work their way through clicking everything until they get to contact
on the right. You know they're going to jump around. And actually, if you have
a proper link structure, which I'm going to talk about in this episode as well,
it particularly means that people won't be navigating in
a linear fashion as well. Use your
creativity to get creative in other places
and leave that menu at the top of the page.
Speaking of the top of the page, please. I
personally, this is the hill that I will die on. Every
website should have a sticky menu. No exceptions.
There are so many websites out there like that I land
on weekly that you go on the website, the menu looks
great, you scroll down the page, the menu's gone. You get about halfway down the
page and you think, oh, this isn't the right one for me. And you have
to go all the way back up to the top to get the menu. No,
you really, really need to make it sticky. It is a really small
change. It's a massively quick win. It gives a
better user experience and people are going to stay on the website for longer
because of it, because they can easily navigate without having to put
in extra work, extra scroll time of going up
to the top there. I know it sounds like just such a small,
kind of petty thing to really go on about, but it makes a massive
difference in how long people actually stay on your website. So
really do make it something that you go on to do.
So now we come onto the proper link structure and I, I
was so delighted to have Nikki Pilkington, who is an SEO
specialist, on a webinar with me recently. And if you'd like the links
to any of the webinars, do get in touch with me at
helloebsitesmadesimple.co.uk. i will be delighted
to share them with you. And Nikki is a really
big player in the SEO industry and she was talking
about one of the most important things that you can do for
SEO purposes is to have a proper link structure on your website.
And remember, when we look at links. We're looking at linking
text from one page to another. We're looking at buttons. They're
also links. We're looking at your navigation menu, your
sticky navigation menu that's at the top there. Those are also
links. Also, think carefully about
whether you choose to have columns that link
on clicks, whether you choose to have images or videos that take you
somewhere else when you click, or whether you choose to have icons that take you
somewhere else when you click. I am again
going to be quite old school here. I've been in this industry a really long
time and I am going to say for SEO, for
accessibility, for search engines, but for your user experience
on that website, you really need to make sure
that what people click is very, very obvious. I was on a
website the other day, someone had really nicely
laid out icons, you know, a column with an icon in it and then the
content. And you had to click the icon to get
to the content, but it didn't tell you that you had to click the content.
I only knew because I'd hovered over it and then of course, my
cursor changed to tell me to do that. That's really bad for
accessibility. It's really bad for your SEO. It's a really bad
user experience as well. And I know it can feel frustrating to
have to put a button or a link text or something like that,
but if you think how many people go on websites who actually have
issues, maybe with fine motor control or they have
vision issues, something like that. We want to make sure our websites are as
inclusive as possible. Not just because Google would
like that, but because we have a moral responsibility to do so.
So do make sure you have a proper link structure all
across your website and your users will thank you for it.
Google will reward you for it. And you will have a really good,
robust website as well. You're just going to have to check those links regularly
to make sure they all work all of the time as well.
We are all guilty of this one. And I am going to throw my hands
up and say, I am guilty of this too, particularly if I'm on a dev
site. And I will go back and change it and go for consistency.
Just chucking any old image into the website and you think, oh, I'll just
try this here. And you don't label it and you
don't reduce the size of it and you don't compress it, and it might not
even be a relevant image either. And
that's something that I've done myself. And then I have to Quickly
kind of comb through and take out before I send the website live.
And I'll often do it if I am testing
an image or a concept or a design. But of course what happens is I'll
put something in there to test it, and that's going into the database
and the size with the labeling, with everything else it has in
regardless as to whether I go and use it. And I don't want my database
to have a lot of irrelevant images or a lot of really large images.
What can often happen will be that a client will then
say, oh, yeah, that's great. And they sign off that section. You think, oh, brilliant,
I'll move on. That image gets completely forgotten
about. All your website will be webp images and then you'll have a couple of
JPEGs or PNG files that are just hogging all the space there,
just providing that kind of inconsistency there as well. So make sure
that the images that you use, that they're relevant, that they're
the right size, that they're compressed, that they're the same right
format, and that they have been labeled correctly as well.
My final one, and it's a biggie, I'm gonna say that
is inconsistent design. So
we can, as creatives have a tendency
to think, I want to try everything or
this, oh, I read this bit in there about section and it would be so
cool to do this thing here. I've been there.
Luckily, I tend to go there with like my personal blog or
something like that. And I think, well, you know, if. If people don't like
it, haters gonna hate. I don't make any money from my personal blog, so it
doesn't really matter. But when it comes to websites you are
building for people to get work from and in the industry and
stuff, you're gonna want to be really consistent with your design.
I mean, obviously in an ideal world, we all work with
a brand kit as well. So we all have direction of what we're doing
with the design. The brand kit should be more
than just the logo and the hex colors for the brand.
The brand kit should have any icons you're going to use or
suggestions for icons. It should have backgrounds if there's going
to be things like gradient backgrounds and all different things like that.
It should have a mood board in there for the style images
and the vibe and the feel that you're going for. And of course, it should
have the font files as well. So it should be
this really robust document that you work off. And if
you have clients who come or you might have your own
websites and you think, I've done the branding myself, I don't
have a whole brand kit per se. There is nothing stopping
you from creating a brand kit for yourself. And if
your client doesn't have one, it's really good to kind of get
them on a call and just talk them through the concepts of, of some of
this stuff and ask them to put a mood board together as well.
Yeah, they can do that on Pinterest. They can add different kind of
images and colors and blog posts and stuff like that on there.
And it is going to make working on their website so
much easier for you. It's going to give all of you a better experience
as well, because you're all kind of working to the same vibe and it's going
to provide that consistency that can sometimes wander off when we don't
have these kind of really tight, controlled outcomes there as well.
So make sure your design is super consistent as well, because
it's one of the big things that Google, your search engines are
looking for and they're looking for these based on. Yet
they know how people are navigating websites, the websites
people are clicking through, spending time on, the websites people are
buying from, and they know that consistency
is one what gets people staying on websites. And so it's one of their
criteria for SEO is a really good consistent design.
So that's all from me today. Feels like a bit of a grab and pee
episode, actually. It feels a little bit like, ha. These are all the things I
hate people doing on websites. I would love to hear
from you about what you hate people doing on websites as well. What
things really irritate you? I would love to know whether you
agree with the stuff that we've talked about today.
Which one's the one that you agree with the most? For
me, it's always going to be the menus. Always, always make sure if you take
anything away from this podcast, go and make those menus sticky.
And until next time, have a great time in your website career.