Attribute Organization

Similar in importance to the arrangement of your document's different elements is the arrangement of your elements' attributes. In Listing 20.2, you hopefully saw the value of using basic shape elements to ease the understanding of an element's function. Providing an ordering for your attributes produces similar results.

Consider the following two examples:

Listing 20.7. Elements with Various Locations for Their Attributes Result in a Confusing Read
<rect id=”Box1” x=”10” y=”10”
    width=”125” height=”125”/>
<rect x=”53” height=”25” y=”98”
    width=”11” id=”Box2”/>
Listing 20.8. By Using Consistent Locations for Attributes, Understanding an Element's Location Is Possible Much More Quickly
 <rect id=”Box1” x=”10” y=”10” width=”125” ...

Get Sams Teach Yourself SVG in 24 Hours now with the O’Reilly learning platform.

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