New version of "Guide to Inkscape"
Hello,
I have uploaded a new version of the book "A Guide to Inkscape".
Two new tutorials:
1. Creating a logo from a photograph with the help of auto tracing. 2. Creating an isometric projection (an idea suggested by Alain Viguier).
Two new chapters:
1. "Using the Command Line" 2. "SVG and the Web" showing how to use SVGs on web pages (including very simple linking and animation).
Additional web pages:
1. A download page for the graphics used by the tutorials. 2. A page showing the examples in the "SVG and the Web" chapter. 3. A page for testing web browser support of SVGs.
You can find all this at:
http://tavmjong.free.fr/INKSCAPE/
As always, comment are welcome.
Enjoy,
Tav
PS. Can the powers who be add this notice to the Inkscape news?
It looks like a really good guide to me. I've bookmarked it to have a look through some time.
One crit: Everywhere you call it a guide, yet the link to the guide is titled "The Manual". I think it should be "The Guide" or maybe "Contents".
RaethDragon
On 2/9/06, Tavmjong Bah <tavmjong@...206...> wrote:
Hello,
I have uploaded a new version of the book "A Guide to Inkscape".Two new tutorials:
- Creating a logo from a photograph with the help of auto tracing.
- Creating an isometric projection (an idea suggested by Alain
Viguier).
Two new chapters:
- "Using the Command Line"
- "SVG and the Web" showing how to use SVGs on web pages (including
very simple linking and animation).
Additional web pages:
- A download page for the graphics used by the tutorials.
- A page showing the examples in the "SVG and the Web" chapter.
- A page for testing web browser support of SVGs.
You can find all this at:
http://tavmjong.free.fr/INKSCAPE/As always, comment are welcome.
Enjoy, Tav
On Thu, Feb 09, 2006 at 12:48:11PM +0100, Tavmjong Bah wrote:
Hello,
I have uploaded a new version of the book "A Guide to Inkscape".
This is excellent stuff - bookmarked & forwarded to a bunch of people who aren't on this list.
I worked my way through the first four example tutorials last night, and learned a bunch of good stuff! The soup tin/gradient tutorial should be useful, because gradients are still a mystery to me...
Thanks from me too,
Brian.
Tavmjong Bah wrote:
Hello,
I have uploaded a new version of the book "A Guide to Inkscape".
Two new tutorials:
- Creating a logo from a photograph with the help of auto tracing.
- Creating an isometric projection (an idea suggested by Alain
Viguier).
Two new chapters:
- "Using the Command Line"
- "SVG and the Web" showing how to use SVGs on web pages (including
very simple linking and animation).
Additional web pages:
- A download page for the graphics used by the tutorials.
- A page showing the examples in the "SVG and the Web" chapter.
- A page for testing web browser support of SVGs.
You can find all this at:
http://tavmjong.free.fr/INKSCAPE/
As always, comment are welcome.
I have comments on http://tavmjong.free.fr/INKSCAPE/MANUAL/html/ch16s01.html. First of all: good work! Now on to the comments...
1. your examples are probably the wrong way round; put the <object> example first because it's simpler. You assert that it is 'cleaner' but I don't agree: when it comes to DOM scripting, the mixed namespace approach is more orthogonal and therefore cleaner. It is not possible (AFAIK) to use DOM scripting with the <object> approach.
2. I suggest a third example: this is the same as the second but uses prefixes rather than changing the default namespace. For some people, this might seem clearer, for others less so. It's worth showing both techniques to aid understanding. It's probably also worth drawing a comparison with the way one might use Xlink and MathML.
<?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg"> (1) <head> <title>SVG Embedded into an XHTML File</title> </head> <body>
<h1>An SVG rectangle (via Namespaces)</h1>
<svg:svg (2) version="1.0" width="150" height="150" id="svg1341"> <svg:rect width="90" height="90" x="30" y="30" style="fill:#0000ff;fill-opacity:0.75;stroke:#000000;stroke-width:1px" id="rect1353" /> </svg:svg>
</body> </html>
Inkscape doesn't produce this way of embedding SVG. Also, my version is actually slightly simplified (by hand) over what Inkscape produces.
More information on SVG and HTML is here: http://wiki.svg.org/SVG_and_HTML http://wiki.svg.org/Inline_SVG
Finally, there's a demo here http://jwatt.org/svg/demos/xhtml-with-inline-svg.xhtml of using inline SVG that also works in IE (except for DOM scripting). It might be worth your article summarising this technique.
Regards, Rick
On Wed, 2006-02-15 at 15:13 +0000, Rick Beton wrote:
I have comments on http://tavmjong.free.fr/INKSCAPE/MANUAL/html/ch16s01.html. First of all: good work! Now on to the comments...
Thanks!
- your examples are probably the wrong way round; put the <object>
example first because it's simpler. You assert that it is 'cleaner' but I don't agree: when it comes to DOM scripting, the mixed namespace approach is more orthogonal and therefore cleaner. It is not possible (AFAIK) to use DOM scripting with the <object> approach.
Hmm, You might be right I should swap the order.
Perhaps "cleaner" isn't the right word. It certainly is easier if one doesn't want to do scripting.
- I suggest a third example: this is the same as the second but uses
prefixes rather than changing the default namespace. For some people, this might seem clearer, for others less so. It's worth showing both techniques to aid understanding. It's probably also worth drawing a comparison with the way one might use Xlink and MathML.
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg"> (1) <head> <title>SVG Embedded into an XHTML File</title> </head> <body>
<h1>An SVG rectangle (via Namespaces)</h1>
<svg:svg (2) version="1.0" width="150" height="150" id="svg1341"> <svg:rect width="90" height="90" x="30" y="30" style="fill:#0000ff;fill-opacity:0.75;stroke:#000000;stroke-width:1px" id="rect1353" /> </svg:svg>
</body> </html>
Inkscape doesn't produce this way of embedding SVG. Also, my version is actually slightly simplified (by hand) over what Inkscape produces.
I will add this example in the next version. As you mention, Inkscape doesn't support writing files with the svg prefix. It would be nice to add as an option. Speaking of the svg prefix, it seems to me that the "plain" svg output that Inkscape produces is wrong. Am I right that there should be one, and only one of the following two lines:
xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
in an SVG document?
More information on SVG and HTML is here: http://wiki.svg.org/SVG_and_HTML http://wiki.svg.org/Inline_SVG
Good links!
Finally, there's a demo here http://jwatt.org/svg/demos/xhtml-with-inline-svg.xhtml of using inline SVG that also works in IE (except for DOM scripting). It might be worth your article summarising this technique.
I am not sure how in depth I want to get with using SVG on the web as that is not the focus of the book. On the other hand this technique is quite useful knowledge. I probably will add it.
Thanks for your comments,
Tav
participants (7)
-
Brian Burger -
Karol Krenski -
leon -
Raeth -
Rick Beton -
Tavmjong Bah -
Tobias Hilbricht