WTH (What the heck) are SVG?

For a new technology, scalable vector graphics (SVG) have actually been around for a while.

So what exactly are they, and why should we care? Well, SVG are an XML-based way to build vector graphics. (Oh boy; more computer jargon.) With a text-based file (XML), you can produce graphics that are drawn by mathematical functions (re: vector). There are benefits to these two features:

  • Being text-based makes it humanly readable and easily generated
  • Using a mathematical way to draw images rather than individual pixels means the graphics can be scaled without getting blurry
  • As a bonus, the file sizes are comparatively minuscule

So, translated into the online business world: SVG are a great way to build and display web graphics that are easy to scale up and down, and that save valuable space online for faster loading.

As with most things on the web, we must wait for broad browser support before a new technology like SVG is ready for prime time. The culprit this time has been Internet Explorer ; finally, version 9 is the first version of the popular browser to have full SVG support built in. Once the majority of websites migrate up to support IE9 (at a minimum), SVG may — or may not — become popular.

So why may SVG not rule the web? There are competing technologies. Adobe Flash already has the ability to use vector-based graphics. However, Flash files are frequently large and memory intensive. Plus, Flash requires a plugin that seems to need to be updated hourly. [And Apple is attempting to freeze out Flash functionality on its wildly popular iPads.]

There’s also the HTML5 canvas tag. The canvas tag has pros and cons of its own, but we’ll save that for another blog day. The battlefield is there though, and really no matter which technology wins, it’s going to be an improvement over the tools we have today.

Business and content owners: It’s important that you understand how your websites are being built and displayed. Slow sites and errors mean unhappy customers and lost sales. Ask your technology team how your site graphics are being developed and delivered.

And more importantly, ask them why they are using what they are using.

Contact Us