Create a visual Site Map

WriteMaps is a free web-based tool that allows you to create, edit, and share sitemaps online. As a WriteMaps user, you and your team will be able to build and access your sitemaps from anywhere, without having to rely on proprietary desktop apps and static files.

Generate a colour scheme for your site

Do ever struggle to come up with a colour scheme/palette when building a site from scratch? Yep, me too. So with that in mind, simply pick your base colour and go to the colour wizard and it will suggest a multitude of various colour schemes for you to use on your site.

Color Wizard - Color Scheme Generator - Color Theory for web designers

Google Website Optimizer tool

Google Optimizer is the latest in the amazing free arsenal of free tools from Google, the aim of which is to help you increase your web site converstion rates and ultimately you or your companies ROI. The Google Website Optimizer overview video tells you all you need to know to get started and here's a link to the Google Website Optimizer main page.

It basically allows you to create several different versions of a web page (which you design) which has some sort of 'call to action' and will then randomly serve these variations of the page to your users. It will then report to you which was the most effective in terms of conversation rates and will ultimately increase your ROI. Pretty interesting to see how good (or crap) your web pages are at achieving their goals!

Google Website Optimizer - Webinar

Great new web site SEO Optimizer tool from Google - watch the introduction video on YouTube now.

Introduction to Website Optimizer Webinar

Create a Flash photo album with JetPhoto

A very cool photo album creation tool. You can create impressive Flash and/or HTML photo albums, which can also integrate with Flickr, use GPS locations which links with Google Earth so you can see exactly where you took your photo! The majority of the features are free also.

See the cool Flash version of the Kleeneze Marrakech Conference album I created with JetPhoto.

Find broken links on your site with Sleuth

Excellent and more importantly FREE broken links checking tool called Sleuth. Pretty comprehesive and an invaluable tool in any webmasters toolbox, especially if you have a large site. I uncovered 6 broken links on the site I manage which I didn't know about.

Find broken links on your site with Xenu's Link Sleuth (TM)

SE XML Sitemap Autodiscovery using robots.txt

Tell Google, MSN, Yahoo, etc, how to find your XML Sitemap with Sitemaps Autodiscovery. This is something I have just implemented at work, not a tool as such but I thought it was a pretty important/useful piece of information.

Search engines will check your robots.txt file for a link to an XML sitemap file, then get the file from that location. This is a big plus because all the major search engines regularly check robots.txt files as part of their ordinary crawling. My Robots.txt file now does all the work for me in telling all the major search engines where to find my XML sitemap.

Search Engines Unite On Sitemaps Autodiscovery

Cooktop: The free XML editor

A free and easy to use XML and XSL editor. The good thing about this tool is that you edit your XML and XSL in different tabs and run the transformation at the click of a button to see if your files are valid and it transforms how you would expect (or not!) You can use it in conjunction with several XSL transformation engines, should you so desire.

Cooktop: The free XML editor for Windows

.htaccess file generator

A handy tool you can use to generate a .htaccess file. Very useful if you are running an Apache web server - NB - This doesn't work on sites hosted on IIS.

.htaccess Generator :: Webmaster Toolkit

Also, I found quite a good .htaccess tutorial to give you a good grounding of what you can and cant do with the file.

Accessible drop down menu.

UDM is a fully-featured and accessible DHTML menu, that provides useable content to all browsers - including screenreaders, search-engines, text-only browsers and any web enabled device such as PDAs, iPhones ®, and Blackberrys ®.

Accessible Website Menu: Ultimate Drop Down Menu 4.5 - List-based Semantic DHTML Menu

Screen Capture with ScreenHunter

I'm currently building a You-Tube styles video application. A sub-task of this is to create thumbnail images of all the videos in the player, and this is turning out to be quite a labourious print-screen-athon. I was having to print screen, past into a new Fireworks doc, crop the image to the size I wanted, export and save x 70 odd times. Zzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzz.

Having seen the graphic deisgner in our office using a screen capture tool on his Mac the other day, I've gone about the task of finding something similar for Windows and after a quick Google search Ive discovered the following nifty free little tool called 'Screen Hunter'. Does everything I need and saves loads of time, mouse clicks and my sanity! Press F6 to start the capture tool, click and drag the rectangle to capture the area of the screen you want and your in! You can save to JPG or GIF and to a folder you specify on your PC.

Free Screen Capture - ScreenHunter

Free Flash Video Player (FLV) Player

If like you me, you are involved in Video Streaming production, the viewing of videos encoded in the Flash FLV format isnt a straightforward as you would have thought. You can't just double click the FLV to preview it, you need an external player, and this Free FLV Player is just the ticket!

It also displays important video properties of the stream such as the encoding video and audio bitrate's.

Free FLV Player

Create a Collapsible DIV with Javascript and CSS

This isn't a tool or application as such, but it's such a handy little trick for a web designer to use I thought I'd post it here. This is an excellent article that shows you how to show/hide DIVs on a web page by using some clever and simple JavaScript.

Although you are show and hiding content, it will not have a nagative impact on your SEO as Google with still index all the pages content using this method.

Harry Maugans » How to Create a Collapsible DIV with Javascript and CSS

See where I implemented it for for Kleeneze on their web site. Upon the user clicking a link, I showed and hid different client testimonials on a page.

Test your web design in different browsers - Browsershots

I recently stumpled across this excellent resource for checking your your web pages in different browsers and OS's. Crucially if you dont have a Mac, it supports this, in addition to Linux and Windows. I have seen a similar service called BrowserCam in the past but you had to pay lots of cash for their service, wont be using them again, "cash-back!".

Test your web design in different browsers - Browsershots

Google Releases Improved Content Removal Tools

A good artcile I found on how to remove yours, and others, web pages from the Google Index.

Google Releases Improved Content Removal Tools

Free CSS Validation Service

I have sometimes been pulling my hair out as why a certain page element isn't displaying as it should and quite often this can be down to an easily typed and difficult to spot syntax error in your CSS file. When I come across such unexplainable problems I regularly validate my CSS just to make sure - it's also good practice to do so regardless!

Validate your site CSS file(s) with the following free validation service from the goodfellah's at the W3C. You can validate it against different versions of the CSS standard, the medium for which the sylesheet is to be embedded to and various different warning reports, so blaze away on the link below! You can even place a CSS valid button on your site and everything when you are valid - which is nice.

The W3C CSS Validation Service

PS - This site is CSS valid, naturally!

Magic DVD Ripper

Pretty good and cheap DVD ripper for download. I use this program as the first port of call when preparing video content on DVD for streaming on the web i.e I use it to rip a DVD to AVI format which then can be used to convert to Flash Streaming FLV or Windows Media Streaming ASF format.

"Thats MAGIC"!

Magic DVD Ripper - rip DVD to hard drive or blank DVD

Google Sitemap Generator @ xml-sitemaps.com

A spiffing online Google XML sitemap generator tool. Also, create HTML sitemaps for your t'internet site and CSV sitemaps for Yahoo. Pretty sweet. If you dont know what a Sitemap is read the below, mmmkay.

"By placing a formatted xml file with site map on your webserver, you enable Search Engine crawlers (like Google) to find out what pages are present and which have recently changed, and to crawl your site accordingly."

XML-SITEMAPS.COM

Search Engine Robot Simulator

A cool online tool that will simulate how a Search Engine bot will index your web page and display the results to you.

Search Engine Robot Simulator - XML Sitemaps

Encoding Best Practices for Prerecorded Flash Video

Quick tips for setting encoding parameters for Flash Video from Adobe.

Adobe - Developer Center : Encoding Best Practices for Prerecorded Flash Video

IE WebDeveloper - DOM Inspector, Script Console, Logging messages and HTTP Monitor

Im on a IE tip this evening....youve all heard of Firebug, the excellent DOM inspector for Firefox right? Well this is soimething similar for IE, I was wanting the same Firebug functionality for IE when trying to fix an annoying quirk IE was doing when developing a site and stumbled across this on my search of the t'internet.

V.useful - enjoy!

IE WebDeveloper - DOM Inspector, Script Console, Logging messages and HTTP Monitor

Install multiple versions of IE on your PC

An absolute godsend for testing your web sites on older versions of our good friend Internet Explorer, in particular that little blighter v5.5. Install all version of IE 3 (!!!) onwards onto your PC via a single installer. You can even run muliple versions of IE at the same time. A brilliant program and its free.

Install multiple versions of IE on your PC | TredoSoft

Pixels (X) to Centimeters Conversion Calculator

Convert pixels to cm's and vice versa with this handy calculator. Useful if you want to convert dimensions from print to web and vice versa (which Ive had to do today!)

Pixels (X) to Centimeters Conversion Calculator

How to centre a DIV on the viewport

Does exactly what it says on the tin!

Center DIV/Container/Layer IE : flumpCakes

Ten CSS tricks you may not know | evolt.org

Ten useful CSS tips you might not know or have forgotten (i know of a few I had forgotten about!)

Ten CSS tricks you may not know

Bulk Rename Utility

Not a web tool as such, but a fantasic windows tool that bulk renames groups of files in one hit. Can be a big time saver if you need to rename a lot of files (which I frequently need to do)

Download it now!

Bulk Rename Utility

Website Hosting With Apache

Good article for how to set up your own Apache web server. No to IIS!

Beginners Guides: Website Hosting With Apache - PCSTATS.com

Pullquotes with CSS

Handy small CSS article to make a quote stand out.

Pullquotes with CSS:

IE NetRenderer - Browser Compatibility Check -

This is an IE renderer which lets you preview your site in muliple versions of IE, which is nice!

IE NetRenderer - Browser Compatibility Check -

Ning: Build Your Own YouTube, Flickr or MySpace

Ning: Build Your Own YouTube, Flickr or MySpace

Make a Flash Countdown Banner

Create a Flash Countdown timer, can be fully customised to your own needs.

kirupa.com - Date Countdown Timer

CoffeeCup Google SiteMapper - Create Powerful Google Sitemaps in Seconds!

CoffeeCup Google SiteMapper - Create Powerful Google Sitemaps in Seconds!

Flash font browser

Browse all your system fonts on a web page with this Flash app:

http://www.stcassociates.com/lab/fontbrowser.html

Welcome to John's List

Welcome one, and welcome all to John's List! Here you will find a list of useful web applications and PC applications which help me in my day to day job as a web designer.

Enjoy and feel free to post any app like or find useful.