Sams Teach Yourself SVG in 24 Hours

Sams Teach Yourself SVG in 24 Hours

by Micah Laaker
Released February 2002
Publisher(s): Sams
ISBN: 9780672322907

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

Sams Teach Yourself SVG in 24 Hours provides a thorough understanding of the technology, complete with working examples and practical answers to common development questions. The book focuses on how to create imagery in SVG for static and dynamic graphics. Readers will learn: SVG fundamentals; how it compares to other technologies, including Flash; Manipulating SVG; painting with SVG and using effects; Bringing SVG to life; understanding animation; Text and typography; Efficient coding techniques; Understanding how to integrate JavaScript and dynamic data; Mastering SVG and overcoming common problems.

Table of contents

  1. Copyright
  2. About the Author
  3. Acknowledgments
  4. Tell Us What You Think!
  5. Introduction
  6. SVG Fundamentals
    1. Getting Started with SVG
      1. Advantages of Using SVG
      2. Disadvantages of Using SVG
      3. What Spurred the Development of SVG?
      4. What Does SVG Offer Designers?
      5. What Does SVG Offer Developers?
      6. How Does SVG Compare with Flash?
      7. What Does SVG Offer You?
      8. SVG Needs You!
      9. What Will You Get out of This Book?
      10. Summary
      11. Q&A
      12. Workshop
    2. SVG's Foundation
      1. Syntax
      2. Structure
      3. Summary
      4. Q&A
      5. Workshop
    3. Viewing SVG
      1. Understanding Limitations
      2. What Environments Can View SVG?
      3. Implementation
      4. Summary
      5. Q&A
      6. Workshop
    4. Document Layout
      1. Understanding SVG Document System
      2. Using the viewBox
      3. Creating a Resizable Document
      4. Summary
      5. Q&A
      6. Workshop
    5. SVG's Shape Toolbox
      1. Basic Shapes
      2. Paths
      3. Summary
      4. Q&A
      5. Workshop
  7. Manipulating SVG
    1. Styling SVG
      1. The style Attribute
      2. Inline CSS Property Declarations
      3. Creating a Style Sheet
      4. Grouping Styles
      5. Organizing Your Style Sheet
      6. Storing and Accessing Style Sheets
      7. Summary
      8. Q&A
      9. Workshop
    2. Painting
      1. Working with Color
      2. Applying a Fill
      3. Applying a Stroke
      4. Setting Transparency
      5. Creating Gradients
      6. Creating Patterns
      7. Summary
      8. Q&A
      9. Workshop
    3. Symbols
      1. Creating Symbols and Definitions
      2. Summary
      3. Q&A
      4. Workshop
    4. Masking and Clipping
      1. Masking
      2. Clipping
      3. Summary
      4. Q&A
      5. Workshop
    5. Using Filters
      1. Understanding Filters
      2. Using Filters
      3. Blurring Images with feGaussianBlur
      4. Moving Objects with feOffset
      5. Merging Filter Primitives with feMerge
      6. Creating Textures with feTurbulence
      7. Taming feTurbulence Effects' Display with feComposite
      8. Creating New Filters
      9. Summary
      10. Q&A
      11. Workshop
    6. Images
      1. Using the image Element
      2. SVG in SVG
      3. Summary
      4. Q&A
      5. Workshop
  8. Bringing SVG to Life
    1. Time
      1. Understanding How Time Unfolds in SVG
      2. Using keyTimes
      3. Using Time Dependencies
      4. Summary
      5. Q&A
      6. Workshop
    2. Interaction
      1. Hyperlinks
      2. Using the set Element
      3. Summary
      4. Q&A
      5. Workshop
    3. Transforms
      1. Introduction to Transformations
      2. Transforming with the translate Property
      3. Transforming with the scale Property
      4. Transforming Using the skewX and skewY Properties
      5. Transforming Using the rotate Property
      6. Applying Multiple Transform Operations
      7. Summary
      8. Q&A
      9. Workshop
    4. Animation
      1. Understanding Motion
      2. Animating Basic Attribute Transitions
      3. Animating an Object's Location
      4. Animating a Transformation
      5. Animating Color Transitions
      6. Repeating Animations
      7. Frame-Based Animation
      8. Summary
      9. Q&A
      10. Workshop
  9. Text and Typography
    1. Formatting
      1. Understanding Text with SVG
      2. Including Text in Your Document
      3. Text Boxes
      4. Adjusting Margins and Leading with the dx and dy Attributes
      5. Size
      6. Spacing
      7. Justification
      8. Text Along a Path
      9. Summary
      10. Q&A
      11. Workshop
    2. Typefaces
      1. Understanding Typefaces
      2. Font Classifications
      3. System Fonts
      4. SVG Fonts
      5. Kerning
      6. Type Quality
      7. Summary
      8. Q&A
      9. Workshop
  10. Using JavaScript to Unleash SVG
    1. JavaScript
      1. Using Scripts in SVG
      2. Viewer Detection
      3. Enhancing Animation Performance
      4. Summary
      5. Q&A
      6. Workshop
    2. Using JavaScript to Create Dynamic Content
      1. Understanding Dynamic Graphics
      2. Designing SVG for Dynamic Content
      3. Preparing Your Graphic for Dynamic Content
      4. Localizing SVG Graphics
      5. Creating Dynamic Content
      6. Summary
      7. Q&A
      8. Workshop
  11. SVG Mastery
    1. Organizing and Optimizing Your Code
      1. Separation of Design and Engineering
      2. Development Process
      3. Coding with Basic Elements
      4. Detailing Code
      5. Terminology
      6. Annotating Documents
      7. Locating Document Elements
      8. Attribute Organization
      9. Style Sheet Organization
      10. Compression
      11. Summary
      12. Q&A
      13. Workshop
    2. Using Adobe Illustrator to Create Artwork
      1. Layers
      2. Style
      3. Positioning
      4. Cleaning Up Your Code
      5. Summary
      6. Q&A
      7. Workshop
    3. Overcoming Common Problems
      1. Animation
      2. Typography
      3. Display
      4. Style Sheet Organization
      5. AOL Image Display
      6. Troubleshooting Issues
      7. Summary
      8. Q&A
      9. Workshop
    4. Applying Your Knowledge
      1. The Code
      2. Stepping Stones
      3. Summary
      4. Q&A
      5. Workshop
    5. References
      1. Technology Comparison
      2. Viewer Compatibility
      3. Tools to Create SVG
      4. SVG References
      5. Summary
      6. Q&A
      7. Workshop
    6. Color Name and Hex Value Reference Table

Product information

  • Title: Sams Teach Yourself SVG in 24 Hours
  • Author(s): Micah Laaker
  • Release date: February 2002
  • Publisher(s): Sams
  • ISBN: 9780672322907