Test if a website has responsive qualities

by Gael   Last Updated April 29, 2015 21:01 PM

Within the context of a market study, I would like to determine if a website has responsiveness qualities.

Given an website URL, I would give a notation regarding these points:

good points:

  • use of media-queries
  • presence of a viewport tag

bad points:

  • elements, fonts with static sizes

I do not want to test the design quality, nor the usability, just know if there has been a work done in that direction.

Do you see other things that makes obvious that a website has been build with responsivity in mind?

I want to make automated tests, so criterias should be simple.



Answers 2


I'm not sure what your question is aimig at – and your question is also rather broad – Responsive Design is a wide field. You may also consider asking over at http://ux.stackexchange.com – I have the feeling you might get more suitable answers than here.

That said I'll try to answer: if you just want to check for 'responsiveness' (yes/no) then media queries are probably the criteria I would recommend looking at.

Basically Responsive Design just means, that the website design should adapt to different screen sizes. That can mean that the layout changes slightly according to screen sizes by rearranging layout elements or the like. It can however also mean that image sizes and/or font sizes change relative to the screen size / viewport size.

So following your question, I would probably just change the browser window size to see if anything changes. If in doubt, I would look at the css and check media queries.

What I would personally be interested in:

  • Does the layout change according to screen sizes?

  • Does the navigation adapt to the layout? How?

  • Is the website layout still zoomable – or fixed?

  • Are elements hidden to achieve a well-fitting layout? What elements?

  • Are media elements e.g. video player and slide shows integrated mobile friendly? For example are HTML5 fall backs used for Adobe Flash Players?

  • How are pop up windows / modal windows handled? Do they also adapt to screen size?

  • Can the page be viewed in Reader mode? (iOS)

  • Are form elements (textfields, buttons, …) 'mobile friendly'? Are HTML5 tags used that may (or may not) be supported by various mobile devices?

…to be continued…

tillinberlin
tillinberlin
April 29, 2015 08:59 AM

Perhaps the Google mobile friendly test is of use to your study. You can input a URL and the tool tests a variety of responsive parameters. The test also says which parameters have been tested and which have been found not responsive.

https://www.google.com/webmasters/tools/mobile-friendly/

Robbert Segers
Robbert Segers
April 29, 2015 10:45 AM

Related Questions




i dont have anything from my website

Updated October 28, 2017 19:04 PM