Anthony Mcloughlin

Most days browsing the web I come across new startups. From the brand new to the nearly IPO level beasts, they often do a great job of enticing me. Sleek and bleeding-edge website designs, oddball names and promises of greatness are often the catalysts for making me take notice.

But being of the SEO persuasion I can’t help myself from digging deeper into their websites, in the hope I’ll find an error – however small. I don’t do this out of spite, to be nosey or any other sinister reason for that matter, it’s just that a large portion of the clients I work with are often this type of demographic – about to embark on a digital journey for the very first time. So, naturally, I feel obliged to hunt down flaws and offer advice/recommendations for improvement.

A small (or large – as the case may be) oversight could be the difference between losing support from an angel investor or missing out on a large number of signups – what a shame it would be to spend all that time brainstorming, prototyping, trying and testing to fall down at the first, and most important, hurdle.

Most of the oversights I stumble across root out, can (and should) be prevented prelaunch using a “staging site“. In a nutshell, a staging site is used to assemble, test and review your website in a test environment that mirrors that of the live environment. The end goal is to get the staging site looking and working as perfectly as intended so that when you switch live there are no “embarrassing” or “disastrous” errors to rectify.

imac temporarily out of service website

In this post I’ll take you through 12 actionable tips to help iron out any creases in your own startup website prior to launch. These tips can also be applied to websites which are already live, so please do read on to see if there is anything you may have missed during your own launch process.

1. Set the preferred version of your domain name (www or non-www)

Setting up your domain name is one of the first things you will do, and it seems so straightforward. But, it can cause problems if not done correctly.

Potential problems

People and search engines can access your site via the www and non-www version (http://www.yourdomain.com and http://yourdomain.com). Links can point to either version also. If you don’t set a preferred version then the search engines may treat each version of the domain as separate references to separate pages. This can potentially cause duplicate content issues and result in links to the “wrong” URLs – resulting in them failing to be credited to your site correctly.

How to fix this

You need to choose one of the two options as your preferred destination by implementing a 301 redirect to send visitors (and search engines) from the non-preferred URL, to your preferred URL. This will be unnoticeable to the visitor; all that will happen is that the URL address they enter in their browser’s address bar will change.

This guide will talk you through how to 301 redirect www to non-www and vice-versa for Apache servers. If your site is hosted on a Windows server I recommend chatting with your webmaster/developer as it will require access to IIS for some of the more advanced functions.

Note: Google’s Webmaster Tools allows you to  set a preferred domain which will prevent any aforementioned issues with Google. However, a 301 redirect is still needed to redirect your website visitors, other search engines and links that are pointing to the non-preferred version to your preferred version.

2. Apply canonical tags to stop canonicalisation/duplicate content issues

It’s not uncommon to have multiple versions of one page containing the same or nearly identical content. A canonical tag indicates to a search engine the preferred page to use in it’s index. Common examples of this are:

Tracking URLs – Where a tracking code is appended to the end of a URL (e.g. http://www.yourdomain.com/free-ebook?utm_campaign=free-ebook&utm_source=email)

Printer-friendly pages – A page variation that’s formatted for printing

eCommerce websites – Where sorting, filtering and functional parameters are automatically appended to the end of category URLs (see example below).

duplicate url example for category page

Image source: Moz

Potential problems

Firstly, the search engines have to decide which version of the page to treat as the original – this is the page they will return in the SERPs (Search Engine Results Pages). Leaving this decision up to the search engines may result in the wrong page being returned. Secondly, links that are intended to go to the same page get split up among the multiple URL variations. Any strength that these links pass on will not be received by the intended page and therefore will have reduced ranking power.

How to fix this

Mark up the canonical page (preferred page) and any other variants with a rel=”canonical” tag in the <head> section. Using the blue widget example from the image above, you would insert the following mark up in the <head> section.

<link rel=”canonical” href=”http:://www.widgets.com/blue-widgets” />

When the search engines crawl the filtered page (?color=blue), they will now know to treat the category page (/blue-widgets) as the preferred page. Any links pointing to the filtered page will now be treated as though they are linking to the category page.

Time saving tip: If you’re using WordPress, the excellent Yoast SEO Plugin can handle these for you automatically.

Recommended reading: Use canonical URLSs (Google)  | Canonicalization (Moz)

3. Perform a thorough content audit

In my time (speaking like a true SEO veteran) I’ve spotted a whole host of content oversights: lorem ipsum text, missing content, duplicated content, spelling/grammatical errors, broken images, the list goes on. You can’t help but feel embarrassed for the website developers and feel sorry for the website owners.

Potential problems

From a users point of view, such sloppy errors look lazy and can be the defining factor between getting in touch and not. From a search engine point of view, low quality, thin and/or duplicate content can result in low search engine rankings.

How to fix this

Prior to launch, save your startup the embarrassment by thoroughly checking every page of your website for the following.

  • Placeholder text (i.e. lorem ipsum)
  • Missing content
  • Sufficient content
  • Duplicate content in the main body
  • Spelling and grammar
  • Paragraphs, headers and other formatting
  • Broken images/videos
  • Image/video resolutions
  • Broken links and hash links (commonly used by web developers as link placeholders)

Time saving tips: If your website has a search function, search for “lorem” and this will bring up any pages that contain lorem ipsum text.

For broken links use Screaming Frog as this can quickly identify them and save you time having to trawl through every page. Note that for Screaming Frog to crawl a staging site that has a robots.txt in place instructing search engines not to crawl the site, you will need the paid version (£99/year). Well worth the investment as it can be used for a whole host of other SEO tasks. The free version can crawl up to 500 pages on a live site with no robots.txt in place.

Recommended reading: Thin & Duplicate Content: eCommerce SEO (inflow) | Prepare for Panda: How to Destroy ALL Your Duplicate Content ( Vertical Measures)

4. Get your site SEO ready

In order for your startup website to be visible on Google (and other search engines) by your target audience, it’s critical that your website is optimised for the right keywords.

Potential problems

Launching a startup website that isn’t optimised for search will result in low search engine rankings. Sites that rank lower receive less search engine traffic, which ultimately means less potential for generating leads and sales.

How to fix this

Optimising a website should only be done by somebody experienced in SEO, otherwise you will probably do more harm than good. So, either hire an SEO professional internally or hire an agency who can show you examples of past work and are able to provide references. Steer agencies that show any of these warning signs.

The most important elements to optimise are:

  • Content – The actual words on a page are of utmost importance, both from an SEO perspective and a conversion perspective. On average, high quality, relevant content ranks better and case studies have shown that improvements in website copy can increase conversions.  Check this extensive list of awesome resources on how to write compelling website copy.
  • Title elements – The title element (AKA title tag) of a page helps to inform users and search engines the topic of a page. They appear in browser tabs and more importantly, in the SERPs. Leaving your homepage title element as “Home” is about as useful as leaving the roof off your house. Considered the second most important on page SEO ranking factor, title elements should include your target keyword(s) and your business name. Use the title emulator tool by Moz to find the optimal title length.
  • URLs – Your URLs should follow the category hierarchy of your website, be readable by human beings and include your target keyword(s) (e.g. http://www.yourdomain.com/used-vehicles/skoda/). Follow these URL best practices by SEO legend Rand Fishkin and your site’s URLs will be in perfect shape.
  • <h1>Heading 1’s</h1> – The first and main heading of a page (the page title) should be marked up as a <h1>. It’s importance for SEO has been well debated but it’s still advisable to include your target keyword(s). After all, your target keyword helps indicate what the topic of a page is about.
  • Meta-descriptions – These are displayed in the SERPs to preview snippets of a given page. If left blank, the search engines will automatically pull in what they feel is the best short description of a page, usually the first words on a page which isn’t always what you want. Whilst they are optional and have no impact on search engine rankings, it’s a great opportunity to write 160 words of advertising copy to help increase your SERP click through rate, which does have an impact on search engine rankings!
  • Internal links – “The number of internal links pointing to a page is a signal to search engines about the relative importance of that page”, Google. Straight from the horses mouth, you should make an effort to add internal links. Follow this best practice guide on how to do this correctly.
  • Image ALT attributes – Also commonly known as the “alt tag”, they enable you to describe images for the search engines and for users with visual and certain cognitive disabilities. Below is an illustration of how we see images on a page compared to search engines.
skoda fabia image alt attribute example

As you can see, the search engines can only see the code which includes the alt attribute description. Get into the habit of filling these in when you upload images to your site, otherwise it can be a time consuming pain back-tracking through hundreds of images. Follow these guidelines from Google on how best to describe images.

Time saving tips: If you use WordPress, the SEO by Yoast plugin makes it super easy to implement and edit SEO globally and at page level.

Use Screaming Frog to quickly fetch on page SEO elements (title elements, H1’s, character lengths etc.). This data can then be exported to excel so you can easily identify pages that need your attention.

Recommended reading: More than Keywords: 7 Concepts of Advanced On-Page SEO (Moz)

5. Optimise for speed

Page speed, AKA “page load time” can be described in simple terms as ‘the time it takes to fully display the content of a web page’. Google introduced page speed as a ranking factor back in 2010 so it’s nothing new, yet often overlooked.

Potential problems

Slower pages tend to have higher bounce rates and less average time spent on page – both tell tale signs of poor user experience. Research has shown that slower sites experience lower search engine rankings and generate less conversions.

wallmart sitespeed effect on conversions

Recently Google have been seen testing a red coloured “Slow” label in the search results that will warn searchers before they click over to your web site.

google-mobile-slow-label

If this test eventually goes live then sites labelled as “slow” can undoubtedly expect to see lower click through rates.

The bottom line is, people prefer fast websites, and fast websites rank higher and convert better.

How to fix this

There are many things you can do to optimise your website for speed prior to launch. The best place to start is by running your important web pages (starting with your homepage) through the Google PageSpeed insights test. This will analyse your web page and make suggestions on how to make the page faster. The test may throw quite a few suggestions up but don’t be overwhelmed, focus on the following to achieve the biggest reductions in page load time:

  • Optimise images (crop, resize and compress)
  • Minify CSS, Javascript, and HTML
  • GZIP Compression
  • Static page caching (e.g. ZenCache for WordPress)
  • Leverage browser caching
  • Use a Content Distribution Network (CDN) (e.g. CloudFlareFastly)

Your PageSpeed insights results will have links to resources on how to action the above.

Time saving tip: Use Tinypng to compress your .png and .jpg files. We use it regularly here and often see reductions in file size of up to 75% – without any loss in quality!

Recommended reading: 10 Ways to Speed Up Your Website – and Improve Conversion by 7% (CrazyEgg)

6. Implement schema markup & social meta tags

Schema markup is HTML code that you put on your website to help the search engines better understand your page so that they can return more informative results for search users. Social meta tags are helpful strings of code that pull important information from content (title, url, description, image etc…) and display this information when the piece of content is shared on social networks.

Potential problems

Let’s say you regularly host events. You can mark up your events schedule page so that the search engines can display important information about your events in the SERPs. Below is an example of a website taking advantage of the event mark up when I search for “small business events”

events schema markup example

If this site had no schema markup in place, then the extra information about their up and coming events wouldn’t be displayed which is significantly less helpful for users and less attractive to click.

Have you ever shared a piece of content to one of your social networks and it doesn’t quite look right? Well this is probably due to the site not having the appropriate social meta tags in place. Below is an example of two pieces of content shared on Facebook; one without Facebook’s OpenGraph meta tags and one with. Which would you be more likely to click?

facebook open graph examples

How to fix this

To implement schema mark up on your website follow this guide by Neil Patel and for social meta tags follow this guide by Cyrus Shephard. Your webmaster/developer will be able to implement the codes for you.

Time saving tip: If your CMS is WordPress then the previously mentioned SEO by Yoast plugin can take care of the social meta tag markup for you.

7. Cross browser & Cross device QA

Cross-browser and cross device QA is the process of reviewing website functionality across multiple browser platforms, operating systems, and mobile devices to uncover any potential discrepancies. In other words, making sure your site looks and works as intended on all browsers, operating systems and mobile devices.

Potential problems

I don’t think it’s necessary to get into any technical jargon here but a dysfunctional or oddball looking website will only serve to frustrate users and more than likely, force them to leave and jump ship to a competitor’s website.  Here are some striking stats about mobile users:

  • 61% of users are unlikely to return to a mobile site they had trouble with (Google)
  • 40% said they’d visit a competitor’s mobile site instead
  • 55% would give up caffeine to keep their phone, 63% would be willing to give up chocolate, and 70% would be willing to forego alcohol (Telenav)

In addition to those stats, you may have heard recently that Google are to bring mobile-friendly factors to search rankings on April 21st 2015. We had a feeling this was coming a long while, especially since they started displaying “mobile-friendly” labels in the search results (see image below), not to mention the provision of the mobile-friendly test tool and the mobile usability tool in Webmaster Tools.

used skoda fabia

The bottom line is, a poor user experience will cost you leads and sales.

How to fix this

Your web developer should have already tested your staging site before passing to the final QA which is usually handled by the project manager if there are no specific QA teams involved. However, I think it’s good knowledge for you to have an idea of our QA process so you can cross reference this with your team’s process, and perhaps, go through the process yourself.

We handle QA in three phases:

Phase 1 – Desktop in Chrome: What we tend to do here at Tone is kill the first two birds with one stone. So we first test a website using our default, every day setup: in our case, that would be the Chrome browser in Desktop screen size. This is our default setting for browsing, developing and deploying, so it makes perfect sense to do your QA checks in this format first. If your default is FireFox then do that first.

You might think that phase 1 would be relatively short due to it being just one screen size in just one browser – but you’d be wrong. This is the first time the site is exposed to detailed scrutiny and sustained stress testing, so a lot of time should be spent during phase 1. After all, you’re not just testing browser compatibility in this phase, you’re also ensuring that the site functions as intended, that there are no technical loopholes in development and ensuring that client expectations are met all at the same time – meticulously.

Some of the main elements to check and test are:

  • Contact, registration and download forms (email confirmation tests are best handled by your webmaster/developer)
  • Drop down styling
  • Sliders and CSS3 transitions
  • Are the images and icons retina ready (check with your developer)
  • Continually cross reference the staging site with the signed off designs

Once this is done and the first phase of QA is taken care of, you will have a working, fully functional site in conjunction with the agreed specification, that is, in your default setup at least.

Phase 2 – Desktop in all other supported browsers: This phase centres around ensuring that the perfect default setup model is cascaded through to the other browsers in the same way. The majority of modern browsers will render things in a similar way, so it’s often only a few styling issues that need resolving or some minor browser targeting to ensure everything renders the same cross-browser.

Phase 3 – Responsive QA: The final phase is testing in tablet and mobile screen resolutions. The trick here is not to rely on reducing the browser window or browser emulation tools. You need either the actual device to test in or test using online tools that hook into the actual tools, such as BrowserStack, VirtualBox and VM Ware.

Below is our internal cross browser & cross device QA checklist. You can download a printer friendly version by clicking here.

cross browser cross device QA checklist

Time saving tip: Another option is to simply hire a professional QA team. This approach is very good for finding things that internally may have been overlooked. I mean, if you’re looking at the site every day, it’s easy to look past the minor things in favour of fixing the technical elements, however a fresh pair of eyes on the project may find those minor things.

Recommended QA companies: Bug Huntress | Qualitest | Crowdsourced Testing

8. Secure your site

After all the hard work you’ve put in to your new shiny startup website, the last thing you want is a malware attack once it’s live.

Potential problems

Malware is the the umbrella term used to refer to a variety of intrusive software, including computer viruses, worms, trojan horses, ransomware, spyware, adware and other malicious programs (Wikipedia). Once malware has infected a website it can then be used to spread the aforementioned programs to visitors’ computers for a variety of purposes, such as stealing personal or financial data and hijacking computers.

You’ve probably seen a similar image to the one below before. Scary right?

malware warning google chrome

This warning prevents people from visiting infected websites and in the process, tarnishes reputations.

How to fix this

Check with your hosting company to see whether security protection is bundled in to their standard service or if it can be added on. This should take care of your firewall and anti-virus protection for your server.

To protect your site even further, make sure the following measures are taken:

  • Strong password policy – Don’t use obvious passwords like “firstname123”. Instead, use a password generator to create strong and secure passwords. Save the passwords using a secure tool like KeePass which can be used by all of your internal team by ‘syncing’ data instead of saving.
  • Regularly update your CMS & plugins – Out of date CMS’s and plugins are extremely vulnerable to malware attacks. These can normally be updated within your CMS, but always check with your webmaster/developer first before updating as sometimes they can break certain functionalities of websites.
  • Move your login URL – There are plugins for most CMS’s to move the login URL. This makes it harder for attackers to find the login page. Alternatively ask you webmaster/developer to do this for you.

Recommended reading: Preventing malware infection (Google)

9. Install the Google Anlaytics web tracking code

Analytical data is invaluable from day one as it allows you to better understand your website visitors so you can make better informed decisions about what areas need improving upon.

Potential problems

Depending on how much of a data nerd you are, it could be days, even weeks until you realise your web tracking code is missing or not working. You’d have no idea how effective or ineffective your social media or PR campaigns were and no idea what sources are contributing to your conversions (i.e. contact forms, eBook downloads, sign ups, eCommerce sales etc.).

How to fix this

Setup a Universal Analytics property by following these steps (Remember to use your actual domain URL and not your stage site URL). Once setup, pass the tracking code on to your webmaster/web developer who can then implement the code on your site. Alternatively, if you use WordPress, the Google Analytics by Yoast plugin can do it for you.

To check if the code is installed prelaunch, navigate to any page on your stage site, right click and “View page source”. Press CTRL+F to bring up the “Find dialogue” box and search for “GoogleAnalytics”. You should see your Google Analytics code like the one below:

(function(i,s,o,g,r,a,m){i[‘GoogleAnalyticsObject’]=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,’script’,’//www.google-analytics.com/analytics.js’,’__gaTracker’);
__gaTracker(‘create’, ‘UA-XXXXXXX-10’, ‘auto’);
__gaTracker(‘set’, ‘forceSSL’, true);
__gaTracker(‘send’,’pageview’);

You’ll also want to have your goal tracking in place prelaunch ready to capture conversion data from day one. Watch this video by Google Analytics on how to do this.

Tip: Prevent your data from being skewed by filtering out your IP address(es) and filtering out known spam referrals.

10. Register with Webmaster Tools

Along with Google Analtycis, Webmaster Tools is one of the most useful tools to have in your arsenal. It provides valuable data, tools and diagnostics to help keep your website healthy.

Potential problems

Webmaster tools provides a whole host of important information about your website’s health – insights you would never have otherwise discovered were you not registered. For example, it lets you know if your site has been infected by malware and if there are any problems with your DNS, server, robots.txt file or URL’s – all critical for a fully functional site.

webmaster tools pages not found

It’s not just important for the health of your website either; since keyword data has significantly diminished from Google Analytics, the search queries report in Webmaster Tools allows you to recuperate some of this lost data along with click through rate and average position. Handy information to help assess your SEO efforts from day one.

How to fix this

Using the email address you use for Google Analytics, sign in to Webmaster Tools and click the red ‘Add a site’ button in the top right hand corner. Enter your website URL and press ‘continue’. Next you will be asked to verify ownership by the default method of uploading a HTML file. An easier way to verify ownership without the need to bother your webmaster/developer is to click the ‘Alternate methods’ tab and select ‘Google Analytics. Click the red ‘Verify’ button and job done! When your site goes live, Webmaster tools will start to collect data and report the data around 48 hours later.

Note: You would ideally register with Webmaster Tools as close to launching as possible (within 24 hours). This is because Google won’t be able to crawl your staging site with a robots.txt in place. If you register long before you go live then expect to see crawl errors within your dashboard.

Recommended reading: How to Use Google Webmaster Tools for SEO (LunaMetrics)

11. Invest in user testing

You’ve been involved at every point of your website project since day one so you know it, inside and out. You understand its purpose and precisely how to navigate it… but that’s just you.

What happens when others attempt to use and navigate your website and things aren’t so obvious with their “new eyes”?

Potential problems

Launching a site that hasn’t had any external “new eyes” test and navigate it is like trying to read minds and likely to result in users “stumbling” over something that you hadn’t previously picked up on. It’s these “stumbles” that could prevent your startup website achieve it’s goals.

usability testing cartoon

Image source: Templatemonster

How to fix this

I strongly recommend investing in user-testing platforms such as UserTesting and Whatusersdo. You decide what you want to test and set tasks for users who meet your demographic criteria to complete. The beauty of using such platforms is that you can watch recordings of users completing the tasks you set whilst expressing their thoughts – invaluable insight! Prices start from around £30 per user test.

Alternatively, if budget doesn’t allow for the above, you could ask a group of friends or family to test and navigate you site. You’ll still unearth some usability issues but just bear in mind that your family and friends aren’t your target audience so their way of doing things could be somewhat different.

Recommended reading: A Complete Guide to User Testing Your Next Project (UserTesting)

AND BLAST OFF! YOUR STARTUP WEBSITE IS READY TO LAUNCH.

space-rocket-blast-off

Hang fire… you can’t pop the champagne or crack the beers open just yet. Put those on ice.

Your job’s not quite finished…

12. Things to immediately do once live

A staging site should have a robots.txt file blocking search engines and other crawlers from the site. Password protected or placed on a sub domain (e.g. yoursitename.tone.co.uk) with a robots.txt file in place, there are certain tasks that can only be performed once your staging site has been transferred to your live environment.

Update your robots.txt file

One of the first things you should do is update your robots.txt file to allow search engines to crawl your site. If your robots.txt file isn’t updated then your site won’t get indexed by Google and other search engines meaning your site can’t be found via the search engines. Check your robots.txt file by navigating to ‘www.yoursitename.co.uk/robots.txt’.

An updated robots.txt file should look like the image on the right.

robots txt disalow and allow search engines example

WordPress users can easily do this by unticking a box in the reading settings. Alternatively follow these instructions by Google.

Submit XML sitemap to Webmaster Tools

An XML sitemap helps Google understand how your site’s content is organised for better crawling and indexation. There’s no point submitting your XML sitemap URL to Webmaster Tools pre-launch because Googlebot won’t be able to crawl a site with a robots.txt blocking it. So, as soon as your site is live, generate an XML sitemap for free, get your webmaster/developer to upload it your domain root folder and finally, copy and paste your sitemap URL ( /sitemap.xml ) to Webmaster Tools. If you use WordPress, the SEO by Yoast plugin can generate a sitemap for you. You just need to copy the sitemap URL ( /sitemap_index.xml ) and paste it into Webmaster Tools.

xml sitemap webmaster tools

Use the fetch & render tool in Webmaster Tools

The fetch and render tools allows you to see how Googlebot renders your page. The tool shows you a visual representation of what Googlebot sees and also identifies errors on what resources Googlebot was unable to access.

fetch & render result tone homepage

Run a few of your pages through this tool to see if Googlebot renders your them properly. Any issues will be reported so you can look to get them fixed.

Crawl your site to check for errors

Hopefully, your transition from staging site to test site will have gone smoothly. However, its worthwhile performing a website crawl using the previously mentioned Screaming Frog. This will highlight any errors with SEO, links, redirects, robots.txt and a whole host of of other technicalities so that you can get them rectified as soon as possible.

Create a backup

Your webmaster/developer should create a backup of your website so that if anything disastrous did happen, you can always roll back to a normal functioning copy of your website. Backups should be created regularly going forward. A minimal viable way to do this would be to choose a hosting provider that guarantees regular backups. Failing that, your web developer should be able to set up a cron job that automatically creates backups.

And that’s it. Job done. You can now crack the champagne open and enjoy a well deserved glass of fizz!

champagne bottles on ice

Image source: © Jorge Royan / http://www.royan.com.ar

A special thanks to the following people from the Moz community for their suggestions…

Linda Vassily | Michael Edwards | Fuel Travel | Dirk Ceuppens | Craig Cooper

Share this post

Was this article useful?

Subscribe to our monthly mailing list to receive more articles like this.

Anthony Mcloughlin

Posted By Anthony Mcloughlin

Anthony is a key member of the digital team at Tone, helping dig deep into stats to further understand user behaviours. Follow him on Twitter @anthony_mac85 and on Google+