Joomla Templates, Tips and Articles

Free Joomla Templates, Tricks and Tips Tutorials from The Joomla Experts for Learning

Joomla Templates, Tips and Articles header image 2

Create a Great Web 2.0 Graphics Using GIMP

December 4th, 2008 · No Comments · GIMP, web graphic

GIMP is a useful open source graphic tool. It is free yet powerful, especially when used to create web graphics.

As most of the graphic tool user, I find that GIMP is simply a good image editing software. Certain advanced graphic designer may prefer Adobe Photoshop, but it’s kind of expensive. If you are running a small business or building a website for fun, then you definitely want a free software, hence I suggest using GIMP, which can be downloaded from here:

Besides that GIMP software itself, I also recommend that you download the optional help files and animation packages. If you try to search for GIMP tutorial on Google, you’ll be able to find plenty of tutorials on how to use the program. If you are need to save your time in learning this new software, I would suggest that you try to learn the GIMP video tutorials. This is the GIMP introduction video.

After you’ve got image editing software, eg GIMP, you need to find a good background for your image/graphic. I find that the best backgrounds are scenic landscapes: mountain views, beaches, parks, cityscapes, urban vistas, forests, lakes, etc. To avoid copyright issues, you should grab a digital camera, go out and take a picture yourself from someplace near your house. Or try to search for public domain graphics. Sometimes a simple color with tone may serve as a great background. Most of the time, it depends on your preference on how to design the graphic.

Once you’ve got your background image, then you can make the graphic look nicer by adding some pictures of people, animals, vehicles, or other objects in the right or left side of the image (obviously you should use something that is related to the topic of your web site). You can get people pictures by surfing the Internet for clip-art collections, or by taking photos of your friends and family. So let’s say you want create a header for your website, and hence you can place your lovable pet dog to appear on the right side of your “Dog’s Website” header. For example, you can try to follow these steps:

1. Take a picture of your dog and open it with GIMP.

2. Resize the picture so it’s small enough to fit into your website header.

3. Use GIMP’s tool to outline the dog and copy & paste it on top of your background as a new layer.

4. Use the move tool to position the dog where you want it.

5. Zoom in and use the eraser tool to get rid of any messy edges around the dog. You want the dog to blend into the background so it’s not obvious that you copied; pasted from another image.

The last step is to add your title and sub-heading text. Obviously the title should be larger than the sub-heading. You might also want to use different colors to differentiate the sub-heading from the title. Pick an empty area in the middle of your header for the title text. The sub-heading usually goes at the bottom below the title. I like to use Arial or Impact for the font. Impact makes a good impression for the title and Arial is good for the sub-heading.

Try to use the font tool to add some effect on the text. Try to tweak the setting so that it looks outstanding and enhanced on the website header.

And that’s it! You’re done! Don’t forget to save the final image in jpg, png or gif file. So that you can use it for your website.

It sounds complicated but it’s really not that hard. Once you are familiar with the process, it should only take you 30 minutes to 1 hour to make something from scratch that looks really nice!

Wow, this is Great! Now What?

You should start to put a header graphic on every major page of your site, especially your website’s homepage. If you’ve learnt how to download thousands of websites from Joomla Template Secrets, then you should be able to find that there are many images from the template itself that you can reuse to do some little changes to enhance it for your website theme.

With GIMP, you can have really nice professional header graphics for your web site with very little time and effort. They will make your site look more attractive and will entice more people to read your content. And that’s never a bad thing!

To learn more about GIMP, you can check the GIMP video tutorials – Lesson 1.

Tags: ····

0 responses so far ↓

  • There are no comments yet...Kick things off by filling out the form below.

Leave a Comment