I was at a Web Performance MeetUp recently and got into a debate about the benefits of SVG over raster technology. Whilst I think it’s a perfectly valid question (and sure vector has had its limitations in the pat) I also can’t really imagine why someone would still be asking this this question in 2013.
Scalability is everything and vector technology is based on a mathematical system which means it allows you to zoom in on an image with minimal distortion and provide a much crisper and slicker experience for your user, regardless of their device. The vector equivalent requires significant overhaul when it comes to sizing. Not to mention how much more lightweight and flexible it is compared to to using a JPEG.
It’s also much easier to edit SVG’s on the fly (especially when combined with a CDN : ) because you’re creating a template, which can be combined with your CSS to work in whatever way you want.
If you’re looking to get found on the internet you are limiting yourself to the title and possibly the alt text if you’re using JPEGs or PNGs. Serving as many of your images as possible as SVG’s will make it much easier for search engines to read your site because SVG is text based, which ultimately means better rankings.
So if you are looking to get started with SVG then check out my top 5 recommendations below:
The easy to use Cloud Convert is an all in one cloud based converter, supporting 155 different file formats from video, audio, and vectors. Convert batch files in the browser, then send them to integrated services like Dropbox and Google Drive, or email them to yourself when done. Cloud Convert offers some of the following formats –
In need of a desktop based program to convert your SVG files? CairoSVG is an open source based SVG converter, exporting files to either PDF, PostScript, and PNG files. Cairo works on Linux, and should work with most of the UNIX-like platforms (*BSD, OS X) and Windows.
Grumpicon is one of the easiest web based drag and drop services out there, converting HD-ready (retina) vector illustrations, icons, and background images. The tool can process batch SVG files, generating PNG fallback images for legacy browsers like IE8 and Android 2.3.
iConvert is a super simple converter, offering both paid desktop and free web based version to convert for SVG files, supporting a dozen formats like PNG, JPG, and GIF. It converts standard icon sizes and formats: ICNS, HQX, ICO, and PNG.
FileFormat.Info is a free and easy to use web based converter, offering output formats such as PNG, BMP, and WBMP. Developers and designers should find the SVG to PNG converter, with the option to specify output dimensions of width and height.