Slightly ajar

Archive: September 2007

Open the Web World Tour

, , ,

Over the next two months or so I'll be saying goodbye to the progressively colder Oslo, and hello to a number of cities around the globe. With the conference season in full swing, I'll be off meeting web developers, (hopefully) fixing web sites, and spreading the Opera word.

First stop will be Dallas, Texas for Web Jam Session. I'm missing Texas BBQ since my first and last visit to Texas for SXSW in March. I've got a lot of catching up to do. Austin is a great city, but I've heard Dallas is very different, so I'm not sure what to expect. I've had a number of friends from Dallas down the years, but I've never made it out there yet. Following Web jam, I'm hopping over the Pacific to Sydney Australia for Web Directions South. It'll be my first time in Australia, but not my first Web Directions. I went to the fabulous Web Directions North in Vancouver earlier this year and had a great time. It'll be nice to catch up with all those Aussies (of which there are far too many to mention) involved in making the web a better place. I had hoped to take some vaction and see a bit of what Australia has to offer, but instead I'll be heading straight off to Orlando, Florida for Mobile Web Americas. Our own Jon VonT will be speaking, and we have a great mobile message to spread to the world. No rest for Disney world or the beach however as I'm straight on the plane to Mountain View, California to visit our new Silicon Valley office. I'll actually be able to have some break from the ever changing time zones and jet lag for a while. I'll hopefully be visiting a number of major web companies while there, to discuss how to support Opera better. If you work for a web company in the area and want help in supporting Opera then drop me a line and I'll see if we can organise a meeting. I should get a chance to see some of San Francisco's sites before I leave. After three weeks or so I'll be off to NYC for Future of Web Design. This will be the first city on my tour that I've been before, and It'll be great to see the place after the last time I visited in 2001. There will possibly also be a visit to Boston before NYC, but it depends how things pan out.

If anyone is in any of those locations, then give me a shout. I might not be able to keep this blog up to date for a while, depending on how conference and hotel wifi keeps up, but I'll report back every so often with how things are progressing. When I get back in mid November it is bound to be freezing here, but it'll be nice to be home and see friends again.

Another option for animation

, , ,

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.

SVG: The race to 100% compliance

, ,

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.

Short-sightedness of iPhone only development

, , , ...

The issues of designing foe one browser, never-mind one device, should be very clear to anyone that has promoted web standards and the open web. Apple themselves have made this even more clear by their latest move. They've just recently anouned the iPod Touch, with the included Safari browser. Now this doesn't suffer from many of the problems of designing for one browser or device; It has the same screen, the same engine and likely the same hardware. However, if we look at all those URLs that have been coming out in the last weeks. like digg.com/iphone, mediatemple.net/iphone et al. we have a problem. It is easy to imagine that iPod Safari users will think these sites are for iPhone only, when they'd in fact work just great on the iPod. Work great that is as long as the authors don't use browser sniffing to detect the iPhone (providing the iPod uses a different user agent string, I'm not sure). These sites will often also work great on other mobile browsers like the S60 browser, Opera Mini and Opera Mobile, but the URLs suggest otherwise.

Of course, the naming and the iPod issue isn't the only reason why it is short sighted. I've hi-lighted why one browser design is bad, in that it introduces cases where you rely (even accidentally) on browser bugs and vendor specific extensions. It may not matter to you, after all the Iphone/ipod is really hot, but it does matter to your potential customers. If we look who there are, then you'll probably see something like this:

Mobile/Handheld browser share for August 2007, as percentage of total browser market share

Data from Net Applications

  1. Opera Mini: 0.27%
  2. iPhone Safari: 0.05%
  3. PSP Internet Browser: 0.02%
  4. Series60 Browser: 0.02%
  5. Danger Web Browser: 0.02%
  6. ACCESS NetFront: 0.01%
  7. BlackBerry: 0.00%

Mobile/Handheld growth, July '07 to August '07, as percentage of total browser market share

  1. Opera Mini: + 0.03 (0.24 -> 0.27)
  2. iPhone Safari: + 0.01 (0.04 -> 0.05)
  3. PSP Internet Browser: 0
  4. Danger Web Browser: 0
  5. ACCESS NetFront: 0
  6. Series60 Browser: - 0.01%
  7. BlackBerry: Doesn't feature in July features
  8. The iPhone and Series60 figures were taken from the Operating System figures. For iPhone this will be a accurate measure as Safari is the only browser available. For Series60 it will also include other browsers like Opera Mobile. As always with statistics, take them with a grain of salt. I don't know which sites were monitored to get these figures. As they are a US based company, I'd expect (but don't know) the stats to be biased towards the US or English speaking countries, where Apple tends to be stronger. Nokia tends to be stronger outside the US and Opera Mini historically is also more popular outside the states as Mini doesn't work on Verizon phones and has had issues with T-mobile US.

    At least by these figures, Mini is not only far more popular than all the other mobile browsers (put together) but is also growing faster. This is something to bear in mind when thinking of making a device/browser specific web site, or optimisation. I'm certainly not saying to make Mini only sites though, digg.com/mini would just be as bad. Imagine how much work it would be to update and create the regular site, and a Mini, iPhone/iPod and Wii version for example. Admittedly, there is not much to go on with just two months data, and things will likely change as time goes on. The global role out of the iPhone will help its marketshare, when that eventually happens. Mini will always be available on more devices, and more carriers, and in markets where Apple doesn't focus. There are markets where devices like the iPhone will be too expensive, such as the developing world, where feature phones rule. There are a lot of people in these markets. I think iPhone will eventually get a significant percentage of the mobile market and be a major mobile browser, but I don't think it will take over the industry like it has for digital music players. Another advantage Mini has is that for the most part, the users of Mini are people that downloaded a mobile browser because they want to surf the web. For many other mobile browsers, they are pre-installed applications that people don't always use, or know what the application does. Safari wont often have this problem either as Apple will market internet on the iPhone heavily and people buying the iPhone will probably be see it as a reason for purchasing the phone. Who knows who will eventually become the major player beyond the desktop, but I don't think it will be a one horse race like happened on desktop.

Some demos to check out Kestrel's new capabilities

, , , ...

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.

Kestrel spreads its wings on test flight

, , , ...

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.

May 2013
S M T W T F S
April 2013June 2013
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31