PC SOFT

ONLINE HELP
FOR WINDEV, WEBDEV AND WINDEV MOBILE

Home | Sign in | English US
  • Overview
  • Debugging options specific to Chrome, IE 11, Edge,...
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaReports and QueriesUser code (UMC)
WEBDEV
WindowsLinuxPHPWEBDEV - Browser code
WINDEV Mobile
AndroidAndroid Widget iPhone/iPadApple WatchUniversal Windows 10 AppWindows Mobile
Others
Stored procedures
Overview
The pages in Responsive Web Design mode can be checked like any other WEBDEV page in the browser of your choice. Then, all you have to do is reduce (in "Desktop First" mode) or increase (in "Mobile First" mode) the browser width to see the changes in the page.
To save time during the real tests on the different devices, a debugging option of browsers can be very useful. Used on the development computer during the "Go" test of pages, this option allows you to get a very precise idea of the rendering of pages:
  • in their "Desktop" version, for the browsers on PC or Mac,
  • when they are viewed from an iPhone, an iPad, a Samsung S4, a Nexus 5, 6, 7, ...
Debugging options specific to Chrome, IE 11, Edge,...
For example, with Chrome, press the F12 key to display the debugging options. The "Toggle Device Mode" button (Ctrl+Shift+M) is used to switch to "device mode" emulation:
Then, a "Device" combo box allows you to select a device in order to see the site like if it was a mobile device and not the development computer.
For example, the site is run from the test on a development computer in Windows but its rendering is identical to the one displayed on an Apple iPhone 6:
The standard rendering of the same site is as follows:
Very useful to check the "Office" version and the mobile version of a page for a site with rebound or dynamic serving, or to adapt a Responsive Web Design site.
The option is presented here in Chrome, it is also available in Internet Explorer 11 and Edge by using F12 then the "Emulation" pane.
Minimum required version
  • Version 21
Comments
Click [Add] to post a comment