Love ItLove It

What is AMP Web Development (Accelerated Mobile Pages)?

If you look at the last years of analytics traffic for websites, you will probably find that they all share one thing in common: an increase in the number of visitors they get from users on mobile devices.

Overall, there is now more web traffic from mobile devices than what we consider “traditional devices,” which essentially means desktops or laptops. There is no doubt that mobile computing has changed the way people consume content online, which means that it has changed the way we have to create websites for these increasingly mobile audiences.

Build for a mobile audience:

The creation of “mobile websites” has been a priority for web professionals for many years. Practices such as responsive web design to help create sites that work well for all devices, and a focus on website performance and fast download times benefit all mobile and non-mobile users. Another approach to mobile sites is known as AMP web development, which stands for Accelerated Mobile Pages.

This project, supported by Google, was created as an open standard for website publishers to create sites that load faster on mobile devices. If you think that sounds a lot like a responsive web design, you are not wrong. Both concepts share a great deal in common, namely that they both focus on providing content to users on mobile devices. However, there are a number of differences between these two approaches.

Key Differences between AMPs and Adaptive Web Design

One of the strengths of responsive web design has always been the flexibility it brings to a site. You can create a page that automatically responds to the size of a visitor’s screen. This allows your page to reach and deliver a quality experience to a wide range of devices and screen sizes, from mobile phones to tablets, laptops, desktops and more. Reactive website design focuses on all devices and all user experiences, not just mobile. It is both good in some respects and bad in others.

Flexibility in a site is great, but if you really want to focus on mobile, creating a site that focuses on all screens, not just mobile, can be a source of flexibility for mobile performance optimized. This is the theory behind AMP.

AMP is purely geared towards speed – i.e. moving speed. According to Malta Ubl, Google Tech Lead for this project, AMP aims to bring an “instant rendering to web content”. Here are some examples of what is done:

Lazy loading

Using pre connect

Pre-loading resources

Async JavaScript

Style sheets online

No downloadable font

Prioritization of resources

These are just some of the principles that make AMP so fast. However, some of the items on this list can make long-time Web professionals cringe. Style sheets online, for example. Many of us have been informed for years that all styles should be contained in external style sheets. Being able to style a lot of site pages from a single external sheet is one of the strengths of CSS – a force that is canceled if pages use online styles instead. Yes, you avoid the need to download the external file, but at the cost of being able to manage all this site with the only style sheet. So which approach is the best? The reality is that they both have their advantages and disadvantages.

The Web is constantly changing and the different people who visit your site have different needs. It is very difficult to establish rules that will apply in all cases, because different approaches make sense in different situations. The key is to weigh the advantages or disadvantages of each approach to determine what is best in your particular case.

Another key difference between AMP and RWD is that reactive design is rarely “added” to an existing site. Because RWD really is a redesign of the architecture and experience of a site, it will usually require that this site is redesigned and refitted to adapt to responsive styles. AMP can be added to an existing site, however. In fact, it can even be added to an existing reactive site.

JavaScript considerations:

Unlike sites with RWD, AMP sites do not work well with JavaScript. This includes scripts and third-party libraries that are very popular on sites today. These libraries can add incredible features to a site, but they also have an impact on performance. As such, it goes without saying that a strong speed-of-page approach would avoid JavaScript files. For this reason AMP is often better used on static web pages than on dynamic pages or requiring JavaScript specific for one reason or another.

For example, a website gallery that uses a light box style experience is not going to be a great candidate for AMP. On another side, a standard website article or press release that does not require any sophisticated functionality would be an excellent page to deliver with AMP. This page is likely to be read by people using mobile devices who may have seen the link on social media or through Google mobile search. Being able to instantly deliver this content when they request it, instead of slowing down the download speed while JavaScript and other useless resources are loaded, makes for an exceptional customer experience. Be read by people using mobile devices who may have seen the link on social media or through Google mobile search.

Choose the right solution:

So what is the option that suits you – AMP or RWD? It depends on your specific needs, of course, but you do not need to choose one or the other. If we want to have smarter (and more successful) online strategies, it means we have to consider all the tools at our disposal and learn how they will work together. Maybe that means delivering your site responsively, but using AMP on certain sections or pages that may be most suited to this style of development. It could also mean taking aspects of different approaches and combining them to create hybrid solutions that meet very specific needs and offer the best of both worlds to visitors to this site.


What do you think?


Written by Ailsa lee

One Comment

Leave a Reply

Leave a Reply