How to Create Websites Built for SEO, Part 3

Here we are with our final post on how to create websites built for SEO. In Part 1 we looked at the role of search optimisation in the design process, before we moved on to the SEO coding basics in Part 2. And today we’re wrapping up our three-part series by focusing on the importance of website performance in search rankings.

That’s right, search engines (Google especially) want you to deliver top performance to the people using their services. Which means performance comes with a number of direct ranking factors – making it all the more important you set your clients up with a website built to perform.

SEO topics for today

All of our SEO topics will revolve around website performance today – and that largely comes down to user experience. We’ve touched on this in parts already, so we won’t repeat things like information architecture, which have already been covered. Instead, we’ll be focusing on some of the key issues and talking points that cross over between website performance and SEO:

 

  • Site speed – A direct ranking factor and a major bugbear for users if you get it wrong.
  • Code choices and best practices – These determine the performance of your website.
  • Mobile optimisation – Now a direct ranking factor, but not something to let Google dictate.
  • User experience and engagement – How keeping traffic on a website boosts search ranking and sales.

 

There’s a lot to cover on these points too, so let’s crack on and look at site speed, performance and search optimisation.

How site speed impacts search

The simple answer is website speed is a direct ranking factor in Google’s search algorithm, but it goes deeper than that. Loading times, effective navigation and smooth performance have a knock-on effect with many other ranking signals (there are over 200).

Like many ranking factors, it appears page loading times themselves carry less weight than they used to. Google is much smarter at combining multiple signals now – like page loading times, bounce rates and mobile optimisation – to determine the overall performance of a website.

That said, the symptoms of poor site speed are more severe than ever – both in terms of users and search engines. The mobile web has made us more impatient than ever and search engines have followed suit – so how do you keep your website blazingly fast?

 

  • Code them yourself – Don’t rely on bulky themes or frameworks that come with bloated code.
  • Limit server requests – Don’t overload your projects with multiple CSS or script files. Each one demands an additional server request.
  • Reduce DNS lookups – Every download takes its toll on the browser and loading times.
  • Recommend a Content Delivery Network (CDN) to your clients – If they expect to have users over a large geographical area.
  • Go easy on the images – This is one of the fastest ways to kill site speed. Use sparingly, optimise the ones you do use and take a look at image sprites.
  • Go easy on the web fonts – These typically come with yet another server request.
  • Go easy on the jQuery – This is kind of repeating the script file point, but if you rely on jQuery to supplement your JavaScript skills, this is an easy trap to fall into.
  • Choose your coding approaches carefully – Choose the right language (ie: most efficient) for the right job.
  • Learn your code languages properly – Know the languages you use well enough to create efficient code.
  • Put your code in the right place – CSS at the top, JS at the bottom. Simple.
  • Minify your code – Reduce the size and download times of those essential files.
  • Allow caching – It makes things so much quicker for return visitors. Check out this article if you have doubts about caching.
  • Go mobile-first – Optimise for the slower devices first and build your way up from there.
  • Recommend quality hosting to your clients – Bad servers mean poor site speed and that can give your work a bad name.

 

Okay, I’m not going to pretend that’s a comprehensive list, but if you’re already ticking all of those boxes you probably don’t need me to tell you about optimising for speed.

 

The impact of coding languages and performance

Needless to say, the code behind your websites is the single biggest factor in website performance. Your clients may not be able to see your skills or choice of coding languages, but they’ll see the end result in how well their website stands up to the increasingly strict demands of the modern web and people who use it.

 

The dangers of jQuery

Screenshot 2015-11-12 at 00.23.26

Okay, let’s start with the obvious one as it’s so widely used by developers all over the world. jQuery is JavaScript, but essentially made more accessible to coders without pure technical JS or programming skills.

There are numerous other pros to using jQuery – the time you can save working with it and extensive compatibility. That said, compatibility with web browsers is largely fading out as a major concern. Essentially, it’s the learning curve that pulls developers in.

Unfortunately, jQuery is vulnerable to all kinds of performance issues though. Mostly because it encourages newcomers to write ineffective, bloated and poor quality code. Ths isn’t jQuery’s fault, of course, but a simple truth that you need to know what jQuery is all about and how to handle it with care.

 

The joys and pains of Ajax

Another tempting thing about jQuery is how well it plays with Ajax – and that really is tempting, because Ajax can do all kinds of wonderful stuff. Most commonly, this takes away the need for page reloads for web form submissions, chat room conversations and dynamic content loading.

All this stuff and more creates a richer web and (in theory) makes for a faster experience by reducing server load. Then we have the all-important user experience perks of not taking visitors to another page after they fill out a form or making them wait for the whole page to load – great.

As always, you have to be careful with how you wield your Ajax though. First of all, dynamic content still causes Google some issues (although it’s getting better at crawling JS) and that’s a pretty fundamental SEO problem. But you also have the potential for slow loading times on mobile and multiple HTTP requests that can slow down sites on larger devices too.

There are potential UX question as well – like how can a user bookmark a page when content is dynamically loaded? In terms of performance and SEO specifically, you certainly want to know you’re using Ajax for the right reasons, but also in the right way. And you’ll need to be especially careful if jQuery is your only JavaScript skill.

 

JavaScript pros and cons

Screenshot 2015-11-12 at 00.27.14

JavaScript has been loved and hated by programmers of all kinds throughout its 20-year life. The reason it’s still going strong today (stronger than ever, in fact) is because it’s a truly dynamic and powerful language.

It’s not without its criticism though – namely speed, dynamic typing, odd quirks in the system and even some security concerns.

In terms of performance though, the main concern is overloading the browser with too many tasks. It’s hard to fault JavaScript when it comes to dynamically enhancing websites and apps (just look at how many libraries are based on it), but overuse is something you want to avoid.

In the wise words of Chris Coyier, “you know you should use JavaScript when the task cannot be accomplished with any other technology”.

 

PHP vs Python vs Ruby

Screenshot 2015-11-12 at 00.28.24

On the server side of things, you’ll hear three coding languages constantly weighed up. PHP, Python and Ruby are three of the most lucrative coding languages for creating dynamic web pages and applications.

In terms of website performance and SEO, there isn’t too much between them – although Ruby’s difficult learning curve can make you more susceptible to mistakes and dodgy code.

On the flip-side of things, PHP is widely used and easy to learn, but it’s complex syntax can also lead to mistakes – often hard to spot ones at that. Meanwhile, Python’s super clean syntax makes it a pleasure to work with in this regard.

The choice largely comes down to preference on this one.

 

Choose your languages and learn them

If you’re interested in website performance, search presence and the general well-being of your clients’ websites the key thing is to learn your coding languages properly. There’s nothing wrong with using jQuery and Ajax, for example, if you put them to good clean use.

The problems start when you use jQuery and other libraries as a shortcut to coding up full websites, without really knowing what you’re doing.

 

Mobile optimisation and search

Back in April ‘mobile-friendly’ became a ranking factor in Google’s search algorithm, after much hype and build-up. ‘Mobilegeddon’ was the headline dominating tech talk and the major news channels were all chipping in.

While the initial impact was underwhelming (to say the least) sites deemed mobile-friendly by Google saw better rankings from mobile searches once the update fully rolled out.

But what does Google consider mobile-friendly anyway? Because I’ve seen some awfully optimised sites get the ‘mobile-friendly’ tag in Google SERPs.

The truth is it doesn’t particularly matter, because Google clearly isn’t all that fussy (at least not yet) about mobile optimisation. You can’t say the same for users though, and these are the priority after all. Besides, a poorly optimised site could trigger all sorts of bad SEO signals in Google’s algorithm, besides the mobile-friendly factor.

 

User experience and engagement

The reason one SEO factor like mobile optimisation can trigger so many other signals is because of user reaction. We know Google doesn’t like crappy content, for example, but users hate it even more and that means negative SEO points as soon as they hit the back button.

Google measures engagement by the time spent on a site, social signals, the number of pages visited and a range of other engagement factors to help determine the value of a website and its content.

So if your user experience is sending traffic the wrong way, you’re not giving Google or other search engines much reason to give your clients the kind of search presence they need to maintain a profitable business.

 

So that’s it for our series on how to create websites built for SEO. Hopefully, that puts the role of design, development and marketing into a clearer perspective – because the lines between each of them become more blurred every year. Which means more demand from your clients, but also more opportunity to set yourself apart as a designer or developer who hands over projects built to get results.