How to Create Buttons in Dreamweaver CS5

Keep the text on your buttons simple to avoid confusion.

Adobe Dreamweaver CS5, an application designed to assist web designers, provides several options for adding links to a webpage, including turning images into links. This is known as creating a button; clicking on the image executes a command. On many websites, the image used for a button tells the user what the button does. For example, an image of a letter may open an email prompt and an image of a camera may take the user to the "Photos" page.

Instructions

1. Open the Adobe Dreamweaver CS5 program. Click on the "File" menu and select "New" or "Open." If you are opening a project in progress, highlight it in the pop-up window and press "OK."

2. Insert artwork by clicking on the "Insert" menu. Click on the arrow next to "Images" and scroll to the line that reads "Image."

3. Resize the image, if desired, by dragging its corner inwards or outwards.

4. Click on the image so it is selected. Navigate to the Properties panel and mouse-over the URL field. Click on this field and enter the appropriate URL. This will turn your image into a button that takes users to the URL. Alternatively, turn the image into a button with a relative URL by clicking on the icon next to the "URL" field. In the pop-up window, locate the appropriate file and highlight it. Press "OK." This turns your image into a link that takes users to the file you selected.

5. Highlight the number in the Border field and enter "0."

Tips & Warnings

• Design your buttons in an image-editing program such as Paint or Photoshop.

References

• The Site Wizard: How to Make Your Images Into Clickable Links
• Adobe: Adobe Dreamweaver - Use the Insert Panel