SVG Element Ordering not following recommended order

[Graham Wharton]

Affinity Designer 1.8.5.703 running on windows

The current SVG Standard recommends in Section 5.4.1

"It is recommended that, where possible, referenced elements be defined prior to the elements that use them, in document order. Collecting all referenced elements inside of a single ‘defs’ element near the top of the file can make the markup easier to read and understand."

Whilst I agree this is only a recommendation, and not mandatory, it would be great if Affinity Designer followed this recommendation...... where possible! 😀

See attached Example with simple gradient fill and the resulting exported SVG below.

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 2481 3508" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
    <rect x="599.393" y="733.739" width="1412.2" height="1256.4" style="fill:url(#_Linear1);"/>
    <defs>
        <linearGradient id="_Linear1" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(1412.2,0,0,1256.4,599.393,1361.94)"><stop offset="0" style="stop-color:white;stop-opacity:1"/><stop offset="1" style="stop-color:black;stop-opacity:1"/></linearGradient>
    </defs>
</svg>

The Linear Gradient is defined after it has been used.

I know for one, TCPDF cannot read SVG files exported by Affinity Designer because of this (I agree this is a bug on TCPDF, but following the recommendations given in the spec would also solve this).

untitled.afdesign

[Sean P]

Hi Graham,

Thanks for letting us know - I'll get this passed on to development as an improvement!