Incorporating vector graphic art skills into your web design toolkit enhances your ability to produce dynamic, interactive, and animated graphical outputs. It also enables the design of interactive banners and logos. Moreover, it equips you with the necessary tools for manipulating raster images using advanced SVG filters.
SVG (Scalable Vector Graphics) adds several crucial advantages to web design, thereby enhancing the overall quality and functionality of a website. This book guides you to start from no pre-knowledge requirement up to advanced SVG development, progressing with the flow of the chapters:
I. Introduction to SVG
II. SVG Fragment
III. SVG Tags
IV. Attributes
V. Basic Shapes
VI. Line Types
VII. Text
IIX. Document Structure
IX. Path
X. CSS & Transformation
XI. Animation
XII. Clipping & Masking
XIII. Colors & Brushes
XIV. Filters
XV. Lighting
XVI. Zooming & Panning
XVII. XML Extensibility
Jadual kandungan
I . INTRODUCTION TO SVG
Raster Images
Vector Graphics
Scalability
Image Decomposing
Accessibility
Animation
Free Software
II. SVG fragment
Inline Embedding
Style sheet
The Viewport
External Files
III. SVG TAGS
Structural Tags
Graphics Elements
Attributes
Deprecated Attributes
<svg> vs <canvas>
IV. ATTRIBUTES
The Default Value
Tag Specific Attribute
Homonymous Attributes
Common Attributes
Styling Properties
Presentation Attributes
Precedence Order
V. BASIC SHAPES
Default Values
The Rectangle <rect>
Rounded Corners
<circle>
<ellipse>
<line>
Polyline
Polygon
Coloring
VI. LINE TYPES
Color and Width
‘stroke-width’
Line Edges
The Line Dash
Self-drawing Path Animation
VII. TEXT
Text Location
Text as a Link
Text Graphics
text-decoration
Text direction
Alignment
Stretching
Letter Rotation
Fonts
Font Attributes
Text Path
IIX. DOCUMENT STRUCTURE
Patterns
Brushes
Groups <g>
Symbols
The ‘view Box’ Attribute
Nested <svg> Elements
IX. PATH
1. Quadratic Bezier
2. Cubic Bezier
3. The Elliptical Arc
X. CSS & TRANSFORMATION
Inline Styling
HTML Page Style
External Files
Transformation Attributes
Rotating
3. ‘scale( )’
4. ‘skew X( )’
5. ’skew Y( )’
Style Transformation
XI. ANIMATION
SMIL
CSS
Java Script
Software
SMIL
Path
Keyframes
Animation Properties
XII. CLIPPING & MASKING
Clipping
Masking
XIII. COLORS & BRUSHES
Opacity
Gradients
XIV. FILTERS
Animating Filter Effects
Turbulence Animating
XV. LIGHTING
Bump Mapping
Types of Light Sources
XVI. ZOOMING & PANNING
Viewport
View Box
Panning
Zooming
Access From Other SVG FILE
XVII. XML EXTENSIBILITY
Namespace
RDF
Dublin Core