Opera's Developer Relations Team - SVG Web Fonts kung fu

SVG Web Fonts kung fu

By Zi Bin, Cheah. Sunday, 6. September 2009, 13:02:47

In conjuction with Opera 10, we have introduced seven Web Fonts showcases and other cool stuff in the Opera 10 experience.

Today, I've made a Web Fonts+SVG image tribute to Bruce Lee - the martial artist. The SVG image is edited in Inkscape, and retouched in a text editor to add animation using SVG element such as animate and set.

The text (including the background text) are all web fonts and hence selectable.

Bruce Lee SVG showcase
Bruce Lee SVG download

image: screen capture of the original SVG.

@font-face Web Fonts resourcesOpera at d.Construct 2009, September 3-4 2009!

Comments

thobi # 7. September 2009, 10:14

looks great. especially in FF3 *lol*

good work!

Omega Junior # 7. September 2009, 12:57

The background lettering and the foreground words 'Bruce Lee' didn't load...

Opera 10, build 1750.

Anonymous # 7. September 2009, 15:09

Anonymous writes:

OmegaJunior :

My Opera 10 loaded fine, though it takes awhile to load the chinese web fonts, since the fonts are 10mb.

Charles Schloss # 7. September 2009, 21:24

Loads fine, just have to let it download the full file

Omega Junior # 16. September 2009, 19:00

I let Opera load until it gave up.

Charles Schloss # 16. September 2009, 20:07

It is a few megabytes in size so it may take a while

Zi Bin, Cheah # 18. September 2009, 09:31

The chinese font size is a few megabytes.

This is potentially a challenge for web fonts to be implemented on language type that requires big font size(such as chinese in this instance)

Omega Junior # 22. September 2009, 10:38

Yes, a challenge it is. I like SVG for several reasons. Bloating an image with font vectors is a disadvantage. Options include avoiding adding superfluous vectors (instead of adding the whole font) and reducing the amount of detail required (the font lives in the background and thus can do with much less detail).