Opera Mobile Emulator For Responsive Web Design
Monday, October 22nd, 2012
Designing responsive websites – websites that change easily to accommodate different screen sizes or devices – can be tricky to do on a traditional computer monitor. After all, the device you’re designing for is often less than half that size, and cannot be navigated with a mouse and keyboard. To help designers, Opera has developed a Mobile Emulator that is free to download and makes visualising and testing responsive websites much easier. The engine and user interface are identical to that of the Opera smartphone browser, but it integrates the useful keyboard shortcuts and command-line flags available to desktop programming.
When testing a site, you can view it exactly as if you were looking at it through a specific device. From Amazon Kindles to HTC phones to Samsung tablets, it will automatically change the resolution and zoom settings so you can experiment with a range of devices. Enter the URL of the site or drag it into the window, and it will open as a separate pop up for you to test. Trackpad users will be able to tap and zoom in the same way that you would on a smartphone, or else the same commands can be achieved with a mouse. You can also manually resize the window if you would like to check how well the website responsiveness works and how different elements on it behave. For those not worried about resizing, there is a simple button to switch between landscape and portrait.
The Emulator can also be used for more powerful experiments and debugging, and connects to Opera’s Dragonfly debugging software that allows you to check the core browser code and understand why certain things are behaving as they are.
For anyone designing a responsive web site, Opera’s Mobile Emulator is worth a look.
Free Expert Online Marketing Tips
Sign up to Avatar's monthly newsletter...