What is AMP? AMP Installation Guide and AMP in 2021
Posted: Mon Dec 09, 2024 8:42 am
Much has been written and drawn about it. Those who like it, those who don't, those who are confused, those who want to implement it but aren't sure, those who have given up have been voicing their opinions about AMP for over 2 years. We wanted to touch on what AMP is, how it is implemented, what this technology draws its power from, what it takes from you, and also compile the problems encountered and application results with global case studies through application examples. We hope we can eliminate the question marks and support you in your decision to use this technology or not.
What is AMP?
Accelerated mobile pages, or AMP for short, is an open source mobile technology that Google announced in 2015 and started showing its results on the SERP in 2016, allowing pages to open faster. In the results section, AMP pages are marked with the Google AMP icon.
If we put the classic definition aside; Google serves your pages faster by keeping them in its own cache. In other words, just as a user who clicks on a page on Google normally sends a request to your server business owner database via the browser and requests all the files and code blocks from your server, we can say that in AMP, this process is completely done through Google. No request comes to your server, the page is served through the server that Google keeps in its own memory and the page opens faster. In the part of how it achieves this, the components of AMP technology come to the fore:
AMPHTML
AMP JavaScript
AMP Cache
You may be asking why there are components such as AMP HTML, AMP JavaScript, so let's explain this first and then detail these components. Google imposes various restrictions on web pages so that it can serve AMP pages quickly from its own cache. It does not allow codes other than the JavaScript library it defines to reduce JavaScript load, it states that when you use CSS, it must be inline and there must be only one style (maximum 50 kb), and for static HTML, it requires the use of tags created for AMP.
If you recall, in the first article of this series, we detailed the critical processes in opening a page, and we especially mentioned that the extended periods in the Critical Rendering Path section slow down the speed of the site. As a solution to all the processes and problems there, Google suggests that you translate your pages into a language that it can fully understand, without complicating them, with a simpler coding system, and argues that this coding is necessary so that it can serve this quickly from its own cache. The three images below actually summarize the situation quite well. In the AMP example, we can understand how much resources are stripped down and a simpler structure is created, and that of course the site will speed up when this is the case.
What is amp?
Source: Evidon
Now let's get into the details of the components.
AMPHTML
There are codes that must be present in AMP HTML and codes that are not allowed. The following codes are stated as must-have codes.
What is AMP?
Accelerated mobile pages, or AMP for short, is an open source mobile technology that Google announced in 2015 and started showing its results on the SERP in 2016, allowing pages to open faster. In the results section, AMP pages are marked with the Google AMP icon.
If we put the classic definition aside; Google serves your pages faster by keeping them in its own cache. In other words, just as a user who clicks on a page on Google normally sends a request to your server business owner database via the browser and requests all the files and code blocks from your server, we can say that in AMP, this process is completely done through Google. No request comes to your server, the page is served through the server that Google keeps in its own memory and the page opens faster. In the part of how it achieves this, the components of AMP technology come to the fore:
AMPHTML
AMP JavaScript
AMP Cache
You may be asking why there are components such as AMP HTML, AMP JavaScript, so let's explain this first and then detail these components. Google imposes various restrictions on web pages so that it can serve AMP pages quickly from its own cache. It does not allow codes other than the JavaScript library it defines to reduce JavaScript load, it states that when you use CSS, it must be inline and there must be only one style (maximum 50 kb), and for static HTML, it requires the use of tags created for AMP.
If you recall, in the first article of this series, we detailed the critical processes in opening a page, and we especially mentioned that the extended periods in the Critical Rendering Path section slow down the speed of the site. As a solution to all the processes and problems there, Google suggests that you translate your pages into a language that it can fully understand, without complicating them, with a simpler coding system, and argues that this coding is necessary so that it can serve this quickly from its own cache. The three images below actually summarize the situation quite well. In the AMP example, we can understand how much resources are stripped down and a simpler structure is created, and that of course the site will speed up when this is the case.
What is amp?
Source: Evidon
Now let's get into the details of the components.
AMPHTML
There are codes that must be present in AMP HTML and codes that are not allowed. The following codes are stated as must-have codes.