New Web Standards support in Opera 11.10 beta

, , , ,

So many new features!

This is a season of plenty. Recently, we already announced an HTML5 parser labs build, and a WebGL and Hardware acceleration labs build. And now, we are happy to bring you the Opera desktop 11.10 beta, which includes support for several new web standards goodies. Let's take a look.

Multi-column text layouts

Designers have always wanted a way to elegantly organize their text layout into columns, something that is impossible to do using positioning or floats without hard-coding column breaks, therefor rendering it useless for sites with a lot of dynamic content. Fortunately, CSS3 has come to the rescue with the Multi-column Layout Module, which allows us to easily split content into a column structure and control the flow, break and spacing of the columns. Molly E. Holzschlag shows us how to use this functionality in her CSS3 Multi-column Layout Dev.Opera article.

For a quick demo, check out Vadim Makeev's beautiful Multicolumn newspaper demo.

Linear gradients

CSS3 linear gradients (part of the CSS Image Values and Replaced Content Module Level 3 allows us to easily create colour gradients, and alpha fading effect if you include RGBa or HSLa colours. This rocks, as we no longer need to rely on images for subtle shading, buttons, and other common web site features. Chris Mills explains the ins and outs of CSS3 linear gradients in his new Dev.Opera article. Note that Radial gradients are not yet supported, but they are coming soon!

I have created an interactive flower demo showing linear gradients fading in and out, and Vadim has created a rather fine Apple buttons demo employing gradients.

WebP

WebP is a new open lossy image format proposed by Google, ideal for graphics on the web. We are proud to bring native support for this format into 11.10 beta.

You can create WebP images using Google's WebP converter tool.

Speed Dial enhancements

The HTML5 specification says that the rel attribute now accepts the icon value, which you can take advantage of for providing custom Speed Dial icons for your pages. You can also further style the icons using the view-mode:minimized media feature in your CSS, the X-Purpose HTTP header, and autoreloading. Read about all of these in more detail in Tiffany's Make your site shine in Speed Dial article.

Improvements to Opera Extensions

Opera extensions are a runaway success, and we're seeing now 20 new submissions every day. With the release of the URL Filter API in Opera 11.10, web developers can now build extensions providing more control over access to different domains. Site blocking with Opera’s URL Filter API article by Daniel Davis explains this in more detail.

Also, to coincide with the new beta, Christian Magnus Sinding-Larsen has provided a guide explaining how to create effective Opera Extension icons.

If you are new to Opera extensions, we recommend starting from this handy quick guide, which has all pointers to relevant documentation, articles and examples, allowing you to get started straight away.

WOFF

The Web Open Font Format (WOFF) — backed by Opera, Microsoft and Mozilla — acts as a container for TrueType and OpenType fonts, reducing file size, and allowing designers to include extra information with the font such as font licensing info and the like. My Introducing WOFF article shows you more, including how to create and use WOFF fonts.

Have fun!

As always, feedback from our users constantly pushes us to make greater products. If you find any bugs, please head over to our Bug Tracking System and report them. Leave a note or comment and tell us what you like (or dislike) about 11.10 beta. Have fun!

Web Anywhere: Mobile Optimisation With HTML5, CSS3, JavaScript (Bruce's SxSW/ BigM talk) Opera Developer Relations Team April events

Comments

t7yang Thursday, March 17, 2011 8:39:04 AM

still a lot of problems when using opera 11.10 beta surfing on the web
but nice to see the new speed dial feature release
cant wait to see you on march 25 at taoyuan YZU lol

Zi Bin Cheahzibin Saturday, March 19, 2011 11:54:49 AM

t7yang,

See you around! smile

Unregistered user Saturday, March 19, 2011 4:07:35 PM

John May writes: How to change speed dial to 11.00 form?

Cutting Spoonhellspork Sunday, March 20, 2011 2:34:48 AM

They're still working on some features of the Speed Dial. You can use zoom to set size of the boxes.

Unregistered user Monday, March 21, 2011 12:31:40 AM

Anonymous writes: how come i cant look inside books on amazon.com when using opera, but i can when using chrome/firefox? this is an important feature for me.

Martin RauscherHades32 Monday, March 21, 2011 2:27:46 PM

Originally posted by anonymous:

Anonymous writes:

how come i cant look inside books on amazon.com when using opera, but i can when using chrome/firefox? this is an important feature for me.


Complain with Amazon. If you set Opera to mask as Firefox it works...

Zi Bin Cheahzibin Tuesday, March 22, 2011 12:53:58 PM

Originally posted by anonymous:

how come i cant look inside books on amazon.com when using opera, but i can when using chrome/firefox? this is an important feature for me.



Opera is aware about this and masking as Firefox works which means that we are given a different set of code.

I encourage you to bring this up to Amazon.

Charles SchlossChas4 Wednesday, March 30, 2011 1:51:10 PM

up

Write a comment

New comments have been disabled for this post.