W3C

Do Not Steal My SVG Semantics

A few weeks ago, for designing the W3C Chairs tee, I have used a vector authoring tool, OmniGraffle.

Chairs bots

We asked me for an SVG version of the bots. Omnigraffle has an “export as SVG” feature, like many modern vector tools. I had the curiosity of looking at the source code… All my beautiful squares and circles were gone. All shapes were only defined by paths. Some shapes are rightfully defined by paths, but it should not be the case for all of them. I became curious about this issue.

When using a vector authoring tool, be omnigraffle, inkscape, illustrator, etc., for drawing simple shapes such as circle and rectangle, I use the menu.

Omnigraffle UI

These menus have a graphical semantics. There is actually a square or a circle to represent the shape. For a square, I’m not drawing 4 paths but a real square. I want the authoring tool to retain my semantics choices when possible. Imagine an HTML editor which would convert all your paragraphs in series of <br/> instead of <p>…</p> (yes those exist too). For a square in the authoring tool, I would like to have a rect inside the SVG file. For example, a 50 pixels by 50 pixels square should give:

<rect x="1" y="1" width="50" height="50"
      fill="none" stroke="black" stroke-width="1"/>

We can even go further. Many vector authoring tools have the capabilities of groups and layers. These information could be used for creating groups of shapes and/or labeling shapes with unique identifiers id or defs.

I discussed about it with Doug Scheppers, SVG Working Group Staff Contact, who is in the office in Japan these days. We don’t know any SVG authoring tools which preserve the semantics. If you know one, please leave a comment. And I said that would be part of optional or mandatory requirements of a future version of SVG for the authoring tools class of products. Doug has created issue 2178 in the SVG Working Group tracker. In the mean time, I will have to redo my bots by hands ;)

5 thoughts on “Do Not Steal My SVG Semantics

  1. I fully agree with you; authoring tool should really not loose the semantics. Note, however, a positive example: Adobe Illutrator is of course not an authoring tool but one can export SVG and this export seems to maintain at least some semantics (I did not do an elaborate test, but it certainly preserved an ellipse and a rectangle).

    1. ah! Interesting information. I think a bit of testing would be interesting for the community. Something take your favorite vector tool, draw a square and a circle, export it or save it as svg. Look at the source code and report here in the comment.

  2. It is true that we ranted loud enough that at some point Adobe fixed some of the more glaring issues, but alas Illustrator’s SVG export still has very serious bugs.

    The closer you start looking at the issue the worse it gets, too. You’ll see for instance that many tools use the style=” attribute to specify styling, which makes the content useless on mobiles and isn’t useful anyway since XML attributes for the same work just as well.

    I think that the solution is to create an authoring tool that works primarily on the semantics. It would be quite doable to build one atop today’s browsers. I have some ideas and a very trivial prototype if anyone’s interested.

Comments are closed.