Test website responsiveness with Google Chrome Developer Tools

Mobile-first development is at the forefront web design. There are numerous approaches to effective responsive web design and even a few tools to make sure what you’re doing is working!

How easy is it to find out how your website will look on different mobile devices? Very easy if you already have Google Chrome installed! Chrome comes stock with “Developer Tools” or DevTools for short. To launch the tools simply hit F12. This native inspector is miles above Firefox’s FireBug plugin which used to be a developer favorite.

Once you have DevTools launched:

  • Click the Settings icon located in the lower right-hand corner (looks like a gear) ->
  • Click Overrides ->
  • Check User Agent box ->
  • Select device to begin emulation

Leave a Reply

Your email address will not be published. Required fields are marked *