How To Create Cool Image Buttons

[SaNJ 0]

Hi guys ...I m making a personal site thats for me a nd my friend group. What I need is a tool which can make cool image buttons to use in my HTML pages.Is there any site which offers such software or the buttons itself for free. I would like to make them on my own, I just need to know the tool.I can't go for an expensive tool like photoshop or corel. So please suggest me a free tool.Thanks...

[galexcd 0]

It's not very professional looking, and you don't get nearly as many options as you would if you use photoshop, however Cooltext buttons page sounds like it may be something that you could use. Cooltext a free online image generator that allows you to easily render logos and buttons with minimal graphics knowledge.

[dimumurray 0]

Hi guys ...

I m making a personal site thats for me a nd my friend group. What I need is a tool which can make cool image buttons to use in my HTML pages.

Is there any site which offers such software or the buttons itself for free. I would like to make them on my own, I just need to know the tool.I can't go for an expensive tool like photoshop or corel. So please suggest me a free tool.

Thanks...

I don't know of any graphics apps that are specifically geared toward button creation. However I can suggest a few opensource general purpose graphics applications that are pretty much on par with their commercial counterparts.

 

A great tool for creating digital images as well as photo manipulation is the GIMP.

You will have to invest some time to learn the basics of the app, but if you have ever worked with a graphics tool before you won't find the learning curve as steep as would a beginner.

 

There are a number of tutorial sites out there that show you how to create a number of effects -- including buttons -- with the GIMP. Here's a list of a few I have found useful in the past:

gimp-tutorials.net

 

https://www.gimp.org/tutorials/

 

http://www.gimp-tutorials.com/

Chances are with a little googling you'll find even more tutorials...some of them even categorized .

 

You might also want to try out a few other open-source apps like Blender3D or InkScape.

Edited August 14, 2008 by dimumurray (see edit history)

[etycto 0]

I don't know of any graphics apps that are specifically geared toward button creation. However I can suggest a few opensource general purpose graphics applications that are pretty much on par with their commercial counterparts.

 

A great tool for creating digital images as well as photo manipulation is the GIMP.

You will have to invest some time to learn the basics of the app, but if you have ever worked with a graphics tool before you won't find the learning curve as steep as would a beginner.

 

There are a number of tutorial sites out there that show you how to create a number of effects -- including buttons -- with the GIMP. Here's a list of a few I have found useful in the past:

gimp-tutorials.net

 

http://www.gimp.org/tutorials/

 

http://www.gimp-tutorials.com/

Chances are with a little googling you'll find even more tutorials...some of them even categorized .

 

You might also want to try out a few other open-source apps like Blender3D or InkScape.

if you very "artistic" and know how to use image editing software or can learn how to go with is idea because it let's you do whatever you want and is not limited to what the provider offers.

and you could add it to the site using the HTML "a" and "img" tags:

 

<a href="link to where ever" ><img src="link to image" /></a>

and vouala

 

 

It's not very professional looking, and you don't get nearly as many options as you would if you use photoshop, however Cooltext buttons page sounds like it may be something that you could use. Cooltext a free online image generator that allows you to easily render logos and buttons with minimal graphics knowledge.

if you want to do this quickly and maybe easly go with his idea but you will have to use whatever they give you

[SaNJ 0]

Thanks etycto and dimmumurray...for your advice..

I have tried the pages and resources u both refered and found them quite useful.

cooltext button site is quite good indeed. For starters like me it can be quite helpful.

 

Now what I need to learn is how to make hovering effects with the images I make with the tools u described...I have tried making two different images and replacing them to get the effect, but they didn't look that good. So are there other ways to make hovering effect in images that I use for buttons or as the image itself. Thanks..

[etycto 0]

Thanks etycto and dimmumurray...for your advice..

I have tried the pages and resources u both refered and found them quite useful.

cooltext button site is quite good indeed. For starters like me it can be quite helpful.

 

Now what I need to learn is how to make hovering effects with the images I make with the tools u described...I have tried making two different images and replacing them to get the effect, but they didn't look that good. So are there other ways to make hovering effect in images that I use for buttons or as the image itself. Thanks..

this is actualy very easy to do. it is thought here at W3school. it's realy basic javascript here's the code.

 

<html><head><script type="text/javascript">function mouseOver(){document.b1.src ="b_blue.gif";}function mouseOut(){document.b1.src ="b_pink.gif";}</script></head><body><a href="http://w3schools.com; target="_blank"><img border="0" alt="Visit W3Schools!" src="b_pink.gif" name="b1" width="26" height="26" onmouseover="mouseOver()" onmouseout="mouseOut()" /></a></body></html>

all it is, is that you create two javascript functions: "mouseOver()" "mouseOut()"

then you create a link with the default image "b_pink.gif" then you add "onmouseover" and "onmouseout" and then point them to the correct function. and you are done.

 

check W3school for a more detailed explanation

[PhyberOptycs 0]

If you are looking for buttons that look very nice together, you might want to look into CSS buttons.
They can produce very nice a varying effects, like having images under them to create color changes and other....odd and unique things theat will please the eye...haha.

http://www.pagetutor.com/button_designer/index.html

This is a CSS button creator I found. You may find it useful.

[keego 0]

to be honest, if your not willing to pay for a software like photoshop and all just because its too expensive. then download. Im sorry if anyone here may be against it. But cmon. Everyone does it. Just download the software if you are very desperate. or download photoshop trial and use it for the buttons and then ur all good.