This is more just a reminder for me - while browsing BBC news I spotted an article on the best popular science books (as judged by the Royal Society Prize for Science Books, which I imagine is British). There are a couple that caught my interest and thought some of you might be interested too.

1. In Search of Memory, by Eric R Kandel (WW Norton & Co)
   Nobel laureate Eric R Kandel charts the intellectual history of the emerging biology of the mind, and sheds light on how behavioural psychology, cognitive psychology, neuroscience and molecular biology have converged into a powerful new science. These efforts, he says, provide insights into normal mental functioning and disease, and simultaneously open pathways to more effective treatments.

2. Lonesome George, by Henry Nicholls (Macmillan)
   Lonesome George is a 1.5m-long, 90kg tortoise aged between 60 and 200, and it is thought he is the sole survivor of his sub-species. Scientific ingenuity may conjure up a way of reproducing him, and resurrecting his species. Henry Nicholls details the efforts of conservationists to preserve the Galapagos' unique biodiversity and illustrates how their experiences and discoveries are echoed worldwide. He explores the controversies raging over which mates are most appropriate for George and the risks of releasing crossbreed offspring into the wild.

3. One in Three, by Adam Wishart (Profile Books)
   When his father was diagnosed with cancer, Adam Wishart couldn't find any book that answered his questions: what was the disease, how did it take hold and what did it mean? What is it about cancer's biology that means it has not been eradicated? How close are we, really, to a cure? There was no such book. So he wrote it. One in Three interweaves two powerful stories: that of Adam and his father; and of the 200-year search for a cure.

The others sound interesting too, but those are my top 3. Now if there was an Amazon.com.au I could just add those to my wishlist but nooooo Oz is no good for the folks at Amazon.

SVG is a markup language, much like XHTML, that describes 2D graphics. It's a W3C recommended standard for creating vector graphics not just for the web, but for all software. Any piece of software could read or render SVG. Jumping into a quick overview of the compontents of an SVG document - there are three types of graphic object available in SVG:

• Vector Graphicsare geometrical primitives such as points, lines, curves, and polygons, which are all based upon mathematical equations to represent images. In SVG these primitives are represented by the circle, rect, ellipse, polygon, polyline, line and path elements. Because only the mathematical data is stored SVG images can be scaled to any size and never lose their quality. Text will always be sharp and rounded edges will always be smooth. Vector images also have a much smaller files sizes than raster images (unless there is a huge amount of data) because only mathematical data is stored instead of every single pixel.

• Text can be represented in vector format. In fact font files contain vector data so that fonts can be made any size (that's why the text is always smooth in word, no matter how high the font size is).

• Raster Images are defined by a collection of pixels with each pixel having 3-4 bytes of data (Alpha (opacity/transparency), Red, Green and Blue. Alpha is limited to .png file formats.). To scale a raster image these pixels have to be blended together losing some image quality. You've probably all seen this while trying to enlarge a .jpg file or any other raster image. Wikipedia has an image that demonstrates the vector/raster scaling differences pretty well. I wont really be talking about raster images in SVG, at least not yet anyway.

But you want to see some markup now, right? (View in SVG enabled browser)

	<?xml version="1.0" encoding="utf-8"?>
	<svg xmlns="http://www.w3.org/2000/svg">
		<circle cx="50" cy="50"  fill="navy" r="30"/>
		<circle cx="50" cy="50" fill="white" r="22"/>
		<circle cx="50" cy="50" fill="red" r="10"/>
	</svg>
	

Lovely, eh? It's a trivial example I know, but writing that in notepad took less time than it would to load up Photoshop, draw the circles, align them and then save the image for web.

SVG and the web

Why use SVG? There are lots of reasons, and I wont go into all of them right now but there are two that I do want to talk about. Maintainability and Accessibility. Note: One important thing to remember is that browser support varies. Some support more features than others and some don't support any. This will change though. Be ready for it! ;)

Accessibility with images on the web has never been fantastic. We've always had to reply on alt or longdesc attributes on img elements or the like. This text can give a general idea of what the image is of but not much more than that.

Enter SVG. It's XML. It's machine readable. Search engines and browsers are able to read through SVG files and get details of every element. In the above SVG example any reader will know that the image is made of 3 circles and the reader will know what colour they are, and their size. For example a screen reader would be able to tell the user about that data - The image is comprised of three circles. A small red circle ontop of a larger white circle that is ontop of a larger navy coloured circle all centered on the same point.

Maintainability of raster images has always been a pain. I think we've all been in the position where we're making a design and we want to change the background colour of an image, or change the text from Update to Submit and then back to Update because we couldn't decide which was best. This involves changing the text in a graphics editor and then saving the file again. With SVG all these changes can be done with notepad!

In same cases you may never need to maintain an SVG file. Many web services provide data in XML. This XML can be transformed into SVG at request time so that almost any XML data can be represented as an image (think of stock quote data, even XHTML could be transformed into an image!)

Lets get started!

In Part 2 I'm going to go over the different elements available in SVG and how to use them to create some interesting (and hopefully practical) images. As a little taste I've created a small example of a way in which SVG can be used to create rich interfaces.

I'm not sure how that happened. What kind of a CMS system lets you make an empty post, huh? What kind of idiot would write such a thing...