AMP UI Testing
AMP is a way to build web pages for static content (pages that don’t change based on user behaviour), that allows the pages to load (and pre-render in Google search) much faster than regular HTML.
Accelerated Mobile Pages (AMP) are lightweight pages designed to give mobile users a lightning-fast experience that is easier to read and more engaging.
Following are some of the steps to test the AMP pages of the site.
Add ?AMP to the URL
Ex: https://example.com/?amp – adding ?amp to the URL you will be able to identify the UI issues of the page when site is on AMP.
Browser Developer Tools
This tool helps to check the validation errors. When we add #development=1 to the URL of the page in the browser, if AMP site has no errors then it works fine else gives errors in the console. Follow the below steps:
- Open the AMP page in your browser.
- Add “#development=1” to the URL, for example, http://example.com#development=1.
- Go to the Chrome DevTools console and check for validation errors. The errors will be listed.
AMP Validator Browser Extension
Download the AMP Validator browser extension for Chrome and browse the pages on your site. This plugin will automatically check each page for AMP validation. It will turn to green if the page passes AMP validation or turn to red if the page fails the test.