What should I do with my header?

[Crazy Pete]

Hey guys, I'm pretty new to vB but have been doing HTML work for quite some time. Basically I just need some ideas for what to do with my header, as right now it just looks rather...ehh... So, I have 12 buttons that I am using right now, and I'd like to keep them all unless things could be combined or linked to in other ways.

Check out http://www.expectedmiracles.com/forums and let me know what you think I should do with the header please. Center the logo with the buttons all below it in one big line? Put them below it where it is now in the left? I just need some ideas, thanks!

[Crazy Pete]

No one has any other ideas? I did end up doing the whole centering thing, but...I'd like other ideas/opinions as well.

[Xenon]

well depends on you, i like the standart in it, at least partially, so i'd put the logo to the left, dan on the right side the 12 buttons in a 4x3 block

[Talisman]

Not much help from me, I'm afraid. But I agree with Xenon's suggestion to move the image back over to the left. The stronger coloring on that side makes it look like it's supposed to be on the edge. If you want to keep it centered, maybe you could lighten or feather out the left edge of it.

The smaller version compared to the image on your home page looks better. Seems to fit well with the forum.

If you don't want a straight line of buttons, you could group them like Xenon said .... or maybe arrange them in some other pattern. Have a screenshot of an option below..... as it was just easier to paste that together than figure out how to describe it.

Have fun.

[Crazy Pete]

I like that, Talisman. Can you do me a favor though and paste the code for that part of the header template? Of course when I changed to what I have now, I forgot to save the original.


Edit -- Nevermind, I forgot about that "View original" link. Looks really nice, thanks!

[Crazy Pete]

Actually, I tried what you did and I got it working, except that there's kind of a gap between all the images...here's what I have for my header...

<!-- logo and buttons -->
<center>
<table border="0" width="{tablewidth}" cellpadding="0" cellspacing="0">
<tr>
  <td valign="top" align="left" bgolor="#C4CBD3"><a href="index.php?s=$session[sessionhash]"><img src="{titleimage}" border="0" alt="$bbtitle"></a></td>
  <td valign="bottom" align="right" nowrap bgcolor="#C4CBD3">
   <!-- toplinks -->
<center>
   <a href="usercp.php?s=$session[sessionhash]"><img src="{imagesfolder}/top_profile.gif" alt="Here you can view your subscribed threads, work with private messages and edit your profile and preferences" border="0"></a>
   <a href="register.php?s=$session[sessionhash]&action=signup"><img src="{imagesfolder}/top_register.gif" alt="Registration is free!" border="0"></a><br>
   <a href="calendar.php?s=$session[sessionhash]"><img src="{imagesfolder}/top_calendar.gif" alt="Calendar" border="0"></a>
   <a href="journal.php?s=$session[sessionhash]"><img src="{imagesfolder}/top_journal.gif" alt="Journals" border="0"></a>
   <a href="vbstats.php?s=$session[sessionhash]"><img src="{imagesfolder}/top_stats.gif" alt="Stats" border="0"></a>
   <a href="chat.php"><img src="{imagesfolder}/top_live-chat.gif" alt="Live Chat" border="0"></a><br>
   <a href="refer.php?s="><img src="{imagesfolder}/top_referrals.gif" alt="Refer Friends" border="0"></a>
   <a href="http://www.expectedmiracles.com/donate.html"><img src="{imagesfolder}/top_donate.gif" alt="Donate" border="0"></a>
   <a href="memberlist.php?s=$session[sessionhash]"><img src="{imagesfolder}/top_members.gif" alt="Find other members" border="0"></a>
   <a href="misc.php?s=$session[sessionhash]&action=faq"><img src="{imagesfolder}/top_faq.gif" alt="Frequently Asked Questions" border="0"></a><br>
   <a href="search.php?s=$session[sessionhash]"><img src="{imagesfolder}/top_search.gif" alt="Search" border="0"></a>
   <a href="index.php?s=$session[sessionhash]"><img src="{imagesfolder}/top_home.gif" alt="Home" border="0"></a>
   <!-- <a href="member.php?s=$session[sessionhash]&action=logout"><img src="{imagesfolder}/top_logout.gif" alt="Logout" border="0"></a>  -->
</center>
   <!-- /toplinks -->
  </td>
</tr>
</table>
<!-- /logo and buttons -->

<!-- content table -->
<table bgcolor="{pagebgcolor}" width="{tablewidth}" cellpadding="10" cellspacing="0" border="0">
<tr>
  <td>
  $nptext

[Talisman]

Sorry, Pete. I couldn't code my way out of a paper sack...... yet.

That's why I hang out here so much -- getting ideas for stuff I wouldn't think of on my own. And solving problems I didn't know I had.

Had another idea as I was pasting together the image though. Having seen your site, the buttons reminded me of different chord finger positions someone might press on a guitar. Thought it might be nice to include very subtle lines or criss-crossing to suggest strings that run underneath the buttons.

Couldn't figure any way to show that..... but it might add a nice touch to continue your theme.

Cheers!