Step 5Design the B'uttons
1. You could have basic text links to each page. The easiest option, but may look a little basic. However, with some clever html you can make these look really good. I'm not that clever.
2. You can create a single image for each button. But the button must be designed in a way that users will know it's a link. I recommend making the text underlined.
3. Roll-over image buttons. Looks good, can be designed to sit well with the default Platial map colours.
I will cover option 3, but be aware of these limitations. These buttons and the text on them are pure images. Users who have limited sight and who like to increase the font size on your webpage will not be able to do so with this option. Also, if you decided to change the name of the button at a later date you must rebuild the button from scratch.
Ok, I built up the button using a vector graphics application called Omnigraffle. There are many free, open source apps which will do a similar job. For the mac I recommend Inkscape if you dont have Omni.
For roll-overs to work, you need two final images. I chose to indicate the button is clickable with a text shadow. In the image you can see the two final variations of the button, a & b.
| « Previous Step | Download PDFView All Steps | Next Step » |
![]() |
Add Comment
|









































