In April 2015, Google started rolling out their mobile update which saw mobile friendliness become an especially strong ranking factor that would have significant ranking effects in the mobile search results.
During the rollout of the update hailed as ‘Mobilegeddon’ which started on April 21st, Next had only an app in place that catered for their mobile audience. Since then, they have launched a mobile website.
Although Next now have a mobile website in place, are they effectively serving their mobile website from a user and mobile SEO best practice perspective? This is what we will answer today.
Mobile Website Configuration
Next’s mobile website is built using a separate URL configuration; this is a relatively common setup and essentially involves having a mobile site that is completely separate to their desktop site.
Commonly, a website built using separate URLs detects user-agents; a redirection takes place, sending a user to the appropriate URL equivalent that displays optimised content for the detected device. However, Next’s mobile website doesn’t operate in this way; if a mobile user visits Next’s desktop website they remain there and vice versa.
User Experience
So how does Next’s mobile website fare from a user experience perspective? We’ve conducted checks to identify their current standing with regards to usability.
No interstitials
Interstitials can create a negative experience for users on a mobile website as they are forced to scroll to see the full page they had originally intended to view, and in some cases are required to interact with an interstitial to begin viewing a page.
When visiting Next’s mobile website, you’ll notice that no interstitials are used, which is best practice according to a recent Google study.
Return to Desktop Version
Some users may prefer pinching to zoom as opposed to having to scroll or navigate through pages to find what they’re looking for, as is often the case on a mobile website. It is best practice to allow users to overwrite the page being served to them and return to the desktop equivalent if they wish.
As you can see in the picture above, the Next mobile website does provide users with the option to view the full desktop version of their website.
Navigate to Mobile Site
As well as allowing users to navigate to the desktop equivalent of their website, Next also allow users to actively navigate to their mobile website. This is less commonly seen across websites and was likely added because mobile users are not automatically redirected to the mobile website when they land on Next’s desktop website.
Consistent Design
When serving a user a mobile version of a website – be it dynamically, separately or responsively – you want to ensure that the design is consistent with the desktop equivalent where possible.
Next are consistent with their website design across mobile and desktop. By sticking to a similar design, users are able to navigate through their mobile website in a similar way to how they would do this on the desktop website.
Hamburger Icon
Although used across most mobile websites, the Hamburger Icon (as highlighted below) can cause confusion amongst users. To help your users identify what the graphic means, it is best practice to clearly label the icon, as has been done by Next on their mobile website.
Unplayable Content
Using unsupported content on your website can result in certain types of content being unplayable on mobile, which causes problems for mobile users and affects their experience on the website.
Next do not feature content on their mobile website that cannot be viewed across mobile devices on platforms such as Flash or Quicktime, which is good practice.
Tap Targets
It’s important to allow a sufficient tap target for each link and button on your mobile website, otherwise it will not be considered mobile-friendly – and more importantly, it will greatly affect a user’s ability to navigate around your mobile website.
Next have an almost-perfect user experience score according to Google’s PageSpeed Insight, with only one tap target bringing their user experience score down slightly.
Visibility
So how does Next fare with regards to factors that affect the visibility of their website in the mobile search results?
Mobile Website Sitemap
Sitemaps help search engines find the pages of your website and improve search engine rankings. Next’s mobile website does not currently contain a sitemap (neither HTML nor XML) which means search engines and users have limited information about the site structure or pages.
Robots.txt
The robots.txt file is one of the first places a search engine looks when it visits a site. Next currently have a robots.txt in place. However, it is blocking anything from crawling its mobile website, which is a crucial issue that needs to be resolved.
Meta Data
As Next have a mobile website that’s configured using separate URLs, they’re able to serve metadata on their mobile website that’s different to what’s served on their desktop website.
Next are currently not optimising their metadata for their mobile website, despite this being a basic SEO practice; this may be intentional as their site is currently not being indexed and ranked due to their crawler blocking robots.txt.
Vary HTTP Header
The Vary HTTP header tells a webserver that there is different content to serve to different users, and that when receiving a request for a URL, the webserver should consider the user-agent requesting before serving content.
From an SEO perspective, search engines such as Google may use the Vary HTTP header to aid their discovery, indexation and caching of mobile-optimised content so it’s important this is in place correctly to maximise mobile visibility.
Next currently do not use the Vary HTTP header and therefore they are not correctly informing search engines of mobile page alternatives. Given that they’re using a separate URL configuration, it’s very important to have this in place.
Technical
So how compliant is Next’s mobile website when referring to mobile SEO best practice? Not greatly.
Annotations for Desktop and Mobile URLs
When serving a mobile page on a separate URL to the desktop equivalent, to help Google and search engines alike understand the relationship between both pages, the alternate and canonical annotations need to be added to pages on Next’s mobile and desktop websites.
Rel=”alternate” tag
This tag tells search engines that there is an alternative version to the desktop page; this helps the discovery of your mobile content.
Next do not use this tag and so are missing an opportunity to inform crawlers of mobile page equivalents.
Rel=”canonical” tag
This tag tells search engines that the mobile page is a copy of the specified desktop page, avoiding any duplicate content issues whilst allowing link juice to flow back through to the desktop page. This has been implemented on the Next mobile website.
Viewport
A meta viewport element is typically used when serving a mobile website that’s responsively designed; without a meta viewport implemented, a page is rendered at a desktop screen width. From a user’s perspective, this can create an unpleasant experience on your website as they’re required to manually zoom and scroll horizontally on your pages to view and interact with content.
As can be seen, Next have a viewport in place on their desktop website, which makes their website scale to fit the screen size of the device it is viewed on. This doesn’t provide a positive user experience if their desktop website is viewed on a mobile device as text size is very small and it’s difficult to navigate through pages due to closely spaced links.
This element is mainly useful for tablet users that are viewing Next’s mobile website.
Site Speed
Most people are aware that site speed is now a ranking factor for Google (and other search engines) and users don’t like a slow website, so it’s important that your mobile website performs at optimal speed.
The Next mobile website is very slow. Having used multiple page speed tools, it’s clear the main issues with their mobile website are caused by resources being blocked by robots.txt. This affects how the page is rendered, how browsers are instructed to cache their website and their server response time.
Blocked Resources
By blocking certain resources, you can affect how crawlers render and index your content, which can have a direct impact on your mobile search performance. As Next are currently blocking any crawlers from accessing their website through their robots.txt, they’re creating a big problem with how their mobile website performs.
Redirects
When a mobile user enters your site on a desktop URL, it’s common and best practice to automatically redirect them to the mobile URL equivalent. By ensuring that desktop to mobile redirects are consistent with the URL detailed in the desktop page’s link rel=”alternate” tag (if correctly in place), it makes it easier to manage redirects and individual pages.
Next currently do not have redirects in place between their mobile and desktop pages and so users are required to manually navigate to the relevant website configuration. By not automatically serving mobile users with mobile optimised content, Next are creating a negative user experience.
Verdict
When reviewed from a user’s perspective, the Next mobile website performs well; users are able to easily navigate around the website and can find what they’re looking for with a prominent search feature.
From an SEO and technical perspective, there is a lot that needs to be done to ensure the Next mobile website is optimised for search and correctly being understood and crawled by search engines. There are a number of serious issues with the Next mobile website, from crawler blocking robots.txt to missing sitemaps; there are substantial issues that need to be resolved to ensure their mobile website performs as best it can.
Do you have any questions regarding what I’ve discussed in this post? I’d love to hear from you – leave a comment below or contact me via Twitter @Koozai_Luke.
For more information on Mobile SEO or information on how you can effectively optimise your website for mobile, contact us today.
The post A Mobile SEO Case Study: Next appeared first on Koozai.com
No comments:
Post a Comment