Opera 10 alpha out, with loads of new features for the designers.

Jazajay

Active Member
Please note: This is an Alpha release, not even a beta, and is for web developers and designers to report bugs. Please, please, please do not use it for general web browsing only test it out on trusted sites ie: yours, as I imagine there will be a few security flaws they have to fix.

Hay guys and gals Opera 10 Alpha is out.
Good news it has support for ~

1. Imported web fonts: So now you can use any web fonts you want, all you have to do is just referance the file on your server. No need to create image files.

To use it, as far as I'm aware of, you need to declare it then use it. So something like this would do it ~

@font-face{font-family:yourFontName;src:url("path/to/font/file.otf")}
body{font-family:yourFontName}


All the text would then be displayed in yourFontName.

2. SVG support: I haven't tested it but an SVG, or Scalable Vector Graphic, will do just as it says on the tin it will scale appropriately.

So for example in a normal pixelized image, be it png, jpg or gif, of say 100 by 100 pixels and you give it a height of say 200 by 200 pixels, and you are not using a server side image libary to re-scale, it would become all distored, however with an SVG img the image would double in size and still maintain it's sharpe looking image with no distortion.

As far as I know Firefox3 and Safari 3 both allow you to use SVG images, as far as I know that is cant say I have tested it in them.

3. And opacity through, get this, both RGBA and HSLA.

RGBA if you do not know stands for Red Green Blue and Alpha.
What this does is allows you to add an alpha channel to your colouring so you can now set the transparancy of the colour/background-colour via Opera's Pesto rendering engine, instead of having to create an image to do it.

HSLA, now I'm a bit scetchy on this TBH so if I'm wrong and some one would like to correct me please do, but to my knowledge stands for Hue, Saturation, Lightness, and I assuming, Alpha values. I could be wrong on that.

Any way it gives you a better way of displaying colours on your web pages than the hexidecimal way IE: color:#FFF ~ white.

Now I'm pretty sure that this has been around since Opera 9, but the RGBA is new.

The good news is that Firefox3, Safari3 and now Opera10 also all support both of them so IE can go backwards compatable and you can get the same effect in those 3 without having to create images.

It has also passed the Acid 3 test with a perfect 100/100 score, but I'm again, pretty sure so did 9, so it is at the moment by far the most W3C standardized broswer.

Any way check it out for yourself if you want to ~ Opera Web Browser | Faster & safer | Download the new Internet browsers free

However again please be aware it is not for general use, as of yet, so please don't start using it as your main browser.

Jaz :)
 
Thanks for the update on that Jaz, the font feature and SVG support sounds exciting! Will be interested to see how these features affect bandwidth. Will also be interested to see how they propose designers/developers develop sites with these features, as I'm assuming you would then need another version of the site for older browsers?
 
Well at the moment if some one is using Firefox 2 and you use ~

@font-face{font-family:yourFontName;src:url("path/to/font/file.otf")}
body{font-family:yourFontName, Verdana}


What should theoretically happen is, as Firefox 2 wont understand the font-face rule setting the file to include, and thus wont understand yourFontName either, it should default to the back up font, in this case Verdana, for any older browsers.

Opera 10 though is going to be set to automatic update which is what should of happened from the off accross all browsers IMO.

Now I know IE has been able to use the @font-face rule since IE6, but they support a different font type, .eot I think I'll have to look it up to be sure, so technically to cover IE you should theoretically be able to display a seperate 1 for IE but in the differant format not sure though TBH, haven't tested it but it sounds logical.

Some thing like this should theoretically do it ~
@font-face{font-family:yourFontName;src:url("path/to/font/file.otf")} //all browsers except IE
@font-face{font-family:yourFontName2;src:url("path/to/font/file.eot")} //Same font in a differant format for IE browsers
body{font-family:yourFontName,yourFontName2,Verdana}


What then happens in the body is precedance takes over, All browsers that undertand the .otf format should get the first rule, IE shouldn't so should get the second, if they don't understand either they get Verdana.

If that doesn't work, setting it in a conditional comment for IE would, and you would be able to set it that way.

The good news is though that any font can now be used cross browser, you do not have to worry about it not being displayed in some browsers, well when Opera 10 comes out of Beta in mid-late 09 you will.

Now yeah with SVG graphics you would have to either use a browser sniffer to detect the version number and thus give a seperate image extention, and width and height as well, if it did not support the SVG format, or just sod them off all toghter.

But it is a step in the right direction, now if Opera would just implament the bloody rounded border corners I could implament it in all browsers rather than Opera getting a squared border appearance on the design, or no rounder corners and flush to the top of the page.

Any way I'll just have to wait a bit longer for the Opera team to get round to it.

Jaz
 
Thanks for the info Jaz, interesting stuff! Will be keen to see how this browser goes down with designers/developers/general public, all this competition in the world of browsers is really starting to push the developments for features, which can only be a good thing for everyone involved!
Greg
 
Hay I was just talking to br3n on another thread and he found this .tiff to .eot converter.

Should be worth having a look at, all you need is the .tff file and you should be good to go x-browser.

Haven't tested it yet, but from what I have read it should work.

Spot on Br3n.

Jaz

PS: Is there a reason Opera is in red, when I first viewed this thread. Just thought it was a tad weird.

O don't worry I found this thread via the search function, must highlight my search terms, huh nice touch I may re-reverse enginer it, didn't think of that TBH. Very good useability concept.
 
It will be interesting to see how the type foundries react to this. Might get a bit upset when you make your portfolio, and embedd Univers, and then everyone can check out your css and download it.
 
How is this legal? I guess if you protect the fonts like you can do with SIFR it would be ok but is that possible with this method?
 
Back
Top