Magento 2.0: What’s new for SEO?

James Flacks | April 5th 2016

PushON has been busy putting together a new guide for Magento 2.0. As part one of this series, we have looked into the new features within Magento 2.0 that will be of interest to SEO professionals and online marketers.

Magento 2.0’s main SEO benefits will be better performance and scalability – but there’s some new features for SEOs to get stuck into.

Product/Offer Schema

Schema (also known as semantic mark-up) is tags or code added to a webpage to help Google understand that text is (for example) an address, a review, or product.

magento2-product-schema

This could be implemented in Magento 1.9.x via third party extensions such as Creare’s SEO plugin – or with a small amount of development – but it’s available out of the box in Magento 2.0.x using microdata, rather than JSON+LD.

See a test using our Magento 2 demo site.

There’s no proof that implementing product/offer schema improves rankings but its main benefit is that Google can use the information in a search snippet.

schema-example-tescos

Product, Review, AggregateRating, and Offer Schema are implemented in Magento 2.0.x core. Magento’s more modular design means that developers should be able able to retain this functionality when extending the core for their own templates.

Google AdWords / Universal Analytics

Thankfully, Google AdWords Conversion tracking is now integrated into Magento 2.0 – you won’t have to get your developers to add the tag to the order confirmation page.

Magento 1.9.1 was the first release to switch over from Classic Google Analytics (ga.js) to Universal Analytics (analytics.js) but UA will be new for those who are behind on their update cycle.

Universal Analytics was introduced in October 2012 and adds a few “new” features. Sadly, these are not supported (out of the box) by Magento 2.0.x.

Features introduced in Universal Analytics include;

  • Sessions stitching – the ability to join different sessions together (even across different browsers and devices) in the event that the user logs into your website.
  • Enhanced ecommerce tracking (ec.js) – a module that gives far more usage behaviour tracking, for example, add to basket tracking, shopping cart funnels and product list performance.
  • Custom dimensions and custom metrics – a replacement for the older custom variables. These allow “information” to be stored against a pageview, browsing session or user which can then be used to segment the data in Google Analytics. For example, passing “lifetime value” to a custom metric (at “user scope”) would allow you to segment users who have spent over (for example) £500
  • Demographic and interest reports – allows segmentation by inferred age and gender. Also enables you to build remarketing audiences for the Google Display Network.

All of these would be great to see in Magento 2.0.x, but you’ll need to use an extension or add support for these yourself via your development team.

However Magento 2.0 Enterprise Edition has very good support for much of the above via Google Tag Manager.

Social Sharing Tags

These are now integrated into Magento core! Product pages now pull in OpenGraph tags for Facebook and Pinterest. These specify the text that appears, the title and the image that gets pulled into Facebook when a URL from your site is shared.

magento2-social-sharing

Twitter’s standard (“Twitter cards”) aren’t currently supported but this is currently unnecessary because Twitter falls back to OpenGraph tags when its own tags aren’t available.

The implementation currently supports the og:type of product which allows pricing information to be pulled through too.

pinterest-pin-example

Improved Minify!

The minify functionality in Magento 2.0 is improved.

As well as traditional minify, admins get the ability to;

  • Merge JS and CSS files without minifying
  • Minify JS and CSS files whilst keeping them all separate.

This flexibility is an improvement because it allows users to minify their JS/CSS files if merging them causes issues.

It’s worth mentioning that the default Luma theme minifies properly – it creates 3 CSS files.

  • One for mobile,
  • One that extends the mobile CSS for desktop/tablet
  • And a printable version.

This is good practice and efficient front-end development.

One new feature is the ability to minify HTML too – previously this needed a third party extension.

Fewer Junk Pages

One of the worst features from an SEO perspective in Magento 1.x was how it handled reviews, product comparisons and wishlists.

On a typical Magento site, this could create an extra 10,000 pages of thin content – for example, a separate review page for each product and a separate page for each individual review.

Magento 2.0.x seems to deal with this in a much better way – reviews are part of the product page and add to wishlist / product compare are now AJAX based non-crawlable URLs.

Much better Varnish Support

If you’re lucky enough to use Magento 2.0 EE, there’s been some real improvements here.

magento2-full-page-cache

Setting up Varnish and Magento can be a time consuming process with significant amounts of configuration necessary to prevent caching from causing issues – for example, a shopping basket that apparently doesn’t update or a customer login page that shows a previous browsers user details.

Magento 2.0 EE helps this by creating VCL configuration files for Varnish 3/4.

Prototype JS is gone, Hello jQuery and requireJS

Prototype is a jQuery alternative that very few people actually used.

It was most well known as the library that Magento forced you to load that no-one used because they used jQuery instead. Prototype was less popular amongst developers – it would occasionally break a number of other JS libraries and frameworks. Magento 2.0 removes Prototype and replaces it with jQuery. In practical terms, your webpages will now load about 0.1s faster – a small but noteworthy improvement.

Another new addition is requireJS, a Javascript file and module loader.

Whilst its primary purpose is safer loading of Javascript files (by managing their dependencies), sites using it can claim to render faster because it loads the JS files it pulls in asynchronously (without blocking the page rendering).

render-time-example

Source: https://developers.google.com/web/fundamentals/performance/critical-rendering-path/analyzing-crp

Correctly implemented, use of requireJS will be great for most Magento sites – although some browsers such as Chrome lose their ability to pre-load scripts – there’s a blog on the pros and cons at Hootsuite.

Google Content Experiments

It’s quite well hidden but a new Google Optimizer module in Magento 2.0 allows for Google Content Experiments.

Google Content Experiments are a relatively basic split testing tool – at least for creating variations – it’s very capable at finding winning variations through use of learning algorithms such as multi-armed bandit.

google-content-experiments

Variations created within Google Analytics primarily focus on redirecting a percentage of users to an alternate page (“variation”) on the site – but more advanced users can use Javascript to manipulate the page content without redirects instead.

Magento 2.0 gives site owners a place to paste the experiment code without there being any need for a third party solution such as Hotjar or Optimizely.

ARIA Attributes

This isn’t a SEO improvement but it’s good to see – the default Luma theme uses ARIA to make it more accessible for screen readers and similar devices, particularly those used by people who are blind or partially sighted. ARIA or Accessible Rich Internet Applications;

…Defines ways to make Web content and Web applications (especially those developed with Ajax and JavaScript) more accessible to people with disabilities. For example, ARIA enables accessible navigation landmarks, JavaScript widgets, form hints and error messages, live content updates, and more.

ARIA is a set of special accessibility attributes which can be added to any markup, but is especially suited to HTML. The role attribute defines what the general type of object is (such as an article, alert, or slider). Additional ARIA attributes provide other useful properties, such as a description for a form or the current value of a progress bar.

It will be up to individual developers to extend this for their own sites but a more accessible web is definitely something that should be encouraged. Figures from AbilityNet say that that ecommerce is losing out £50 billion a year in the UK spending power due to poor accessibility.

 

Coming Soon

The remainder of the guide will be launched on April 19th and will cover a range of topics to make sure that your eCommerce site remains as visible to search engines as it did under Magento 1.x. The guide covers best practice configuration of Magento 2.0 and discusses some of the issues that will still need to be fixed. Thanks for reading!

In the meantime, why not subscribe to our newsletter to receive regular updates?