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:
Using pre connect
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.
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.