Vector Magic

If you’ve ever been in a situation where you’ve had an image such as a logo in a bitmap image format that you really need to get a vector copy of, then you’ll probably appreciate Vector Magic, a true web 2.0 application.

No more manually recreating logos, or drawing over/around scanned in artwork. Just use Vector Magic!

Simply:

• Upload your JPG, GIF, PNG, BMP or TIFF image (less than 5MB) to Vector Magic
• Select whether the image is a logo or photograph
• Select the level of detail you wish the vector to retain
• Wait a few minutes while it produces an image in EPS, SVG or PNG format!

Go check Vector Magic out now and never manually recreate a vector again!

Update: Vector Magic is unfortunately no longer free to use, but we can recommend the service should you be interested in paying. We’ll keep an eye out for a free alternative to Vector Magic. - Andi 28th Feb 2008

Today’s tech tool is one for PHP developers, although I’d be very interested to know if anyone has an alternative that works in ASP.NET. If you’ve ever wondered what exactly your clients are doing on your webpage, then this may be exactly what you are looking for.

ClickHeat records user clicks on your page and displays them as a visual heatmap, showing the areas where users are most likely to click. This functionality is not limited to links, it records every click anywhere on your page.

Maybe users are confusing a graphic with a button, or maybe there’s a page on your site which is more popular than others. ClickHeat can tell you.

Check out the software (free) and it’s demo on the ClickHeat website.

While web developers could once rely on the safety of tables for their web designs, more and more recently table layouts have been frowned upon in the design community in favour of DIV based layouts. Tables should be for tabular data, after all.

The only problem is DIV based layouts from the outset can seem much more daunting and complicated, especially for people new to web development - mainly due to each layout requiring a different coding strategy to get the columns laid out nicely, the code being split between HTML and CSS, and the requirement to test the layout in at least two browsers for compatibility issues.

Enter the Layout Gala - a handy website I recently stumbled upon - which contains 40 of the most popular layouts all made using cross-browser friendly DIV code. Now whenever you need a new look, just visit this site find the layout you want and download the skeleton HTML for stress free DIV based websites. Woohoo!

Click here to visit the Layout Gala

On a side note, if you find yourself needing a DIV layout with equal length columns, check out these articles:

• Faux Columns - A simple background image trick which should be suitable for most solutions.
• Project 7 Equal Height Columns - A simple javascript which extends the columns to the length of the largest column. It can either be fully extended on load or visibly extend in front of your eyes.

As we move into the world of web 2.0, everyone seems to be talking Ajax. While this article isn’t going to talk about the advantages and disadvantages of Ajax (we’ll save that for another day), it is going to feed you with a useful link to a site which will generate Ajax loading images based on your needs, called Ajaxload.info.

Choose the image type you’d like, a foreground and a background colour, and hey presto - instant GIF!

This week, we look at Firebug - perhaps the most useful Firefox extension ever made. If you use the (included) Web Developer toolbar in Firefox for debugging JavaScript and CSS issues, then stop - this one is much more useful.

Weighing in at just over 250kb to download, Firebug allows you to view and edit HTML and CSS, as well as debug Javascript all in real time. This is one extension any web developer would be ashamed to live without. Firebug quietly sits in the Firefox status bar and eagerly awaits your click to unleash it’s powerful features.

This week’s top tech tool is ‘Multiple IE’ by TredoSoft, which allows you to use multiple instances of different versions of Internet Explorer on a single Windows PC - which is especially helpful for those of us who have to create an IE 6 and 7 compatible website and only have one computer.

The tool allows you to install instances all the way back to Internet Explorer 3, although we wouldn’t recommend trying to make your website HTML compatible that far back!

It’s not the perfect tool - sometimes it renders things slightly wrong, sometimes it crashes and sadly this tool doesn’t currently work on Windows Vista, but it is as close as you can get without multiple machines with multiple software configurations, or a Virtual Machine set-up.