Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!
  • Students Click Here

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Students Click Here


Skill Building

Why is the SVG format so darn COOL? by Triska
Posted: 8 Aug 03

For Designers:
ò  Well, for Illustrator designers, it's a great way to share our work online with others who have the plugin from Adobe, which  is also installed by default with many Adobe products.  
ò  But my favorite feature is that, you can Zoom in and Pan, which allows complex detail exploration.
ò  SVGs are real text, searchable, have font embedding controls, and can be opened and edited in Illustrator as vector art.
What is SVG? From Adobe:  http://www.adobe.com/svg/overview/svg.html
ò  SVG stands for scaleable vector graphics, an amazing dynamic, web format, that incorporates XML based markup,  a CSS parser, a full suite of SVG filters, javascript functionality, clipping paths, transparency, template based, data-driven graphics, and all the control over the  object elements in Illustrator you could dream of.
ò  JavaScript support on Internet Explorer for MAC is currently, seriously limited by browser naughtiness.

How do I author SVG with Illustrator?
The short answer is: Save As > SVG[
Long answer, Here's a PDF guide for AI9

Can I see some examples of SVG for inspiration?

A few tips for creating SVGs with Illustrator:

  1. White space: An object up and left  in relation to your art will force some margin whitespace around the SVG output, otherwise it crops tight.

  2. Headers:  Toward this end, see the actions SVGZout MyWork  & Others, for  automated header placement.  You will need to create an .ai or .svg header file and RErecord the 'Place' action to point to your new , personalized file.  The SVGZout 'Others' action/file lets users know that the work being presented IS NOT MINE, and will keep designer relations on the up-and-up.  

  3. Download all my TEK  actions at: (right-click, Save Target As, otherwise, you'll be reading script) http://www.elucidesign.com/TEK_examples/TEK_Actions.aia

  4. See an example of the above header actions output:  http://www.elucidesign.com/TEK_examples/FAQs/HeaderOutput.svgz
  5. Making a hyperlink <a href...> :  Select an object and view the Attributes palette, URLs can be specified for the selected object here.  By  opening a non-compressed .svg file in a text editor, you can add  target-"_blank" after  the "http://XXX.html"  to open your link in a new browser window.

Sef. 8/8/03

Back to Adobe: Illustrator FAQ Index
Back to Adobe: Illustrator Forum

My Archive

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close