Expression Web 4: Creating button for Hyperlink by using Image

The Expression Web 4.0 provides us the easiest way to create an image looking like button for our website. In this Article I am describing the way of inserting image to our webpage and convert it to look like a "BUTTON".

1. Open your Website where you want to place this "button like Image" in your Microsoft Expression web:
   
   
    
2. Double-Click on the index.html, and now you have to decide that at which place you want to place your Image that you want to use as a button on your web page, and to do this click on the Insert dropdown menu from the Web's toolbar, choose Picture and then From File.
   
   
    
3. Choose the picture and click on Insert button, when you click on insert you see a "Accessibility Properties" pop-up appeared; type "Mybutton" in the alternate text:
   
   
    
4. You see now that your image is on your webpage, If you want to change its place use drag and drop for that;
   
   
    
5. To give your Image a button like appearance Click on the image to activate the toolbar.
   
   
    
6. Choose bevel option for your image:
   
   
   
   So, your Image will now look like this:
   
   
   
   Note: you can use any of the options to make modifications to the image that has been selected.
    
7. It's time to link it to whatever destination you choose, and to do this choose any one of the option from Circular Hotspot or rectangular Hotspot ( I have used a rectangular hotspot as it is closer to the shape of our image) , draw a hotspot over the image including as much of the area of the image as possible:
   
   
    
8. When you release the mouse key, the Insert Hyperlink dialog box will appear. Type in the URL or file name for your hyperlink and click OK.
   
   
    
9. Save your webpage and go to the file menu to see the preview, and also click on the your recently made button to check that it is working or not:
   
   
    
10. My Webpage with a newly made button in the preview screen is as under: