WordPress Design Tool

Keith from shrewdies — Tue, 08 Dec 2009 20:59:21 +0000

The most essential WordPress design tool is not part of WordPress – it’s an image editing program called GIMP.

I use it every day, so I’ll take this opportunity to describe why it is essential during all the phases of managing your WordPress website (and all other websites unless you’ve got an unhealthy textual obsession).

freeche Web Traffic Logo

The prompt to write this today came from using GIMP to help me prepare to launch a new site. Very few WordPress themes comes complete with images that are perfect for your site. In any case, you really need a unique logo to emphasize your unique purpose.

I’ll explain the reasons for creating images for your website. Then I’ll do a quick run through of the GIMP features I used to create the image you see here. This is not a GIMP tutorial – there are plenty of those available on the Internet – but it gives you an overview of the process, and lets you see how easy it is.

WordPress Design Image Requirements

In addition to your logo, there are also WordPress design considerations with other aspects of your theme. Many themes use background images to enhance certain features and functionality.

Last, but not least, you need images to decorate your posts and pages. Images are indexed by search engines, and are another way to attract web traffic. Equally importantly, they add interest for your visitors, and encourage people to return to your site.

Useful Image Editing Features

Image Sources

GIMP Screenshot Morguefile

You can take your own photographs, but there are also many sources of free and cheap images on the Internet. One good source is morgueFile pictured on the right, but the one I use most is Flickr.

As you see from the image on the right, GIMP allows easy screenshots (a window or full screen), and images are easy to crop to size.

Heavy Traffic at Buenos Aires (pano)

For my logo image I started by copying the image on the left from Flickr (click it to see the original). GIMP makes it easy to either copy and paste the starting image, or save the image on your local storage, and edit from there.

Please be sure to check the copyright restrictions. If you want to go beyond the published copyright (e.g. you might want to edit an original when no derivative works are permitted), contact the owner with your plans – you will usually get a positive response, but if not, there are millions of other images that you can use.

I’m indebted to lrargerich for the traffic picture. He shares his images with anyone prepared to share his accreditation. He has some very special images on Flickr, and some amazing photographs and explanations on his website.

In my composite picture, I wanted to focus on the traffic element whilst retaining some of the background. I used GIMP to crop a strip from the photograph that suited my purpose.

Image Manipulation

Not only is GIMP an amazingly full featured image editing program, it is also Open Source, and there are many add-ons for it.

Pan to Bow

One such add on is Pan to Bow (click the image for more details) from another Flickr contributor – theilr. Using this filter is simplicity itself. Make sure that you Select – None, then choose Pan to Bow from the bottom of the Filters list. Select the angle that you want to rotate your panorama – that’s it. A traffic panorama transformed into a traffic rainbow (or arch).

To add the text, I chose the Neon Logo tool, which creates a separate image. I created three logo pictures for the 3 lines of text, pasted them into my traffic rainbow and scaled them to fit.