{"id":6115,"date":"2017-08-22T07:00:16","date_gmt":"2017-08-22T07:00:16","guid":{"rendered":"https:\/\/9series-blog.staging9.com\/?p=6115"},"modified":"2026-03-03T10:45:26","modified_gmt":"2026-03-03T10:45:26","slug":"get-started-amp-a-new-approach-for-mobile-web","status":"publish","type":"post","link":"https:\/\/www.9series.com\/blog\/get-started-amp-a-new-approach-for-mobile-web\/","title":{"rendered":"Get Started with AMP: A New Approach for Mobile Web"},"content":{"rendered":"<p>A <a href=\"https:\/\/www.9series.com\/services\/responsive-website-design.html\" target=\"_blank\">responsive web application<\/a> sometimes takes more time while it is running on the mobile browser. To reduce the load time, Google comes with a new approach for mobile web which is known as Accelerated Mobile Pages. The benefits behind this major initiative are Quick Read and Carousel that shows in search engine results and higher ranking factor.<\/p>\n<p><a href=\"https:\/\/9series-blog.staging9.com\/wp-content\/uploads\/2017\/08\/Get-Started-with-AMP-A-New-Approach-for-Mobile-Web1.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2687\" src=\"https:\/\/9series-blog.staging9.com\/wp-content\/uploads\/2017\/08\/Get-Started-with-AMP-A-New-Approach-for-Mobile-Web1.jpg\" alt=\"AMP Page\" width=\"800\" height=\"500\" \/><\/a><\/p>\n<p>The AMP pages are nothing but normal HTML pages with a couple of restrictions and extra features. Every AMP page has a custom javascript library that delivers optimum performance by adding and validating new elements in our markup. Also, you need to use streamlined CSS. This provides things like Lazy Loading. (Note: Though the javascript is not allowed there are some loopholes where we can create buttons and display ads.)<\/p>\n<p style=\"margin-bottom: 0px\"><span style=\"font-weight: bold\">Impact on SEOs and SERPs<\/span><\/p>\n<p>If the user tries to get an information from the mobile device and the website is not optimized for a mobile device then the user bounces off the site. It results in business and <a href=\"https:\/\/www.9series.com\/services\/search-engine-optimization-expert.html\" target=\"_blank\">Search Engine Optimization (SEO)<\/a>. This causes a negative impact on where the slow loading or non mobile optimized website will appear in Search Engine Result Pages (SERPs).<\/p>\n<p>The AMP pages are not the ranking factor, but its mobile friendliness nature that enables the page load time 4 times faster by consuming 8 times less data than non AMP pages. Thus the web page has a good reason for ranking better in mobile search engine results. The Google SERP displays AMP enabled articles by dominating thumbnails which include large images.<\/p>\n<p>This helps to maximize the SERPs. It leads to more page views and an easy path to SEO.<\/p>\n<p>When we search item from google, it will show you the carousel that highlights AMP enabled websites.<\/p>\n<p><span style=\"font-weight: bold\">There are 3 basic components of AMP page:<\/span><\/p>\n<p style=\"margin-top: 10px;margin-bottom: 0px\"><span style=\"font-weight: bold\">AMP HTML<\/span><\/p>\n<p>~ They are normal HTML pages with a couple of enhancements and extra features. Some of the HTML tags are replaced by amp tags.<\/p>\n<p>For eg., the provides full \u2018srcset\u2019 support.<\/p>\n<p>~\u00a0 AMP is discovered by search engines and other platforms by the help of HTML tag.<\/p>\n<p style=\"margin-top: 20px;margin-bottom: 0px\"><span style=\"font-weight: bold\">AMP JS<\/span><\/p>\n<p>~\u00a0 It is the javascript library which helps fast rendering of AMPs. This javascript library optimizes the external resources which come asynchronously.<\/p>\n<p>~\u00a0 The sandboxing of all iframes includes pre calculation of all the layout before resources are loaded and disables all slow CSS.<\/p>\n<p style=\"margin-top: 20px;margin-bottom: 0px\"><span style=\"font-weight: bold\">AMP Cache<\/span><\/p>\n<p>~ It is the proxy based content delivery network. It fetches the AMP page and improves the performance automatically.<\/p>\n<p>~\u00a0In AMP page, all the JS and images which are loaded from the same origin uses HTTP 2.0 for maximum efficiency.<\/p>\n<p>~ The cache also comes with a built in validation system and it does not depend on external resources.<\/p>\n<p>~\u00a0The validation system checks that the page markup matches with AMP mark up.<\/p>\n<p>~\u00a0The validation can also log validation to browser\u2019s console when the page is rendered.<\/p>\n<p style=\"margin-top: 20px;margin-bottom: 15px\"><span style=\"font-weight: bold\">The AMP page should contain following things:<\/span><\/p>\n<p><a href=\"https:\/\/9series-blog.staging9.com\/wp-content\/uploads\/2017\/08\/Amp-Mobile-App-development.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2675\" src=\"https:\/\/9series-blog.staging9.com\/wp-content\/uploads\/2017\/08\/Amp-Mobile-App-development.jpg\" alt=\"Responsive Website\" width=\"800\" height=\"290\" \/><\/a><\/p>\n<p><span style=\"font-weight: bold\">Below is the list of some HTML tags we use frequently which are replaced by AMP or which are not allowed in AMP.<\/span><\/p>\n<p><a href=\"https:\/\/9series-blog.staging9.com\/wp-content\/uploads\/2017\/08\/Amp-Mobile-App-development11.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2685\" src=\"https:\/\/9series-blog.staging9.com\/wp-content\/uploads\/2017\/08\/Amp-Mobile-App-development11.jpg\" alt=\"Amp Mobile App development\" width=\"800\" height=\"399\" \/><\/a><\/p>\n<p>We 9series, as an organization has done AMP implementation using asp.net with the help of our <a href=\"https:\/\/www.9series.com\/services\/asp-dot-net-mvc-development.html\" target=\"_blank\">best .net mvc developers<\/a> for our esteemed client.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>A responsive web application sometimes takes more time while it is running on the mobile browser. To reduce the load time, Google comes with a new approach for mobile web&#8230;<\/p>\n","protected":false},"author":1,"featured_media":6116,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"dsgo_overlay_header":false,"dsgo_overlay_header_text_color":"","dsgo_overlay_skip_top_bar":false,"_designsetgo_exclude_llms":false,"footnotes":""},"categories":[1429],"tags":[2100,2101,2102,2103,2104,1791,2105,1921],"class_list":["post-6115","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-microsoft","tag-accelerated-mobile-pages","tag-accelerator-mobile-app-development","tag-amp","tag-amp-pages","tag-google-amp","tag-mobile-web-development","tag-responsive-web-application","tag-search-engine-optimization"],"_links":{"self":[{"href":"https:\/\/www.9series.com\/blog\/wp-json\/wp\/v2\/posts\/6115","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.9series.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.9series.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.9series.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.9series.com\/blog\/wp-json\/wp\/v2\/comments?post=6115"}],"version-history":[{"count":1,"href":"https:\/\/www.9series.com\/blog\/wp-json\/wp\/v2\/posts\/6115\/revisions"}],"predecessor-version":[{"id":6119,"href":"https:\/\/www.9series.com\/blog\/wp-json\/wp\/v2\/posts\/6115\/revisions\/6119"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.9series.com\/blog\/wp-json\/wp\/v2\/media\/6116"}],"wp:attachment":[{"href":"https:\/\/www.9series.com\/blog\/wp-json\/wp\/v2\/media?parent=6115"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.9series.com\/blog\/wp-json\/wp\/v2\/categories?post=6115"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.9series.com\/blog\/wp-json\/wp\/v2\/tags?post=6115"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}