Checking how your content is viewed on different devices is a good accessibility practice.
It allows you to see how the content is displayed and how a customer would interact with the content. You can then make adjustments if your content needs to be displayed differently.
Following these steps will allow you to view the mobile version of a webpage by using Chrome Devtools.
- In Google Chrome, click on the column of 3 dots in the top right hand corner of your web browser screen.
- Select More Tools > Developer Tools.
-
Click on the Device Toggle icon (looks like an phone infront of an ipad).
-
Click on dimensions. This the the choose a device you want to simulate from the dropdown list of iOS and Android devices that will appear on the left hand side of the screen.
- Once the desired device is chosen, it displays the mobile view of the website.
To exit out of the mobile view, click on the X in the top right hand corner.
Note: You may also need to click on the little hamburger 'menu' icon of the mobile view version to collapse your menu screen to see the webpage clearly.
Need any more help?
If you have any questions, or require assistance with anything mentioned on this article, submit a request via the webform.