Opera Mobile 11.1 — New Features and Additions
While Opera Mini 6.1 is primarily a security and stability release, Opera Mobile 11.1 has been updated to use the Opera Presto 2.8 rendering engine. This boosts the browser's capabilities with a whole host of new HTML5 and CSS 3 features – many of which only just made their official desktop debut in the Opera 11.50 release two days ago.
The CSS Multi-column Layout Module specification allows designers to finally create complex, print-like multi-column layouts without having to abuse
table markup. See our introduction to CSS3 Multi-column layouts and check out the slightly modified newspaper-style multi-column layout.
Session history and navigation
The HTML5 session history and navigation API allows for new ways to programmatically control and manipulate the browser's session history, save a web application's state, and handle user interactions (without breaking things like the back button). Of course, there's a recent article introducing the HTML5 History API, complete with a nifty file browsing app example.
Rather than overloading
className or adding invalid attributes to their markup, developers can now use a standardised and easy way to embed custom non-visible data with the
data-* attributes in HTML5. We've recently published an introduction to datasets that shows you how.
W3C File API
The W3C File API allows web applications to open, read and manipulate data inside local files – all completely client-side. Opera Mobile 11.1, like Opera 11.50 on desktop, currently has partial support for this API. See our article on The W3C File API for more details and examples.
classList is a new object, added to all nodes in the DOM, that provides all associated class names as a
DOMTokenList, which includes handy native methods that make these common operations a breeze.
WebP is a new image format from Google, using the same VP8 codec as the WebM video format. On average, WebP images are more than 30% smaller than JPEG files with only a minor reduction in quality, making them ideal for use in mobile devices. Beyond being able to display WebP images, Opera Mobile 11.1 will now also use this new image format internally with Opera Turbo – making it even faster on slow connections.
We now have initial support for CSS3 linear gradients. As in our desktop version, there's no support yet for radial gradients. See Vadim's Apple button menu example, part of our CSS3 linear gradients article.
Default zoom on high-DPI devices
By default, Opera Mobile used to apply a zoom factor of 160% on devices with high-DPI screens. In combination with
<meta name="viewport" content="width=device-width">
480px wide screen (on VGA, WVGA, XVGA devices), 160% zoom resulted in a viewport width of
480px / 1.6 = 300px. However, many mobile-optimised sites – despite using
device-width in their
viewport definition – still seem to assume a width of
320px (the default iPhone width) in their layouts. This resulted in an annoying
20px horizontal scroll. In Opera Mobile 11.1 we've changed the default zoom on high-DPI devices to 150%, which gives us increased compatibility with these badly coded sites.
For further details, see An introduction to
@viewport, which has been updated to reflect this tweaked behavior.
...and much more
We've only cherry-picked some of the new features in this release. For an overview of how the new Opera Mobile 11.1 stacks up in comparison to its previous version, have a look at the overview of web specifications support in Opera products and the detailed web specifications support in Opera Presto 2.8. Enjoy!