Chapter 1 - What's new for SEO?

Improvements from Magento 1.x

Magento 2, released in 2017, marked a significant advancement in eCommerce platforms. Its enhanced modularity, extensibility, and performance capabilities quickly impressed both developers and business professionals.

SEO was a core focus during Magento 2’s development. This resulted in several notable improvements that directly benefit search engine optimization…

Product/Offer Schema

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

Put more simply, schema helps to label content “under-the-hood” of the page in a way that search engines can easily understand.

 This is a new out-of-the-box features in Magento 2.x that 1.9x didn’t have! Previously, site owners would implement schema via third party extensions such as Creare’s SEO plugin or with a small amount of custom development. These days, there is nothing extra you need to do for it work. 

There is a small caveat however, and that is that the Magento 2 schema support is still rather basic.

Product, Review, AggregateRating, and Offer Schema are implemented in Magento 2.x core, which means key eCommerce schema like organization, breadcrumbs and search box are still missing. 

Google AdWords, Google Tag Manager and GA4

Thankfully, Google’s various tracking services are now integrated into Magento 2 – you will not have to get your developers to add the tag to the order confirmation page.

You can find where to do this under Stores > Configuration > Sales > Google API. There, it will separate out your options into “Google Analytics” and “Google Adwords”, or you may see “Google GTag”. Here you can select whether you are implementing via the Gtag ID itself, or via something like GTM and add all of the corresponding measurement tags. 

If you are an eCommerce site, it’s important to know that this default functionality does not include the recommended eCommerce events like purchase, view_item and so on. To begin measuring those, you’ll need to find an alternative solution through additional modules or custom development. Read chapter 4 for a walkthrough!

Social Sharing Tags

Social Sharing tags are now integrated into the Magento core. Product pages will now pull in OpenGraph tags for Facebook and Pinterest. These specify the text, title and the image that gets pulled into Facebook when a URL from your site is shared on a social media website.

Twitter cards are not currently supported, but this is unnecessary because Twitter falls back to OpenGraph tags when its own tags are not available.

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

Improved Minify

The minify functionality in Magento 2 is improved. As well as traditional minify to reduce file sizes, since Magento 2, admins have 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 even if merging them causes issues; this was a known issue for many with previous Magento releases.

The default Luma theme also now 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 as this was only previously available through 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.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.

This is much better from a crawling and content perspective too.

Much better Varnish Support

If you use Magento 2 Commerce Edition, there have been some real improvements here.

Setting up Varnish with Magento can be a time-consuming process with significant amounts of configuration that is necessary to prevent Varnish Cache from causing issues. For example, a shopping basket that does not update or a customer login page that shows a previous browser’s user details.

Magento 2 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 best known as the library that Magento forced you to load, but most people opted to use jQuery instead. Prototype was less popular amongst developers – it would occasionally break a number of other JS libraries and frameworks.

Magento 2 removed Prototype and replaced it with jQuery. In practical terms, your webpages now load about 0.1s faster – a small but noteworthy improvement.

Another new addition is requireJS, a Javascript file and module loader. While 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).

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

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

Google Content Experiments

It is quite well hidden but a new Google Optimizer module in Magento 2 allows for Google Content Experiments.

These are relatively basic split testing tools for creating variations and it is very capable of finding winning variations through the use of learning algorithms such as multi-armed bandit.

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 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 is not an SEO improvement per se, but it is 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 unique 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 sites, but a more accessible web is something that should be encouraged. Figures from AbilityNet say that eCommerce is losing out £50 billion a year in the UK spending power due to poor accessibility.

Keep reading our Magento 2 guide to discover more about Magento 2’s SEO Setup and Settings.

Further chapters in this guide:

Do you have an eCommerce development challenge for us?

Contact us on 0800 538 5451 or email us today