Is the scrollbar width included or excluded from the screen width? Can I be sure that the breakpoints are applied as per my intentions or should I rethink my media queries?
Is this or that resolution important for me to test on? What device would that be and is this device frequently used? With other words, is what I can see on a particular resolution a common case or an edge case; hence, how much effort shall I put into fixing the anomalies, if any?
Does the correction I applied in the stylesheet, e.g. a tablet portrait view, modify the style on the following media queries as well? Do I need to make additional correction on them?
Are the results displayed in standard resolution or high resolutions are also applied (@2x, @3x…), so can I be sure that this or that graphic is sized correctly and won’t look weird on a device, with e.g. @4x screen?
Auto detect the scrollbar width of the device, we were doing the RWD testing on and excluding it from the screen width to prevent modifying the application of the breakpoints. Although for bigger devices and on certain operation systems, including the scrollbar is necessary to get an accurate picture, so we made that setting customizable.
Show the devices in the device list by their brand name accompanied with their screen resolution. We also indicated their market share to show which are the most used ones; hence, they are the most important ones to test on. So the client facing design presesntations can go smoothly.
Automatically apply the high resolution displays (@2x, @3x…) while keeping the real physical device size, so what is e.g. 10” in the real life will be 10” on the screen (close to 10” to be precise, as the actual size depends on the pixel size of the device we are testing on), even if it’s a @3x retina ready display. Just like in a device lab.
Show the responsive web design test result in a horizontal viewport for quick scanning, making it immediately visible how a modification in the stylesheet would affect the different media queries. In addition, check (with the help of the Console) within which media query shall the modification be put in to be displayed on the appropriate devices.
- auto scrollbar
- most used devices
- retina ready
- panorama view