Diaries
Learning XML
Posted by posutoman apropos on Sat May 3rd, 2008 at 15:19:18 BST
Phew
Posted by ksarin apropos on Fri Apr 25th, 2008 at 00:12:38 BST
Time has come to revamp the web
Posted by chubbymoth apropos on Thu Apr 24th, 2008 at 07:46:46 BST
After several years of waiting for SVG to reach some maturity and decent interpreters I think the time has finally come to start using it as a designer. There are a lot of problems still to overcome as the situation currently reminds me of my first encounter with HTML v 2.0 in 1994 and the problems of the differences in interpretation by the various browsers.
SVG promises to finally open the web to the designer without any of the limitations a glorified content fot HTML format like Flash had nor the limitations posed by MS XAML. Platform independent design has finally reached the community and I expect great things to happen on the web due to that.
I regard SVG still to be at it's infancy, but at least it has some useability now that will allow me to finally create pixel precise and scalable content that can be browsed by search engines edited in an instant and use the full potential of AJAX. I was greatly impressed by the work on SVG Draw that I found at pilat.fr
Let's face it, SVG has some strong enemies in both Adobe that has devised a SVG parser and made it unusable by diverting from the standard while biding it's time to buy Macromedia and Microsoft that is going to try to hijack the Web with XAML where it failed to do so with HTML.
As soon as there are some truly impressive SVG sites to show on the web and tool to create content reach some level of maturity that make them truly useable to create interactive content I expect a true explosion of colour and interactivity on the web pages, that until now have always been rather primitive copies of newspapers.
SVG will allow the designer to concieve new ways of showing content and maintain a logical structure of interaction for his user interface that totally eludes the boundaries of the HTML page and the viewport we're so accustomed to.
This time I inted to be part of that revolution and will try to post on a regular basis.
My special thanks goes to Stefan Goessner and Michel Hirtzler, whom decided to give access to their very well and clear written book on e-learning some time ago that enabled a cheapscate like me to finally get some good information on how to produce and handle SVG.
It prevented me from having to buy loads of books on the topic of SVG that probably like their HTML counterparts would render a 1 in 10 useability. Apart from that few books have seen the light lately and the info found in them can be a bit outdated.
Tools I currently use are Opera, Firefox and yes MSIExploder. The former two because they're good, the latter one,.. ah well,.. you know why. Sight.
Apart from that I use Inkscape which with the 0.46 version has become a truly useable tool, notepad++, Scribus, OO and a host of trialware that remind me of the buggy days of old.
I'm looking forward to see the first Python driven SVG capable CMS as I think that would greatly improve the interaction with all the Python driven open source software.
If you happen to have the desire to create just that next best thing to Cheese, I'll gladly offer my services to create some smashing graphics and UI for it. More of a hacker than a coder though.
SVG and Me
Posted by spiderman apropos on Wed Apr 23rd, 2008 at 17:34:08 BST
Hello to anyone that finds my online diary - my first online diary, to be precise!
I am currently writing a report for uni regarding 2-D and 3-D modelling, and how it interacts with the real world and behind-the-scenes solutions such as 3-D Max. In browsing through the W3C's SVG page, I became a little more interested. I started reading more into SVG, what it is, and what it does, and have now integrated SVG into my report, which I will publish online after it's been officially submitted and registered, I'll post another diary post to keep you all updated as to when/where it will be available. I am particularly interested in the future of SVG, as from my research I can see the following behind SVG is vastly increasing, especially with the support of the Adobe suite. I'd be interested to hear others' members of the SVG garden's views and opinions on the future of SVG - is SVG the future?
Thank you.
Susshi
Posted by sewkii apropos on Wed Apr 23rd, 2008 at 13:13:42 BST
http://www.susshi.org
http://www.parmaktube.com
http://www.apbtr.org
http://www.wowdylan.org
SVG Page on W3
Posted by windychat apropos on Tue Apr 22nd, 2008 at 12:56:53 BST
I noticed the SVG page on W3 has not had a new topic for a few months.. just curious what's going on with that.
Windy Chicago
the future of web graphics
Posted by quasimoto apropos on Mon Apr 7th, 2008 at 15:55:44 BST
However, in many ways this reliance on GIFs is just a historical accident as the format is by no means ideal. The body in charge of independent web standards, the World Wide Web Consortium (W3C), recognised as much and its Graphics Activity group helped develop a new dedicated Web bitmap format, PNG, with features such as better compression, ICC support and alpha transparency. Support for PNG is now growing, with the latest Navigator and Explorer supporting the format natively, but it will be a long time before PNG becomes the premier Web image format. In fact before that happens PNG is itself likely to be superceded.
This new Web image standard will be radically different to both GIF and PNG as it won't be based on pixels at all but rather on vectors. The two main benefits that vector images offer over bitmaps - small file sizes and resolution-independent scalability - become absolutely compelling within a Web environment where download times are crucial and viewing platforms vary dramatically. The advantages of vectors for the Web are so clear that a number of developers have already tried producing their own solutions such as Corel Xara's WEB and Deneba Canvas's Colada CVW files. The classic example of the use of such formats is the embedded map where browsers can zoom in on the image without loss of quality and with a download considerably smaller than the comparable fixed-size bitmap.
Corel Xara
Corel Xara offers vector export but without the necessary plug-in browsers aren't able to see it.
The benefits are obvious but so are the problems. To be able to view such formats the browser must either go to the trouble of installing a dedicated plug-in or have Java-based viewing available and enabled, otherwise they won't see a thing. Clearly what is needed is a universal independent standard that both graphic applications and browser developers can support natively and which can therefore deliver the critical mass necessary to ensure the format takes off. Cue the W3C. Back in Spring last year the W3C Graphics Activity group signalled that having finalised PNG they were ready to tackle a new Web-optimised vector format and that they were open to suggestions.
A couple of technical CAD-inspired formats were considered but the two major submissions were Adobe's PGML (precision graphics markup language) and Microsoft's VML (vector markup language). The two options were very different in many ways with PGML stressing output quality based on Adobe's Postscript and PDF know-how while VML stressed the importance of re-editability based on Microsoft's Office 2000 experience. What connected both formats though was that they were both conceived of as varieties of XML. In other words, rather than being traditional binary files, both PGML and VML are text-based languages acting to describe graphics in the same way that HTML describes web pages. This has a range of knock-on advantages, as we'll see, but the immediate consequence is that it made it relatively straightforward to combine the best of both approaches into the new W3C-approved Scalable Vector Graphic standard, SVG.
At the time of writing the SVG format still has to be finalised and approved but the working drafts posted on the W3C site over the last year make it clear how the format will work. Each SVG graphic is contained within a top level svg element which will enable an alternative bitmap to be shown for non-supporting browsers. Within the SVG the vector graphic will be built up with rect, circle, ellipse, polyline, polygon, and line elements with irregular objects handled with the all-encompassing path. Shapes can be nested and grouped into g elements and, crucially, these can be named and reused. The formatting of these objects is controlled through fill and stroke-based paint operations and again groups of parameters, such as gradients, can be named and reused. Best of all, wherever appropriate such formatting conforms to CSS and can be controlled on a global page level.
Putting this all together it's possible to see how a SVG will operate in practice. By centring text over a semi-transparent circle on a rounded rectangle you would have a simple button template. By naming this as a group it could be repeated as many times as necessary with just the overlaying text altered. By embedding each svg within a anchor tags you could produce all the navigation buttons you need with minimal effort and minimal download. Best of all the buttons would remain live and open to styling. Using a master CSS style sheet you could instantly change the colour of the button elements and text typeface automatically across an entire site!
This is huge power in a different league to scalable maps. Effectively you would have the restyling control offered by a dedicated web graphics program like ImageStyler but all available and controllable from a CSS style sheet. Best of all there would be no need to go through the current bitmap-based GIF route so that bandwidth demands could be cut to a fraction. It's no coincidence that today's major dedicated web graphics applications - Fireworks, Xara and ImageStyler - are all vector-based drawing programs optimised to output bitmaps. With SVG you could entirely cut out the bitmap middleman and keep the size and flexibility benefits of vectors throughout the production process from creation to viewing. Throw in the support of Microsoft, Netscape, Adobe, Autodesk, Corel and Quark and you can see that SVG is set to take the world of web graphics by storm.
SVG could offer the vector and restyling benefits of Imagestyler without the need for a bitmap middleman.
But hang on - hasn't something been forgotten in all this? You would never know it from the W3C deliberations - where the name is never even mentioned - but of course there already is a web vector standard out there: Macromedia's Shockwave Flash format, SWF. This isn't an XML-based language but a more traditional binary format that is embedded in the HTML page through object and embed tags rather like the GIF binary is through the img tag. However that's where the similarities cease as Flash is much, much more than just a GIF replacement.
Flash has always recognised that another of the benefits of vector shapes over bitmapped pixels is that once an object has been described all you have to do to animate it is to describe a path or other transformation. In other words all-action movie files are only marginally larger than static images and both are much smaller than their GIF equivalent. Building on this core animation strength Macromedia has added a level of interactivity that in the latest Flash 4 even offers conditional processing. Even better are the multimedia features with excellent streaming MP3 sound and video support for QuickTime 4 movies. Taken together it means that, in comparison to a simple GIF or SVG button, Flash can offer a fully scalable, interactive animated character complete with lip-synched speech and background music!
Flash 4
Flash vector movies offer far more than static images.
Of course the downside of Flash's binary SWF format is that it needs the Flash player to be installed to be viewable. But even this is no longer a huge problem. The benefits that Flash offers are so vast that the Flash player is a must-have download if you want to be able to appreciate many of the most popular sites on the Web. As such a recent independent survey claims that 83% of browsers are now Flash-ready - a greater market penetration than Netscape, Explorer or even Java can boast. On my own site the figure is nearer 50%, but even so it's clear that Flash usage has reached a level where it becomes the browser manufacturers' responsibility to ensure that they are Flash-compatible and both Microsoft and Netscape now bundle the player with their latest releases. Critical mass has been reached.
Suddenly the future for SVG isn't looking quite so bright. Flash offers greater functionality, better compression and a larger installed user base. More to the point it actually exists whereas SVG still hasn't got off the drawing board. Worst of all what looked like SVG's main strength, its XML basis, suddenly looks like a liability. There's simply no way that a text-based description of a graphic can be as efficient as a binary representation so that a Flash equivalent of an SVG file will inherently be smaller. The obvious comparison is to VRML, the text-based virtual reality markup language for describing 3D environments. This offers considerable power but its files are simply too large and slow to have made the impact expected of it. Into the gap has stepped Metacreations with its much more efficient streaming binary format, Metastream.
Flash has been such a success that it has effectively moved the goalposts as far as vector-based web image formats are concerned. A simple vector-based replacement for GIFs won't be enough to knock Flash from its position as the de facto Web standard. So is SVG effectively dead on arrival? Absolutely not. Instead it has evolved into a completely new and radically ambitious proposal that could entirely change the face of the Web. Looking at the latest working draft submitted in July shows that SVG will tackle Flash head on.
SVG Proposal
The W3C working draft gives details of the proposed SVG format.
The first paragraph of the Introduction shows the format's new scope:
"SVG is a language for describing two-dimensional graphics in XML. SVG allows for three types of graphic objects: vector graphic shapes (e.g., paths consisting of straight lines and curves), images and text. Graphical objects can be grouped, styled, transformed and composited into previously rendered objects. The feature set includes nested transformations, clipping paths, alpha masks, filter effects, template objects and extensibility."
It's clear that the intention is to use SVG for a lot more than buttons. In particular, in addition to the vector elements described above, SVG also supports JPEG and PNG bitmaps through the image element. It's also clear that the compositing control offered over both bitmaps and vectors will be far greater than currently available with the ability to use advanced masks and alpha channels to control features like transparency. All controls available for fills will also be available for strokes which again takes SVG into new territory. Potentially most powerful of all are the filter effects which will allow bitmapped effects, such as semi-transparent drop shadows, to be applied client-side. Thanks to XML's extensibility it will also be possible to embed application-specific data to keep images live and editable and so turning SVG into an all-encompassing graphics standard.
Just as significant is the handling of text through the text element. Crucially, this is dealt with as XML character data which means that all the text in the SVG remains selectable and searchable just as it is in HTML. With the use of CSS for controlling text formatting within the SVG the distinction blurs further. In fact the SVG should be able to incorporate HTML itself as another stated aim is "to provide a frame for the HTML/CSS processor so that dynamically reflowing text (subject to SVG transformations and compositing) could be inserted into the middle of an SVG document."
The new picture of SVG that is emerging is a long way away from zoomable maps and stylizable buttons. In particular it is apparent that the full potential of SVG isn't as embedded fragments within HTML but rather the reverse with the SVG acting as the main document and containing shell. In other words, at its best, SVG will be the Web page itself. Of course this is where the scalable in scalable vector graphics really comes into its own. When the whole page including text is scalable, design can move onto a completely different level. The advanced composition controls are a huge bonus but the real difference will be that whatever device the browser is using, from handheld to 21" monitor to printer, the designer can control exactly what they will be viewing or outputting! Heaven. As the W3C puts it "this benefit to Web users as a community cannot be understated."
Scalability
The real benefit of scalability is that entire pages will look the same on whatever screen they are viewed.
In this new page design role, SVG acts like a static Flash counterpart, but that's only the beginning. The second paragraph of the W3C introduction reveals that:
"SVG drawings can be dynamic and interactive. The Document Object Model (DOM) for SVG allows for straightforward and efficient vector graphics animation via scripting. A rich set of event handlers such as onmouseover and onclick can be assigned to any SVG graphical object. Because of its compatibility and leveraging of other Web standards, features like scripting can be done on HTML and SVG elements simultaneously within the same Web page."
In other words, SVGs will be able to act much like full Flash movies. Animation will be possible thanks to a "syntax for describing simple time-based modifications on any attribute or property on any of its elements." This will enable the creation of motion path animations, fade, scaling and rotation effects and could spell the end for the animated GIF. Interactivity meanwhile becomes possible thanks to the ability to assign standard event handlers to any object or group which will enable rollover and button-based control. Even more significant is the way this is implemented through SVG DOM support which opens up every element in the graphic to scripting. As the working draft says "Every attribute and style sheet setting is accessible to scripting, and SVG offers a set of additional DOM interfaces to support efficient animation via scripting. As a result, virtually any kind of animation can be achieved, including motion paths, color changes over time, and transparency effects."
Ultimately it is this integration between the SVG proposal and other existing Web technologies such as DHTML and CSS that is the format's true killer feature and gives it the edge over the standalone Flash format. It means that the graphical elements of a Web page will no longer be seen as semi-detached add-ons but rather form its heart as a fully integrated and fully controllable part of the overall design. As other technologies such as SMIL (synchronised multimedia integration language) come on tap they will be similarly incorporated to produce an unmatchably rich Web experience in which text, graphics, multimedia, style and scripting elements are seamlessly blended. In fact it is this synergy of different technologies, all pulling together to create a product that is more than the sum of its parts, that represents the ultimate scalability in SVG.
The benefits for the end user should be immense with the Web experience finally beginning to live up to the WebTV dream. In fact if SVG fulfils its potential it might just be that HTML will come to seem like the poor relation with the richest experiences on the Web only available through SVG and the next generation of XML-based browsers. The revolution could be just as radical for creators as consumers. The days of hand-coding in Notepad will certainly be over with a new breed of truly wysiwyg XML-authoring apps combining the features of Dreamweaver, Fireworks, ImageStyler and Flash into one master program. I can hardly wait.
But of course I'll just have to. It's worth remembering that the SVG proposal hasn't yet been finalized at the time of writing and the most common sentence in it is still: "The exact mechanism for providing these capabilities hasn't been decided yet - many details need to be worked out." Even when the format has been approved there's a long way to go before supporting browsers have proved their reliability and developed the necessary user base (especially as Microsoft has steamed ahead with its own VML format in any case). Even then there's the chance that the format will be too download-heavy and slow to render to prove practical. As PNG and VRML have shown, there's a big gap between the drawing board and the real world.
For the foreseeable future then there's no question that Flash remains the web vector format of choice. Moreover, with Macromedia's moves in opening up both the SWF format and Flash player code and various hints about future XML-compatibility, there's still a good chance that SWF will see off the SVG challenge. What's not in doubt is that the Web is changing and that the designer's nightmare is definitely coming to an end. In fact, with a technology like SVG at its heart, the Web looks set to become the designer's dream - visual, interactive, animated and scalable.
Adobe plugin test page
Posted by illy apropos on Fri Apr 4th, 2008 at 11:15:19 BST
Illy from Ferienwohnung Ostsee @ Germany.
Hello
Posted by avasi apropos on Thu Apr 3rd, 2008 at 19:51:56 BST
Im Andres from Uruguay, i am a CEO of my web design company.
Happy to be here
Apache Cocoon
Posted by quasimoto apropos on Wed Apr 2nd, 2008 at 15:40:58 BST
The fall of writing
Posted by quasimoto apropos on Sat Mar 29th, 2008 at 16:14:02 BST
Permanent link to this story (1 comment)
Happy Easter
Posted by illy apropos on Sat Mar 22nd, 2008 at 21:57:32 BST
Read on for the full story and comments... (35 words in story)
The new Safari 3.1 for Windows
Posted by joeB apropos on Thu Mar 20th, 2008 at 19:32:10 BST
Moderate - Diary / Spam comments
Posted by Rushh apropos on Tue Mar 18th, 2008 at 07:26:06 BST
| Rewind to previous 15 stories... |
- Create an account
- About SVG.org
- Frequently Asked Questions
- SVG.org Content with RSS

- Get SVG Help on IRC
- SVG.Open Conferences
- SVG Phones (169 and counting)
- JSR 226 Phones (28 and counting)
- Learning XML (posutoman)
- Phew (ksarin)
- Time has come to revamp the web (chubbymoth)
- SVG and Me (spiderman)
- Susshi (sewkii)
- SVG Page on W3 (windychat)
- the future of web graphics (quasimoto)
- Adobe plugin test page (illy)
- Hello (avasi)
- Apache Cocoon (quasimoto)
| Votes: 138 | | | Comments: 12 |
| Results | | | Other Polls |
Monday March 17th
- non-geek article on SVG published (0 comments)
- Hello (0 comments)
Sunday March 16th
- Hi SVG World (0 comments)
Thursday March 13th
- Finally coming close... (0 comments)
Sunday March 9th
- an SVG Open 2008 banner (to put on your SVG site) (0 comments)
Friday March 7th
- 'patching' IE to do SVG, who helps Batik to mentor a Summer-of-code project? (0 comments)
- quickly fix this super easy bug for the greater SVG good (0 comments)
Thursday March 6th
- how to avoid spamming (1 comments)
Wednesday March 5th
- no stopping it (0 comments)
- New to SVG, hello everybody (0 comments)
