Demonstration of new tool from Mozilla

25th June 2012


Web designers now have access to a video created by one of Mozilla’s developers, which demonstrates the new responsive mode and layout view from Firefox. The responsive mode is the one that is expected to generate the most interest from those working in web design and who are developing responsive sites.

The video contains a number of hints and tips for responsive web design. One of these concerns resizing the browser window in order to test the sites, but some may find this a trying task. Resizing the window can often mean losing essential icons and the address bar, which can be frustrating when trying to work with it.

Those who want to make use of this responsive mode can do so via the web developer section. By selecting the responsive mode it will place the web page within the browser window. This will allow the web designer to resize the page and not the window, which can be much more helpful. Details of the viewport can be found in a pop-up window, which is continually updated.

Web design experts will find that the pop-up window will include the information needed for mobile devices, and the page can be easily rotated if needed. Those who are working with CSS styling will find this function helpful, particularly for testing the design of the responsive site.

Designers can also expect some improvements to the Inspect Element view. This means that users will be able to see the dimensions of an element by selecting it and it will also show the settings for the border, margins and padding. The new tools that are being developed can be tested out until they are officially launched in August.