Dick's Button Tutorial


Home ] Up ]

Home
Post Your Link on My Site!
View all the Posted Links
Dick's Web Forum
Dick's Newsletter
Dick's Online Chat Room
Dick's Animated GIFS
Dick's JavaScript
Dick's Backgrounds
Dick's Horizontal Lines
Dick's Banners
Dick's Picture Viewer
Dick's FAQ
Dick's How to Link to Me
Dick's Web Design Lnks
Dick's Thanks Page
About Dick
Sign my Guestbook
View my Guestbook
______________________

To receive my newsletter, just enter your e-mail address: and click GO!

Subscribe      Unsubscribe

Tell A Friend about my site!
Type In Your Name:

Type In Your E-mail:

Your Friend's E-mail:

Your Comments:

Receive copy: 


 

              Buttons and bullets are a useful part of every web page. They can be animated, used as a hot spot for a hyperlink, or just lay around and be decorative. For whatever reason, they are a part of the web and below you will find a short tutorial, some homemade buttons, and farther down bullets that came with my Front Page 98.

        They are free to you, but please let me know where they end up so I can visit them, and
     also please add a link to my site. Thanks.

    If you want to use these,

let them finish loading,
right click on the image,
pick Save Picture As,
pick a place on your computer to put it and a name.
it's yours!

 

    If you have been to my GIF tutorial, then you are will find some of the following a review for you. Below is the basics for making your own buttons and bullets.

   Lets start with the basics,
Buttons have two functions on the web,

  1. To provide a clickable link to another page,
  2. To just lay around and look good on your page.
Buttons are nothing more than GIF's that generally do not move.
They should match your background, and blend well.
Bullets only mark the lines of a list.

 

   To make your own non-animated buttons, or bullets just follow these instructions.
Start with one of your graphics programs.
Draw a rectangle, and select a fill color. Like I have done below.

RedButtonBlank1.gif (191 bytes) This rectangle is 44x24 pixels. (Any size that looks good will do.)

Add some text.

RedButtonNew1.gif (430 bytes)

Name it and save it.
And you have it!

 

Below are some I put together to illustrate some ways to use them.
You can use a line of them, and call them hyperlinks.


RedButtonMain1.gif (432 bytes)
RedButtonNew1.gif (430 bytes) RedButtonBio1.gif (381 bytes) RedButtonLinks1.gif (425 bytes) RedButtonBack1.gif (421 bytes)

 

You can use a line of them, and make their backgrounds transparent.

RedButtonMain1.gif (432 bytes) RedButtonNew1.gif (430 bytes) RedButtonBio1.gif (381 bytes) RedButtonLinks1.gif (425 bytes) RedButtonBack1.gif (421 bytes)

 

You can animate them, and make them blink.

RedButtonHomeAni1.gif (1186 bytes) BlueButtonHomeAni1.gif (1753 bytes)

You can make an oval ones too, and do all the same things.

 

RedOvalButtonHome1.gif (474 bytes) RedOvalButtonNew1.gif (483 bytes) RedOvalButtonBio1.gif (422 bytes) RedOvalButtonLinks1.gif (481 bytes) RedOvalButtonBack1.gif (461 bytes)                 RedOvalButtonHomeAni1.gif (1256 bytes)

Once you have played with the basic buttons, get creative! Find some royalty free clip art,add some text, and make a button.


BackHandButton1.gif (1826 bytes)

 

 

Now that you see how easy it is, start making some customized buttons for your own page.

    If it looks like too much, or acquiring the software is too much, or you just don't feel like it, feel free to use any of the buttons below. I try out new ideas all the time, so check back often.

 

  From here on down are some buttons I made while working on this page. I hope they give you some ideas of your own.

 BlueButtonMain1.gif (465 bytes) BlueButtonNew1.gif (456 bytes) BlueButtonLinks1.gif (488 bytes) BlueButtonBio1.gif (429 bytes) BlueButtonBack1.gif (476 bytes)
BrownButtonMain1.gif (699 bytes) BrownButtonNew1.gif (647 bytes) BrownButtonLinks1.gif (682 bytes) BrownButtonBio1.gif (644 bytes) BrownButtonBack1.gif (702 bytes)
DkBlueButtonMain1.gif (826 bytes) DkBlueButtonNew1.gif (774 bytes) DkBlueButtonLinks1.gif (786 bytes) DkBlueButtonBio1.gif (751 bytes) DkBlueButtonBack1.gif (752 bytes)
RedButtonMain1.gif (432 bytes) RedButtonNew1.gif (430 bytes) RedButtonLinks1.gif (425 bytes) RedButtonBio1.gif (381 bytes) RedButtonBack1.gif (421 bytes)
RedOvalButtonHome1.gif (474 bytes) RedOvalButtonNew1.gif (483 bytes)  RedOvalButtonLinks1.gif (481 bytes) RedOvalButtonBio1.gif (422 bytes) RedOvalButtonBack1.gif (461 bytes)
StainedGlassButtonMain1.gif (627 bytes) StainedGlassButtonNew1.gif (573 bytes) StainedGlassButtonLinks1.gif (572 bytes) StainedGlassButtonBio1.gif (533 bytes) StainedGlassButtonBack1.gif (564 bytes)

 

These are buttons that I made with my button making software just to give you an idea of the different sort of buttons you could make, combining different colors and shapes.

 

   

 

These are some of the buttons that came with my software. They should give you an idea of what kind of buttons will come with any good software.

Blue Blank.gif (2280 bytes) Bookmark.gif (981 bytes) Dark Blue Beveled.gif (197 bytes) Flat Blue.gif (141 bytes) Grey Beveled.gif (157 bytes) Grey Blank.gif (100 bytes) Large Blue Beveled.gif (158 bytes) Pause.gif (134 bytes) Play.gif (131 bytes) Record.gif (134 bytes) Small Blue Beveled.gif (153 bytes) Small Dark Blue.gif (110 bytes) Stop.gif (135 bytes) Up Arrow.gif (883 bytes)

WB00895_.GIF (741 bytes) WB01162_.GIF (871 bytes) AN00020A.gif (1492 bytes) WB01336_.gif (793 bytes) WB01337_.gif (904 bytes) WB01338_.gif (869 bytes) WB01372_.gif (406 bytes)

 

These are a set of bullets that came with my software too.

Black Squiggle.gif (270 bytes)Blue Arrow.gif (140 bytes) Blue Diamond.gif (591 bytes) Blue Swirl.gif (150 bytes) Checkbox.gif (229 bytes) Festive.gif (983 bytes) Green Ball.gif (257 bytes) Green Square.gif (148 bytes) Green Stone.gif (462 bytes)Red Arrow.gif (101 bytes) Red Ball.gif (916 bytes)Red Curly.gif (285 bytes) Red Diamond.gif (591 bytes) Red Swirl.gif (187 bytes) Rock.gif (1120 bytes) Square Key.gif (880 bytes) Square Maze.gif (122 bytes)

    I hope this has helped you see how to make your own buttons and bullets, and also given you some ideas to help get you started on your own. So, have fun!

 

 


____________________
Buy your books online at
barnesandnoble.com Homepage Check out books on Computers   Try a quick search by Keyword Link: Web Design And be sure to check out their
Special Feature
______________________



Free Webtools for Webmasters



Free Web Tools!


______________________

CDNOW


Shop here!

Home ] Post Your Link on My Site! ] View all the Posted Links ] Dick's Web Forum ] Dick's Newsletter ] Dick's Online Chat Room ] Dick's Animated GIFS ] Dick's JavaScript ] Dick's Backgrounds ] Dick's Horizontal Lines ] Dick's Banners ] Dick's Picture Viewer ] Dick's FAQ ] Dick's How to Link to Me ] Dick's Web Design Lnks ] Dick's Thanks Page ] About Dick ]