LATESTNEWS

Website Optimisation for a better user experience and better search engine rankings

Oct 26, 2017

This isn’t going to be a full comprehensive list of the do’s and don’ts of search engine optimisation, or SEO, but I am going to talk (or write) about some of the website optimisation I carry out and some of the tools available from Google, Microsoft and other vendors that are available to help you. If nothing else you will get an idea of what goes into making your website a bit faster and more SEO friendly.

Lots of people focus on SEO to improve their page ranking, that is after all what SEO is kind of about, but, how many consider their users and the experience they have using their site? I mean it is great to be listed highly on search engines like Google and Bing but if users find your site confusing, slow or unusable with poor content you won’t build the userbase you are looking for and potential customers may never return to your site, so it’s important to think of the user and their experience because optimising your site for a better user experience will in turn make for better search engine results.

Optimise what?

There are hundreds or thousands of factors that influence your page ranking, but you should definitely consider the following for your site:

  • Well designed and easy to use interface (this is a big topic that I will address in greater detail in another post)
  • Mobile compatible website, responsive or adaptive… Google prefers responsive
  • Fast loading of pages
  • Secure site via SSL
  • Backlinks
  • Content
  • Content
  • Content
  • Well designed UI

    The design of a website is important, your users should be able to quickly learn how to use your site with little to no instruction. They should be able to easily navigate from page to page, find call to action buttons such as ADD TO BASKET or CONTACT US NOW without having to hunt for them. Overall a user should ,in my opinion, have an enjoyable experience on your website, there should be a reason for them to return, whether that is because your content is excellent and interesting to them, or because you are providing them with a way to purchase items that they desire, so make it easy for them to access that content and buy those items.

    Here are two author websites, the first is Suzanne Collins, author of many books including the hunger games series. Her website has easy to find links at the top right to navigate some areas of her site but she misses out on opportunities to pull the user in through interactivity. When you click on book covers nothing happens, there are links to places that sell her book, but when you click them they take you to the main website rather than the page with her book on it. (Visit http://www.suzannecollinsbooks.com/)

    The second example is Dan Brown’s website, author of many books including the Davinci Code. This site is easy to navigate, very interactive and engaging and links to purchase his books take to his books. You can find everything you want on the site relatively easily. (Visit http://www.danbrown.com/)

    Now the look of a website is down to personal preference, some people may like a more minimalist look while other enjoy having content stuffed into all areas, but one of the big differences between these two websites is that Suzzane’s site is not mobile friendly… although I don’t think she really depends on her website to make her money is probably more focused on writing her next record breaking novel.

    Dan Brown and Suzanne Collin’s Mobile Websites

    Mobile Compatible

    Your website needs to be mobile compatible, whether that’s achieved with a responsive website or an adaptive website you should have one… although google favours RWD over AWD.

    Eh? What’s the difference?

    A quick way to describe the differences here are to think of RWD and AWD like this:

    • Responsive web design uses one design across all devices, that design is told to resize and move elements to different areas of the viewing area depending on the screen size to make the website more user friendly on different devices.
    • Adaptive web design has the same end goal but uses multiple designs, one for each screen size. The website detects which device size you are using and delivers the correct design to your device.

    Responsive vs Adaptive

    Website speed is another important factor

    your site should load in a few seconds, if your site is taking 10, 15, 20+ seconds to load this could be a problem as users have very, VERY short attention spans.

    Website Speed

    To achieve a fast loading site you need to look at the amount of content on your page and slim down the heavy items. I don’t mean remove content, but streamline it. For example images, if you have images on you site, which I’m sure you do, the images should be the correct size, there is no reason in putting a huge picture onto a web page when it is only going to display in a small size. I always ensure that images are between 72dpi and 96dpi for use on screen as there is little point in going above this, (unless your website is in the business of delivering huge images then you’ll know what size you want them to be). I also aim to have images on a web page below 300kb in size, this can be easily achieved using Photoshop, which is paid for, or Gimp, which is free. Both of these pieces of software have a SAVE FOR WEB option that lets you very quickly optimise an image.

    Photoshop Save For Web Option

    Have a look at both of these images. You’ll see little to no difference in the quality, yet… the one on the left has a file size of 6.3 MB the one on the right is 175.1kb that a saving of over 6MB!

    Comparing Spiderman Images

    I created two pages on this website to test the load speeds, the pages are SPIDERMAN1 and SPIDERMAN2. You can see here the difference in page loading time, the large image takes 3.9 seconds to load compared to 2.3 seconds of the optimised image, that’s on a 50-70mb fibre optic broadband connection.

    Comparing website load speeds

    For a 3g connection you’re looking at 9 seconds for the original image and 6 seconds for the optimised one.

    Comparing mobile website load speeds

    These numbers might not seem huge but that is just one image, imagine if you had half a dozen oversized images dragging your site down… just imagine!

    Combine and minify your code

    Another area that can be streamlined is within code that styles your site and makes the cool things happen, like image pop ups and those bits that look swooshy. When your computer requests a website from a server it has to get those packets of information delivered and read down each line of code, rather than making your computer request multiple Javascript files you could try combining them into one, the same applies to style sheets, there is no point in having ten style sheets if you could have two. You can also do something called ‘minifying’ this takes all the lines of code from a script or style sheet and moves it all to one line, saving hundredths of a second in the time that the website takes to load. This coupled with GZIP on a server will help to increase the speed of your site. Have a word with your host to see if they use gzip or similar, it’s usually pretty quick to implement.

    Comparing minified code

    Website caching

    Another really effective way to increase your website speed is to enable website caching. Caching is a complex process, but one analogy, adapted from and article by Daniel Pataki, is this, what is 6 multiplied by 6? 36. 5 X 5? 25. Now you didn’t need to work those complex sums out because you’ve done them hundreds, probably thousands of times before and you remember them. That’s kind of how caching works.(Thanks Daniel Pataki)

    The first time a web page is visited the users computer or mobile device requests that website and the server will deliver the code, the layout, the styles, the swooshes and build the page, it then delivers an HTML page to your browser so you can watch your favourite super hero short film, do some shopping or catch up on what’s happening in the world of garden sheds (that’s a real thing and the site is quite interesting, see for yourself at www.shedblog.co.uk. If caching is turned on the server already has a ‘remembered’ version of the page ready and sends it straight away, so that every other visitor has a faster experience.

    Caching your website

    If you add new content to your site then the server would, if configured correctly, flush away the old cached versions and build a new one with the new content, or you can manually clear the cache.

    Caching is a great way of speeding up all websites, but can be particularly helpful if you run a database driven, dynamic website that requires the server to deliver lots of content from different areas, such as a WordPress website. There are lots of plugins, I have found the ‘WP Fastest Cache’ plug-in to be really good, (always do your due diligence before installing plug-ins as version changes are frequent.), it allows you to easily enable caching options in a WordPress site and the speed difference is really, really noticeable.

    WordPress Fastest Cache Plug-in

    Secure your site

    Google actually rewards websites with an SSL installed over a non SSL site. An SSL is a Secure Socket Layer, standard security technology that establishes an encrypted link between your web browser and the server delivering the web app. It ensures that all data passed between you and the server remains private. Check the web address to see if a site has an SSL, the domain will start HTTPS rather than HTTP, and having that S at the end will help your SEO efforts. You can purchase an SSL certificate from a number of vendors, some hosting providers supply them with your hosting.

    HTTPS SSL Get Secure

    Having an SSL installed doesn’t just help with SEO but gives users a better, safer experience on your site, it lets people know that their machine is talking to the server it is supposed to be talking to, it prevents tampering from third parties stopping man-in-the-middle attacks and encrypts all communications, including url’s, protecting credit card information and messages sent, it gives your user a more secure site, and gives you a better reputation.

    XML Sitemaps

    Something simple that can be of great use in the search for better SEO is the use of an xml sitemap. This is a really simple file that outlines the pages of your website and allows search engines to quickly view your site. XML sitemaps look something like this

    <loc>https://www.yourdomainname.com/</loc>
    <changefreq>weekly</changefreq>
    <priority>1.00</priority>
    </url>
    

    This tells the search engine the URL of the page, the priority of this page over others on the website and how often the content of the page changes. You create one of these for each page of your site, which can be time consuming so you can use something like xml-sitemaps.com to create the sitemap in a few seconds/minutes depending on the size of your site. You then save that as sitemap.xml and upload it to the public_html folder on your server.

    Some systems have site map generators built in, like the eommerce platform Opencart, which generates a feed of products, or Drupal which has an xml-sitemap modul, WordPress has multiple plug-ins available, and I would assume all other CMS systems have something in place to take care of this for you.

    Backlinks

    Having other websites link to your articles or page content is great for SEO, but only when those backlinks come from reputable sources. Diversity is good too, so getting a link from different types of reputable, established websites helps. How do you get good backlinks? The best way to get good quality links to your site from other reputable sites is to create great content. If you can provide content that others find interesting, entertaining or educational they may think it’s going to be useful to their audience, creating a linkback to you from an article or page.

    Backlinking from reputable sources is good

    The best for SEO? Great content, because content is king!

    Having good, readable, relevant content is going to be the best thing you can do for your website. Long gone are the days of keyword stuffing, content and articles should read in a natural language. You want people who are interested in what you are doing to visit your site and the way to get them is to give them a reason to visit, in depth examination of one topic in easy-to-understand language will always win over articles or information pages that are stuffed full of unreadable keyword dense rubbish.

    Content is King

    I really can’t stress enough the importance of good, readable content, it might be worth doing an audit of your own site just to check what content you have, how it can be improved, if it is relevant... And once you have it up to scratch remember to share your content with the world, post links to articles you have written on Facebook, share those images on Instagram, Pin your products to a board called “THINGS YOU CAN’T LIVE WITHOUT" on your Pintrest page and tell the world that you have that they want. Because although Google, and Bing, are renowned as THE search engines, people also use social media to search for things they want or to find out more about a person or a business and even to search for products, yes that’s right many social media sites have their own search engines, try searching Facebook for ‘Pink Footbal Boots’ and you’ll find items under different categories like:

    • Marketplace
    • Photos
    • Links
    • Posts from groups
    • Public posts

    Facebook Search Function

    It’s interesting how advanced the search functions are becoming within social media sites, but that’s for another article.

    Tools, glorious tools, and these ones are free…

    Website analyser

    You can check your SEO scores and get some pointers on what needs to be improved using free and paid for tools. I use a few different tools for SEO analysis one of which is gtmetrix.com. By simply typing in your domain name you can get a rundown of the page telling you what is and isn’t working, with tips on what you need to do to fix any issues. These are just guides to help you improve your website performance and can take a bit of time, but they are definitely worth doing. If you find it overwhelming there are people you can hire to help, (contact me), but at least this way you have an idea of some of the things involved in improving site performance.

    Tools from Google… and Bing…

    There are lots of tools available from Google and Bing, most of them free, all of them helpful. Here’s a bit of info on a few of them.

    Mobile Speed Test

    If you only ever access your website on your desktop which is connected to your router via a network cable then you may think your site is running super-fast, but don’t forget about your mobile users as they are on the rise, and overtaking desktop users. A quick and easy way to test your website performance on a 3G mobile connection is to test your site with Google at testmysite.withgoogle.com

    This free tool allows you to check your site speed, compare the results to the industry standards and get a full report on what to do to improve your site.

    Google Analytics

    analytics.google.com

    Google analytics is a very powerful tool, with a ton of options and statistics, and it allows you to see lots and lots of information, some of which includes:

    • How many times your website has been viewed
    • Where the visitors have come from
    • How they got to your site
    • How long they spent on your site
    • If they have returned
    • And a lot more, and all without revealing any personally identifiable information about them.

    The above list does not even start to scratch the surface of what you can do with Google analytics, but you can use all of the information in analytics to work on page content and social media strategies, work out what is and isn’t working on your site and get your site working better for you.

    Google Webmaster Tools

    google.com/webmasters

    Google’s webmaster tools allows you to submit your site to Googles search engine for crawling and indexing, it checks for errors on your site, looks for security issues, allows you to highlight different types of content across your pages, submit sitemaps, view search traffic, see how people found your site, what keywords they were searching, see all the websites that link to you… and so much more….

    Bing Webmaster Tools

    bing.com/toolbox/webmaster

    Much like Google’s webmaster tools Bing offers something similar, incorporating SEO tools and analytics all in one place. I personally use Both Google and Bing tools, submitting to both ensures you are making the most of all the largest search engines as after Google Bing is, I believe, the second largest search provider. Bing is also responsible for serving Yahoo’s results, so you shouldn’t write them off as many Microsoft products, unjustly, are.

    Annnnnnd that’s it, if you have any questions I’ll try to answer them, but if you take nothing else away from this article, just remember… CONTENT IS KING!

    Thanks

    Content is King

    References