Skip navigation.

Slightly ajar

Posts tagged with "kestrel"

Another option for animation

Sunday, 16. September 2007, 16:22:43

, , ,

Traditionally if we've wanted to use animated images we've been stuck with one option - the animated gif. There has also been Flash (or movie formats for that matter) if you can get away with using a plug-in. A gif has certainly been the only option if one wants to add a decorative image in CSS. Since the latest weekly of Opera Kestrel, another option has been added - APNG. This was first proposed and implemented by Mozilla and should be available in Firefox 3.

I've got some mixed feelings about this, as the PNG group rejected APNG and it apparently breaks the original intent of the PNG spec. However it does give web developers more options, where gif files are not the best choice or give the best quality, and giving APNg its own MIME type et al would mean that it wouldn't fallback to the first frame of the animation for none-APNG aware browsers.

SVG will eventually be a third option for animation, for suitable vector style images. No browsers currently support animation in CSS, as while Opera is the only browser to support animated SVG and SVG in CSS, it doesn't currently support both combined. It would be nice to get this support in the future, so we can do animated roll overs for example. It does support animated SVG in the img element though.

Check out these demos to see APNG in action. At the time of writing you need Opera Kestrel or Mozilla Minefield.

25 comments

SVG: The race to 100% compliance

Tuesday, 11. September 2007, 21:58:11

, ,

During the development of Kestrel, I was hearing of the advancements in our SVG support. Not being a SVG person I wasn't familiar with everything that was added, but I was interested in checking out the W3C SVG test suite to see how our progress was doing. Being a W3C test suite, it looked both intimidating and time consuming so I never got time to run through the tests. Fortunately I didn't have to, as Jeff Schiller took the public Alpha through its paces and updated his support graph.

I'm not sure if this includes SVGT 1.1 or just SVG full 1.1 (I suspect the latter), but Kestrel has improved Opera's support to 93.4% of the test suite. That makes it not only the most compliant browser, but also the most compliant user agent full stop, even beating the impressive Batik 1.7. The closest browser is Firefox 3 with 58%. Now we have full CSS3 selector support, I'm looking forwards to the race to full SVG compatibility, and I think Batik will give us a good run for our money. It's a shame Jeff's chart doesn't show the tests that fail for each browser.

I've heard a number of web developers complain about Opera focusing on SVG, but there is a few reasons for this and it doesn't effect our other work, and I certainly agree it shouldn't be our primary focus, but:

  • We have different developers that work on different areas, so working on SVG isn't taking people off JavaScript or CSS layout for example
  • SVG was often a carrier requirement for inclusion on mobile devices, and is much more useful and widespread in the mobile world, than it is on desktop.
  • It is a standard that shows promise once support is widespread, and if we are going to do something, we are going to do it properly
  • SVG is very useful on things like device projects where Opera is the interface to the device using WebUI. Think games consoles for instance
  • Other browser vendors like Safari and Firefox are adding SVG support and it shouldn't be too long before get good quality cross browser support. IE will be the problem, and in that way it will be similar to the PNG situation pre IE7, but IE is under active development now and they have a great team, so I wouldn't rule them out.

Now Opera has good compatibility with SVG, developers can take it for a spin and start learning the basics of SVG in preparation for the future. I recommend to start looking at using it for background-images in places that degrade well without the image, such as the gradient example two posts ago. Once Safari and Firefox add support for SVG through CSS you can start using this technique across browser, and send a rasterised png/jpeg version to IE through conditional comments. The size and bandwidth savings should be quite substantial, the scaling is much better and it is so easy to edit the file if you want to change the colour, edit the gradient etc. The possibilities of adjusting the image through the DOM should be fascinating too (rotate a arrow bullet on-click in a tree list for example) , but this wont be so easy to do fallbacks for IE.

8 comments

Some demos to check out Kestrel's new capabilities

Wednesday, 5. September 2007, 20:45:03

, , , ...

You may have downloaded Kestrel by now, and glanced at the change log, but you may not have tested out its new capabilities. I don't profess to be a JavaScript expert, so I'll leave that to those of you who know better, but I've cooked up some demos of the new CSS and SVG capabilities along with an article explaining them. That article is now ready, so please go and check it out.

For those of you who want to go straight to the examples (some modified from previous demos on this blog), here they are:

This article and demos have just scratched the surface. There is a lot to look forward to with our new JavaScript engine, improved DOM support, more HTML5 and canvas, and a more complete SVG implementation including partial SVG 1.2 Tiny support, and more. If you've been experimenting with Kestrel and have tried out some of the new features, share your examples and experiences in the comments. Hope you enjoy the article.

17 comments

Kestrel spreads its wings on test flight

Tuesday, 4. September 2007, 13:43:30

, , , ...

Earlier today Opera Kestrel finally took its first test flight outside the Opera offices. There have been a number of new features added, but the big news for developers is the updates to the engine that went into making Core-2.

As Kestrel is just in Alpha, Core-2 isn't quite finished yet. There will be further bug fixes, and possibly feature enhancements before it goes golden. Now is the time to give feedback if there are any major bugs that are affecting you, or engine features that you can't live without. Regressions are particularly important to fix.

I'll leave you to play with the Alpha, while I finish up the article and demos of some of the new features that I've been playing around with. There is a lot to test out, such as JavaScript getter and setters, SVG through CSS, getElementsByClassName, CSS3 Selectors, overflow improvements, text shadows, background-size, HTML5 enhancements and many more.

You can download Kestrel here and also check out the latest beta relese of Opera Mini while you're at at.

4 comments

Selectors complete, what next?

Sunday, 24. June 2007, 23:50:45

, , ,

On this blog I've mentioned quite a lot about CSS3 selectors. You might have noticed that the official Opera desktop team blog recently announced that Opera Kestrel has completed and enabled full selectors support. This also means that Opera Mini 4 should have full support by launch and the Wii browser will likely also benefit from this. Now I ca put to bed talking about selectors, what else is on the horizon? Well, there is certainly a lot more CSS3 that we can work on, including some very interesting things like multiple background images, border-radius, multi column layout, web fonts (a particular favourite of Håkon, our CTO and father of CSS) etc. I can't promise support for any of this, but we are listening to designers and developers, so it'd be interesting to see which CSS3 properties are most wanted.

Away from CSS, our SVG continues to improve, cementing Opera's place as the most compatible browser for SVG rendering. I believe we are still the only browser that supports SVG animation. Being able to use SVG from the img element and from CSS is a particular favourite of mine as it leads to some interesting scaleable design techniques, such as using SVG as a background gradient, or bullet point icons that don't go jagged when zooming into the content. Because SVG isn't as widely implemented as CSS (read no IE support and no official Safari release until Safari 3 comes out ), there isn't as much talk about it as CSS, and I don't think that Opera perhaps gets as much publicity as it deserves for our stellar support (do a Google search for SVG). Maybe it is time we made a svg.info site.

As a Mac user, what really excites me is the news that Kestrel will get an improved theme and interface for Mac. I'm not a big fan of the current look, so the improvements will be welcome. Even as an insider, I've not seen these changes yet, so i guess I should start digging into the internal builds.

20 comments

Squashing bugs on the road to Kestrel

Monday, 26. February 2007, 15:59:58

, ,

As the build numbers roll on in the development of our next major release, there is some good news on the long standing bug front. When talking about standards support in Opera, many people bring up the example here of a bug Opera has had since version 7. This test page shows that Opera has a bug where when margin or padding has a value of over 20.47ems, Opera has a rounding issue that rounds all decimal places above that to the next whole number. The great news for all web designers and people that like to bring up this bug, is that in the latest builds of Kestrel this is now fixed. A screenshot of this in action can be found here.

Thanks to Tim Altman for pointing out this bug fix on his blog.

Now this is fixed what other bugs cause you the biggest pain when trying to get your sites working in Opera? I'd like to push to get the issues that cause the greatest problems fixed as soon as possible.

17 comments