Categories
Opera blog post Web development

Web Standards, the real Flash killer

There’s changes in the wind in the world of visual web technologies, and they show a beautiful future for what might soon (and to some degree now) be possible with the use of web standards.

Specifically, I’m talking about web alternatives to that ever popular Adobe Flash plug-in. Note that I won’t be talking about Microsoft’s Silverlight here, since it has many of the same shortcomings as Flash does.

There seem to be three major ways Flash is being used today: For online videos, as a web page interface, and for web-based games. Upcoming standards being developed and implemented for each of these uses.

Categories
Opera blog post Web development

SVG Background Replacement Script

UPDATE: I’ve managed to create a working version! See here.

I’ve written this excellent script that will replace specified background images with an SVG image, whenever support for this is detected. It will go through all CSS rules looking for “filename.svg.jpg” and replace it with “filename.svg”. This should be ideal for anyone who would prefer to use SVG backgrounds whenever possible.

There’s one problem: It doesn’t work in the one browser that supports SVG background images! :doh:

Since the script does work when detecting support for/replacing, say, PNG files, I can only assume this is an issue in Opera. I have thus reported this issue in the forums.

Hopefully this will be fixed before Opera 9.5 goes final, if not, it’s back to the drawing board to write a script that’s more forgiving!

Categories
Opera blog post Web development

DS Browser image sizes

Recently I’ve been playing around with the Nintendo DS web browser. One of my discoveries was that it automatically resizes any image beyond a certain width (768px), height (768px), or dimension (307200 sq. px).

To show the actual image sizes this allows, I’ve created this handy SVG file. Easy numbers to remember are displayed, though anything that does not extend the curved line at the bottom right will work too. Additionally, this page shows all numerical options.

How is this useful? Well, the resizing isn’t too big a deal for most photographs, but if you have larger images with text on them (comics for example), they will look pretty ugly and become hard if not impossible to read. So if you care at all about your DS browsing public, you can use this information to keep your images within these limits.

Categories
Opera blog post Web development

CSS/SVG Rounded corners for multiple browsers

Here’s a demo of a div with a simple 10px radius 1px border that works in Opera 9.5, Firefox 2+ and Safari 3 beta. It uses -moz-border-radius for Firefox, -webkit-border-radius for Safari and an SVG background for Opera 9.5. The SVG file this time is actually a modified version of a new method Holger Will came up with.

Of course, it doesn’t work quite that easily. The CSS3 corner method uses a border, but for Opera we don’t want that border to appear because it already exists in the SVG file. Additionally, we’ll have to change the position and padding slightly so the border appears in the exact same place.