Dinky little XML and XSL GIFs for web pages?

Chris Lilley chris at w3.org
Sun May 2 01:40:18 BST 1999 


Lisa Rein wrote:
> 
> i agree there should be an icon.  but is should be TEXT-BASED! :-)
> let's keep things clean, shall we?

Grin. OK, so here is a *text based* icon. 

Indeed, it is well formed XML. Its even valid.

And when gzipped, simulating the transmission size over HTTP/1.1, it is
2,687 bytes which is fair enough. I attach a PNG to show what it
actually looks like. A 128color, 96 by 61 pixel GIF was 3,022 bytes, the
same image was 2,620 bytes as a PNG and the 24-bit version was 3,610
bytes as a q85, 444, progressive JPEG (anything less and it looked
awful. Logos are bad for jpef compression).

The path data was programatically generated, and I didn't write the
program, so I can't give it out yet. The rest was hand written.

<?xml version="1.0"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG April 1999//EN" 
  "http://www.w3.org/Graphics/SVG/svg-19990412.dtd">
<svg width="96.3pt" height="60.8pt" style="transform:fit(0 0 96.3
60.8)">
<g id="logo" style="transform:matrix(1 0 0 -1 -246.7 418.1);">
  <title>Made with XML and XSL</title>
  <desc>
    A logotype for XML documents styled with XSL,
    stressing the common X.
  </desc>
  <g style="fill:none;">
    <defs>
      <lineargradient id="one">
        <gradientstop offset="0" color="#B0C0FC"/>
	<gradientstop offset="1" color="#1C407D"/>
      </lineargradient>
      <radialgradient id="two">
	<gradientstop offset="0" color="#34AACD"/>
	<gradientstop offset="1" color="#1C407D"/>
      </radialgradient>
      <radialgradient id="three">
	<gradientstop offset="0" color="#FFF0C4"/>
	<gradientstop offset="1" color="#C75A42"/>
      </radialgradient>
     </defs>
	<path style="fill-params:73.2 122.9 76.5 122.9;fill:url(#one);"
d="M336.7,366.7h-75.4v45.6h75.4v-45.6z "/>		
	  <g style="fill-params:120.2 109.8 121.9 109.8 120.2
109.8;fill:url(#two);">
		<g style="fill:url(#three);">
		  <path
d="M295.8,368.6c6.0,0.8,10.7,1.7,14.1,2.8c3.4,1.1,5.2,2.1,5.2,3.1c0,0.6-0.5,1.1-1.4,1.4c-0.9,0.3-2.3,0.5-4.0,0.5c-0.5,0-1.2-0.0-2.0-0.0c-0.8-0.0-1.3-0.0-1.5-0.0c-1.0,0-1.8,0.1-2.5,0.2c-0.7,0.1-1.2,0.3-1.5,0.6c-0.1,0.1-0.3,0.3-0.5,0.6c-0.2,0.3-0.5,0.5-0.6,0.7c-0.3,0.2-0.7,0.4-1.2,0.4c-0.2,0.0-0.4,0.0-0.5,0.0c-0.3,0.0-0.6,0.2-0.7,0.4c-0.2,0.2-0.3,0.5-0.3,0.8c0,0.7,0.3,1.4,0.8,2.2c0.6,0.8,1.4,1.5,2.4,2.3c1.1,0.8,2.5,1.6,4.2,2.4c1.6,0.7,3.4,1.4,5.3,2.0c1.1,0.3,2.1,0.6,3.1,0.7c1.0,0.2,1.9,0.3,2.6,0.3c0.8,0,1.3-0.1,1.7-0.3c0.4-0.2,0.5-0.6,0.5-1.1c0-0.4-0.3-0.9-1.0-1.6c-0.3-0.4-0.6-0.7-0.8-0.9c-0.1-0.1-0.2-0.3-0.4-0.6c-0.3-0.5-0.6-0.7-1.0-0.7c-0.2,0-0.3,0.1-0.5,0.2c-0.1,0.1-0.2,0.3-0.2,0.6c0,0.0,0.0,0.1,0.0,0.2c0.0,0.1,0.0,0.1,0.0,0.2c0,0.2-0.1,0.3-0.2,0.4c-0.1,0.1-0.3,0.1-0.5,0.1c-0.3,0-0.7-0.1-1.4-0.2c-0.6-0.1-1.4-0.2-2.2-0.4c-1.5-0.3-2.7-0.6-3.8-0.9c-1.0-0.3-1.9-0.5-2.6-0.8c-1.1-0.4-2.0-0.9-2.6-1.3c-0.6-0.5-0.9-0.9-0.9-1.4c0-0.4,0.3-0.8,0.8-1.0c0.5-0.2,1.4-0.3,2.5-0.3c0.2,0,0.8,0.!
0,1.8,0.1c1.0,0.0,1.9,0.1,2.6,0.1c3.6,0,6.1-0.3,7.7-0.9c1.5-0.6,2.3-1.6,2.3-2.9c0-0.6-0.2-1.2-0.5-1.7c-0.3-0.5-0.8-1.0-1.4-1.4c-0.1-0.1-0.4-0.2-0.7-0.4c-1.2-0.7-2.2-1.4-3.0-2.1c-1.1-0.9-2.4-1.5-3.9-2.0c-0.2-0.1-0.3-0.1-0.4-0.1c-3.5-1.1-6.9-2.0-10.1-2.7c-3.2-0.7-5.5-1.0-6.7-1.0c-0.4,0-0.8,0.1-1.0,0.2c-0.2,0.1-0.3,0.3-0.3,0.5c0,0.3,0.4,0.7,1.3,1.3c0.8,0.6,1.3,1.0,1.4,1.2c0.0,0.1,0.1,0.1,0.1,0.2c0.2,0.4,0.4,0.7,0.7,1.0c0.9,0.7,1.6,1.2,2.2,1.6c0.6,0.4,1.1,0.6,1.3,0.6c0.1,0,0.3-0.0,0.4-0.1c0.1-0.1,0.2-0.2,0.2-0.3c0-0.3-0.4-0.7-1.1-1.3c-0.5-0.4-0.9-0.7-1.1-1.0z
"/>
			<path
d="M323.8,370.2c1.2,0.7,2.2,1.2,3.1,1.4c0.9,0.3,1.8,0.4,2.7,0.4c0.8,0,1.5-0.1,2.3-0.3c0.8-0.2,1.7-0.6,2.8-1.1c0.1-0.1,0.3-0.2,0.6-0.3c0.9-0.5,1.7-0.7,2.5-0.7c0.2,0,0.4-0.2,0.6-0.6c0.2-0.4,0.2-0.9,0.2-1.5c0-0.5-0.2-1.0-0.5-1.5c-0.4-0.5-0.8-0.8-1.2-0.8c-0.4,0-1.4,0.4-3.0,1.2c-0.8,0.4-1.5,0.8-2.0,1.0c-0.9,0.4-1.8,0.7-2.7,0.9c-0.9,0.2-1.8,0.3-2.6,0.3c-1.1,0-2.0-0.2-2.9-0.6c-0.9-0.4-1.7-0.9-2.5-1.7c-0.4-0.4-0.9-0.9-1.5-1.7c-0.6-0.8-1.1-1.2-1.4-1.2c-0.2,0-0.4,0.1-0.6,0.2c-0.1,0.1-0.2,0.3-0.2,0.5c0,0.6,1.8,3.7,5.4,9.4l0.2,0.4c0.3,0.5,0.8,1.2,1.3,2.0c0.7,1.1,1.1,1.7,1.1,1.9c0,0.1-0.1,0.3-0.2,0.7c-0.1,0.3-0.2,0.6-0.2,0.7c0,0.3,0.7,1.2,2.0,2.5c0.9,0.9,1.7,1.7,2.3,2.4c0.2,0.2,0.5,0.6,0.9,1.0c2.0,2.3,3.6,3.4,4.8,3.4c0.3,0,0.5-0.3,0.7-0.8c0.2-0.6,0.3-1.1,0.3-1.5c0-0.4-0.1-0.9-0.4-1.5c-0.3-0.5-0.7-1.1-1.2-1.7c-2.8-3.0-5.0-5.5-6.6-7.6c-1.7-2.0-3.0-3.8-4.0-5.4z
"/>
	</g>
	<g style="fill:url(#three);">
	  <path
d="M307.2,409.8c-1.6-1.7-3.2-3.5-4.7-5.5c-1.6-2.0-3.1-4.1-4.7-6.5l-2.1-3.1c-2.6-3.8-4.0-5.9-4.1-6.2c-0.0-0.1-0.1-0.2-0.1-0.3c-0.1-0.4-0.3-0.6-0.4-0.7c-0.1-0.1-0.2-0.1-0.4-0.2c-0.1-0.0-0.3-0.1-0.5-0.1c-0.3-0.0-0.6-0.1-1.0-0.2c-0.4-0.1-0.6-0.1-0.7-0.1c-0.2,0-0.3,0.1-0.4,0.2c-0.1,0.1-0.1,0.3-0.1,0.5c0,0.4,0.1,0.8,0.2,1.1c0.2,0.3,0.4,0.6,0.7,0.8c0.5,0.4,1.4,1.5,2.6,3.3c0.6,0.9,1.1,1.6,1.5,2.1c4.7,6.4,8.4,11.2,11.1,14.4c2.8,3.2,4.5,4.9,5.3,4.9c0.2,0,0.5-0.1,0.6-0.3c0.2-0.2,0.3-0.4,0.4-0.8c0.1-0.5,0.2-1.0,0.3-1.4c0.1-0.4,0.2-0.7,0.2-0.7c0-0.3-0.4-1.7-1.3-4.5c-0.8-2.7-1.6-5.4-2.2-7.9c2.3,3.2,4.1,5.6,5.5,7.2c1.4,1.6,2.6,2.8,3.6,3.5c0.5,0.5,0.9,0.8,1.2,1.1c0.3,0.2,0.6,0.3,0.9,0.3c0.4,0,0.8-0.2,1.0-0.6c0.2-0.4,0.4-1.0,0.4-1.7c0-0.7-0.5-2.5-1.4-5.3c-0.3-0.9-0.5-1.6-0.7-2.2c-0.4-1.2-0.6-2.1-0.8-2.7c-0.2-0.6-0.2-1.1-0.2-1.4c0-0.3,0.1-0.5,0.2-0.6c0.1-0.1,0.3-0.2,0.5-0.2c0.3,0,0.6,0.2,0.9,0.6c0.3,0.4,0.6,0.6,0.8,0.6c0.2,0,0.3-0.1,0.4-0.2c0.1-0.1,0.2-0.2,0.2-0.4c0-0.2-0.1-0.4-0.3-0.8c-0.2-0.3!
-0.4-0.7-0.7-1.0c-0.4-0.5-0.9-0.9-1.6-1.3c-0.7-0.4-1.2-0.6-1.5-0.6c-0.1,0-0.2,0.0-0.3,0.0c-0.1,0.0-0.2,0.0-0.3,0.0c-0.1,0-0.3-0.0-0.5-0.1c-0.2-0.0-0.4-0.1-0.5-0.1c-0.4,0-0.8,0.2-1.0,0.6c-0.2,0.4-0.4,1.0-0.4,1.8c0,0.8,0.9,3.6,2.8,8.5c0.6,1.5,1.0,2.7,1.4,3.5c-1.0-0.9-2.9-3.3-5.7-7.1c-1.3-1.8-2.3-3.1-3.1-4.1c-0.5-0.7-1.1-1.2-1.6-1.6c-0.5-0.4-1.0-0.5-1.4-0.5c-0.3,0-0.7,0.2-1.1,0.5c-0.4,0.4-0.6,0.7-0.6,1.0c0.3,1.2,0.6,3.0,1.1,5.3c0.3,1.4,0.7,2.8,1.1,4.3c0.4,1.5,1.0,3.0,1.6,4.6z
"/>
		<!-- yes, I should define the "L" once and re-use it -->
		<path
d="M326.6,398.1c1.2,0.7,2.2,1.2,3.2,1.5c0.9,0.3,1.8,0.4,2.7,0.4c0.8,0,1.5-0.1,2.3-0.3c0.8-0.2,1.7-0.6,2.8-1.1c0.1-0.1,0.3-0.2,0.6-0.3c0.9-0.5,1.7-0.7,2.5-0.7c0.2,0,0.4-0.2,0.6-0.7c0.2-0.4,0.2-0.9,0.2-1.5c0-0.5-0.2-1.0-0.5-1.5c-0.4-0.5-0.8-0.8-1.2-0.8c-0.4,0-1.4,0.4-3.0,1.2c-0.8,0.4-1.5,0.8-2.0,1.0c-0.9,0.4-1.8,0.7-2.7,1.0c-0.9,0.2-1.8,0.3-2.6,0.3c-1.1,0-2.1-0.2-3.0-0.6c-0.9-0.4-1.8-0.9-2.5-1.7c-0.4-0.4-0.9-1.0-1.5-1.8c-0.6-0.8-1.1-1.2-1.4-1.2c-0.2,0-0.4,0.1-0.6,0.2c-0.1,0.1-0.2,0.3-0.2,0.5c0,0.6,1.8,3.8,5.4,9.5l0.2,0.4c0.3,0.5,0.8,1.2,1.3,2.0c0.7,1.1,1.1,1.7,1.1,2.0c0,0.1-0.1,0.3-0.2,0.6c-0.1,0.3-0.2,0.6-0.2,0.7c0,0.3,0.7,1.2,2.0,2.6c0.9,1.0,1.7,1.7,2.3,2.4c0.2,0.2,0.5,0.6,0.9,1.0c2.0,2.3,3.6,3.5,4.8,3.5c0.3,0,0.5-0.3,0.7-0.8c0.2-0.6,0.3-1.1,0.3-1.5c0-0.4-0.1-0.9-0.4-1.5c-0.3-0.5-0.7-1.1-1.3-1.7c-2.8-3.0-5.0-5.6-6.7-7.6c-1.7-2.1-3.0-3.9-4.0-5.4z
"/>
		</g>
		<path
d="M272.8,385.2c-3.2-3.8-5.5-6.6-7.0-8.5c-1.5-1.9-2.2-3.0-2.2-3.3c0-0.2,0.1-0.5,0.4-0.9c0.3-0.5,0.4-0.8,0.4-1.1c0-0.7-1.4-2.5-4.1-5.4l-0.2-0.2c-0.7-0.8-1.6-1.8-2.7-2.9c-1.1-1.2-1.7-1.8-1.9-2.0c-0.2-0.1-0.5-0.2-0.8-0.3c-0.3-0.1-0.6-0.1-0.8-0.2c-0.3-0.1-0.7-0.4-1.3-0.7c-1.0-0.6-1.8-0.9-2.3-0.9c-0.5,0-0.8,0.1-1.0,0.4c-0.2,0.3-0.4,0.6-0.4,1.1c0,1.7,6.7,10.5,20.2,26.3l2.5,3.0c-0.6,2.7-1.2,5.4-1.7,8.1c-0.5,2.7-0.8,4.2-0.9,4.3c-0.1,0.3-0.4,0.6-0.9,1.0c-0.5,0.3-0.7,0.7-0.7,1.2c0,0.8,0.6,1.4,1.9,2.0c0.5,0.2,0.8,0.4,1.1,0.5c0.3,0.2,0.8,0.6,1.6,1.3c0.7,0.7,1.3,1.0,1.8,1.0c0.4,0,0.7-0.1,0.9-0.4c0.2-0.3,0.3-0.8,0.3-1.5c0-2.2,0.1-4.3,0.3-6.5c0.2-2.2,0.5-4.3,0.9-6.4c4.9,5.5,8.5,9.4,11.1,11.5c2.5,2.1,4.6,3.2,6.1,3.2c0.5,0,0.9-0.2,1.2-0.6c0.3-0.4,0.4-0.9,0.4-1.6c0-1.0-0.3-1.9-1.0-2.9c-0.7-0.9-1.4-1.4-2.0-1.4c-0.1,0-0.4,0.0-0.9,0.1c-0.4,0.1-0.8,0.1-1.1,0.1c-1.1,0-2.5-0.7-4.1-2.0c-1.6-1.4-4.6-4.7-9.1-10.1c0.9-4.5,2.4-8.2,4.6-11.1c2.2-2.9,4.3-4.3,6.5-4.3c0.7,0,1.2,0.2,1.6,0.7c0.4,0.5,0.6,1.2,0.6,!
2.1v0.7c0,1.3,0.4,2.4,1.1,3.4c0.7,1.0,1.5,1.5,2.3,1.5c0.5,0,0.8-0.2,1.1-0.7c0.3-0.5,0.4-1.1,0.4-1.9c0-1.4-0.2-2.6-0.7-3.6c-0.5-1.0-1.1-1.8-2.1-2.4c-0.5-0.3-1.3-0.9-2.2-1.8c-2.0-1.8-3.9-2.8-5.6-2.8c-2.7,0-5.1,1.3-7.1,3.9c-2.0,2.6-3.6,6.3-4.7,11.1z
"/>
	</g>
  </g>
</g>
</svg>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: xmlsl.png
Type: image/png
Size: 25065 bytes
Desc: not available
Url : http://mailman.ic.ac.uk/pipermail/xml-dev/attachments/19990502/5c7f7a5c/xmlsl.png

More information about the Xml-dev mailing list