What is the difference between Accelerated Mobile Pages (AMP) and responsive pages? – WAU

This article is an adaptation of the Search Engine Journal blog post, “The Difference Between Accelerated Mobile Pages (AMP) and Mobile-Friendly Pages” If you work with Digital Marketing, you should already know the importance of having a fast and responsive website in any device. Despite this, many companies have not kept up with changing user behavior, […]

This article is an adaptation of the Search Engine Journal blog post, “The Difference Between Accelerated Mobile Pages (AMP) and Mobile-Friendly Pages”

If you work with Digital Marketing, you should already know the importance of having a fast and responsive website on any device.

Despite this, many companies have not kept up with the changing behavior of users, who are increasingly switching to cell phones when they search for information, read articles or buy products.

Is your company one of them? If so, know that Google is watching you!

The searcher’s efforts to value sites that respond well on all screens do not stop, and those who have not yet adapted can already feel the negative impact on ranking.

But if you made it to this post, you may already be thinking of offering a better experience to the user who accesses your site through your smartphone and, consequently, earn points with Google!

In this post, we will talk about responsive pages and Accelerated Mobile Pages (AMP), two concepts that are related to access by mobile devices.

You will understand what they are, their similarities and differences and, after all, which one you should use.

Stage Analyzer

Follow!

What are responsive pages?

Responsive or mobile-friendly pages are “friendly” to mobile devices.

They are optimized to offer the user a pleasant browsing experience on any device, without having to zoom in to read the texts or drag the screen to view all the content.

To avoid these problems, Google recommends using responsive design, which aims to offer an ideal viewing experience for pages on the most diverse devices – desktops, notebooks, tablets, smartphones etc. – regardless of the screen size.

With this design approach, the layout reacts correctly to the width of the browser window, making the content fluid.

In early 2015, Google announced that the mobile-friendly criterion would become part of the ranking algorithm and responsive pages would gain prominence, which would have a major impact on the search results on smartphones.

The announcement was so bombastic that many called it Mobilegeddon. It was the searcher’s warning: “you need to adapt, or your pages will fall in ranking”.

And it was the scare that many companies needed to start moving.

How a website can become mobile-friendly

A page must meet the following criteria to be considered mobile-friendly:

  • Avoid software incompatible with mobile devices, such as Flash
  • Use legible text, without having to zoom with a “pinch” gesture
  • Scale content and images correctly for the screen size
  • Position links and buttons so that they can be easily clicked

To create a mobile-friendly site, follow Google’s guidelines in your mobile webmaster guide.

In addition, use the simple, free mobile compatibility test to check your URLs.

The diagnosis shows how the Google robot reads the page and displays the errors found. From that information, you can start applying the improvements.

Responsive design is the best approach to create layouts compatible with mobile devices. Generally, platforms like WordPress, Drupal and Joomla offer responsive themes and templates – check this out before purchasing one.

In Google Search Console, you can check specific reports on mobile-friendly pages, which identify usability problems on mobile devices.

What are Accelerated Mobile Pages (AMP)

The most recent initiative to improve search results and the user experience on mobile devices is the Accelerated Mobile Pages (AMP) or “mobile accelerated pages”, in free translation.

The AMP Project is an open source initiative to develop pages of static content that charge faster on mobile devices, improving the search experience. Currently, they load in less than 1 second and use 10 times less data.

The project is headed by Google, in partnership with technology companies and community collaboration, with the objective of building a faster and more efficient mobile web.

In the mobile search results, AMP pages are identified with a stamp and are currently highlighted, above the other organic links.

Try, for example, typing “Hillary Clinton” on your smartphone. Several pages with the “AMP” seal will be highlighted in the Top News section.

And if they are shared on networks like Twitter, LinkedIn and Pinterest, whoever accesses them on their smartphone will also see a quick upload.

When clicking on the link, the user will be instantly taken to a page with super simplified visuals and navigation. So, by nature, AMP pages are also mobile-friendly.

Launched in October 2015, the project started with news portals and now includes entertainment, travel, recipes, etc. In London, this process is still evolving.

How to configure AMP pages

AMP pages use several code and layout optimization techniques to simplify the content and display it instantly to the user.

But you need to develop them – Google does not generate an AMP version automatically.

To learn how to execute your first page, follow the tutorial on the AMP Project website, where you will find all the guidelines and technical specifications.

Check out the 6 steps for publishing:

  1. Create the HTML code
  2. Include images
  3. Customize styles and layout
  4. Preview and validate the page
  5. Prepare the page to be displayed in the search
  6. Publish the AMP page

For those who use WordPress, good news: there is a plugin that facilitates this work when creating versions of pages compatible with AMP. If you already use Yoast SEO, you will have to download the Glue plugin.

Other CMS platforms, such as Drupal and Hatena, also participate in the AMP project and have an easier configuration.

After implementation, you can also check the reports on Google Search Console. It shows the list of indexed AMP pages and the specific errors found on the site.

Difference between Google AMP and Facebook Instant Articles

A project similar to AMP was recently adopted by Facebook. They are the Instant Articles, which also offer a much faster loading for the pages when accessed by the smartphone.

The main difference is that Instant Articles are hosted on Facebook and are restricted to this social network, while AMP pages are open to any platform that can interpret them.

A common purpose: the user experience

Whenever a page takes too long to load or appears to have problems after loading on the cell phone, the site loses a user, who could browse, convert and buy inside.

For example, according to DoubleClick research, 53% of people leave a site when it takes more than 3 seconds to load on their mobile phone.

This means a bad search experience, as the site did not live up to expectations. And Google doesn’t want that. He wants the sites to deliver what the user wants, in the best possible way.

That is why the search engine engages in initiatives such as the enhancement of mobile-friendly pages and, subsequently, the AMP project.

Both mobile-friendly and AMP pages, if they follow Google’s guidelines, offer a better user experience who accesses the site via smartphones.

Thus, both initiatives tend to reduce the abandonment of the site and the bounce rate and increase the length of stay and the number of pages per visit.

Main differences between mobile-friendly pages and AMP

Although they have the same purpose, the mobile-friendly and AMP pages have some important differences, which you must know to establish your mobile strategies.

Design vs. velocity

Both initiatives are focused on usability via mobile, but there is a clear difference in focus.

The mobile-friendly pages are focused on design, that is, on how to present the content in an organized and efficient way on any device.

The AMP project is focused on velocity of loading, that is, on how to deliver the content as quickly as possible to the user of mobile devices.

Display in search results

In 2014, Google announced that mobile-friendly pages would earn a stamp in search results on smartphones, warning users that that link would take them to a page compatible with mobile devices.

However, in August 2016, Google found that 85% of the results already met this standard. Then, the search engine removed the seal display. Today, they are presented in the results like any other link.

This same type of seal started to be used for AMP pages. In the search results, in addition to being identified, they can also be displayed in carousel mode, with an image (if the page is configured for that with structured data).

Page layout

AMP pages are extremely simplified. They present the content in just one column, containing text, images, ads and a few other elements. Items such as sidebars, menus, pop-ups, forms and comments do not appear.

The possibilities of changing the layout are limited to some customizations, such as colors, fonts, logo and sharing buttons. But the focus here is on reading the content.

On the mobile-friendly pages, you have the freedom to create the design you want. In addition to customizing each detail of the layout, you can insert menus, comments box, forms etc.

But the mindset for creation and development is the same: the ideal for mobile devices is simplify, understanding the priority information for the user who accesses your website by cell phone.

Loading speed

As mobile-friendly pages have many features, such as specific font and style features, they become heavier and slower, although they offer more navigation options and a richer look for the user.

AMP pages seek maximum simplification, with total focus on content, eliminating any refinement of layout. For this reason, AMP has made practically instant loading, much faster than mobile-friendly pages.

Ranking factor

There is a belief that Google’s algorithm has more than 200 ranking factors, which are not fully known because the search engine does not reveal all its secrets.

However, Google made a point of clearly revealing one of these factors: the mobile-friendly criterion. So, if we don’t know exactly how the algorithm works, at least one thing we can be sure of: responsive pages take priority in positioning.

The same is not true for AMP pages. As this is a recent project, for which Google wants to give visibility and win more followers, it has been placing AMP-compatible pages in the search results.

This does not mean, however, that it entered the criteria of the algorithm. Therefore, Google explains: AMP is not a ranking factor (at least not YET …).

Still, as they will have incredible speed and a low bounce rate, it is likely that Google will reward these pages with good positioning.

Duplicate content

An AMP-enabled page receives a / amp at the end of the original URL. For example, a post on this blog with AMP would look like this: www.marketingdeconteudo.com/post/amp.

That is, a second URL is created and the content is duplicated, which is a problem in SEO.

To resolve this issue, you need to tell us what the original URL is and that there is an AMP version of it.

How to do this? Through the “amphtml” and “canonical” tags. Here’s how the codes would look:

  • On the original page: <link rel = ”amphtml”Href =” http://www.marketingdeconteudo.com/post/amp/ ”/>
  • On the AMP page: <link rel = ”canonical”Href =” http: // www. marketingdeconteudo.com/post/ ”/>

A responsive page uses the same URL and the same code to be displayed on a computer, tablet or smartphone.

At the time of display, the layout fits the screen. That is, there is only one version of the page and the content is not duplicated.

After all, which one should I use?

Accelerated Mobile Pages are still in their infancy. Features are slowly being added after many tests and improvements. So, you may encounter some limitations that do not meet your needs.

The ideal use of AMP pages is still for static content, such as news and blogposts, where reading is the priority.

For custom forms and applications, the AMP project does not yet offer complete resources, although it is evolving in this direction.

So, if your goal is to convert or generate leads, perhaps a responsive page is more appropriate at that time to meet the needs of your business.

Mobile-friendly pages are already a reality. In addition to the need to adapt to changing consumer behavior, they are a ranking factor for Google.

So, if you haven’t already, start by creating a mobile-friendly site. Then, create the AMP versions of these pages.

Thus, you will always offer a positive experience to the mobile user, leveraging your content and your website traffic.

Developing fast and responsive pages is just one of the strategies for those who want to improve their performance on mobile devices. Now, discover all the possibilities in our article on mobile marketing!