Friday 29 February 2008

My navigation buttons

One thing I tend to look for on a site whether it be a blog or a standard website, is the navigation. Of course, a blogspot 'blog' does not have 'pages' in the sense that a standard website has, so there are no navigation buttons provided in the templates. So how and why have I included them on my blog. Let's start with the 'why'... You can quickly direct your visitors towards the answers to the questions that they may first have when they arrive at your blog. These are some of the things you should consider providing for your visitors:
'About' - an introduction to you and your blog.
'Contact' - a way for your visitor to send you a direct message.
Some sort of link to your 'best posts' - admittedly I have not done this yet...
'Home' - for easy navigation for those unfamiliar with blogs (regular bloggers know you can just click on the banner).
If you think of each post as a page with a unique URL, make posts to fulfill your requirements and publish them (I posted mine as 1st January 2007, so that they would not appear in the regular posts - there may be a way of posting them without dates, but I have not been diligent enough to research it...) - See 'post options' in the create post window for making posts appear on different dates.

And now the 'How....'
It's embarrassingly simple really, webmasters even at a low level will easily figure it out, but sometimes even the simplest solutions may help someone when clearly explained.
In short, we are going to use Dashboard/layout/elements/add a page element/HTML-javascript. And simply add HTML navigation exactly as you would in a standard website. The HTML for a navigation button requires a destination URL, a source for the graphic and may carry extra tags such as 'alt' and 'title':

Depending on the in which space you are placing the code, you may place all your navigation into one element, or separate them out. In order to save valuable space, mine are all placed in the same element.
Naturally you will need to be able to create the buttons in graphical software, I use 'Fireworks', but you could use 'Photoshop' or 'Gimp' or any other half-decent software to get nice results.
The graphic elements were designed to fit in with the colours and styles I was already using. Arguably, a better example of design to fit a theme can be seen here:


These designs can then be simply uploaded to a website somewhere and linked into the HTML as the source. If you don't have any spare web space, you could upload them into a post in blogger and then view the properties to see where blogger has stored them - however blogger has a nasty habit of compressing image files.... If you don't want the post with the images to be seen, you could then edit the post and 'save as draft'. (I have not tried this method of storing graphics, but I think it should work...)
For navigation within a website, there is no need to open in a new window, so a straight link will be fine.

No comments: