Useful tools for web designers & developers

It has been a busy few months for us here at Creative Online Media so our blog has been a little neglected. Good news though, we are getting back into the swing of posting regular blog entries so keep an eye out for them.

Mockingbird

Mockingbird is a great tool that allows you to create mockups of websites using it’s easy to use interface. You simply drag and drop elements then resize and rearrange them to create a page. You can even test out the usability of your layout by linking multiple pages together.

Whether it’s to create a simple mock up of a personal site or to illustrate your design ideas to a client, this is the perfect tool for creating mockups in minutes. Mockingbird makes it easy share your creation as it issues you with a link and an embed code so you can share it with others.

Pixlr

If you find yourself without Photoshop or you’re simply looking for a cheaper alternative Pixlr is definitely worth checking out. It’s an online image editing tool that provides plenty of functionality and a smart interface. Simply upload your photo from your computer, enter an online image URL or create a new image and get editing.

0 to 255

We often spend too long choosing colours for our designs. However this nifty little tool will find any distinction of a colour to help you choose and it even copies the hex code for you. This is great for finding the perfect colours for your hovers, gradients, borders and more.

Kuler

Adobe Kuler is another web hosted application that will aid you in the design process. It allows you t to experiment quickly with colour variations and browse thousands of themes from the Kuler community.

ColorSuckr

Have you ever came across a certain photograph, graphic or website that had you admiring the range of colours and tones within it? ColorSuckr is a tool that allows you to effortlessly create colour schemes based on photos. Simply enter the URL of your image or search through Flickr for one you like and this little tool will generate the perfect colour palette for you.

CSS3 Generator

This tool does exactly what it does on the tin. Simply choose a CSS3 element from the list on the dropdown menu, then choose your desired properties and this application will generate the valid CSS code for you.

CSS3 Button Maker

Making gorgeous call to action buttons for your website couldn’t be easier with CSS Tricks’ Button Maker. You simply move the sliders choose the size, gradient colours and rounded corners of your CSS3 button. This app will then provide you with the CSS you can add to your stylesheet. Check out CSS3 Button Maker

ProCSSor

I guess you could call this a ‘code prettifier’ as it allows you to paste your CSS into its text field and it tidy up your code according to your preferences. You can neaten up your CSS and customise how it  displays. Especially handy if you have inherited code from another designer or if your CSS will be edited by others, this is a great tool boasting a gorgeous interface too.

Browser Shots

Browser compatibility testing is so easy with this tool. It can show you how your website renders in over 100 browsers and OS combinations. Not only this, but it provides a great degree of customisation. Browser shots lets you choose your screen size, colour depth, JavaScript and Flash settings.

Simply enter the URL of your website, choose the browsers you want to test it in and wait for it to display screenshots of your site in every browser you selected from Konqueror to Netscape.

Uptime Robot

Once your website is live, you’ll want to ensure you know if your site goes down. Uptime Robot eliminates the need for you to manually check your websites every 5 minutes by doing it for you. You can use it to track as many as 50 websites at the same time, and if one of them goes offline even for a minute, you’ll receive a notification via email.

Up next

Using Social Media to Promote Your Business

As a web design company, social media is something we use everyday. Chances are that if you are reading this, you are likely have followed the link we posted earlier on Twitter.

Back to top