Ruby on Rails Redesigned Header

Over at Stylegala I made a comment regarding the Ruby on Rails website being featured there. In general I think the site gives off the normal 37ish glow, but with one glaring exception: the header is really ugly.

Not the logo, I think the logo is absolutely flawless and whoever designed it should be commended for their hard work. But the header itself is poorly designed: the type is incorrectly set, the leading is off, padding between elements is slightly skewed, and it looks like the anti-aliasing of the text is a little wonky. All in all, it's a simple header that with a little bit of TLC could look pretty nice. Not being one to not backup my comments, I decided to redesign the header myself.

Old Header & New Header!

The old one used a typeface that either was Interstate, or one that looked like it, so I kept with the same one for posterity. The major problem with the old header is that the weights of the two lines looked too similar for either to stand out. Even though one was black and the other grey, the two lines blended together and didn't feel right. The vertical padding between the logotext and the tagline was too small, so I aligned the two lines and gave them a little more spacing.

To jazz it up a little bit, I used the ruby color in the logo for the new logotext, and then gave it a few layer effects so it would stand out as being a bit more important. Thoughts?

(And if the RoR people are reading this, feel free to steal the image and just stick it up there!)

Comments

[Glen C.]

Awesome. I'm going to try and put it in a greasemonkey script. Good work.

[Glen C.]

(If you don't mind) (I hate double comments :( )

[Dominic]

I believe the wonderful Jon Hicks designed the Ruby On Rails logo.

[Honus]

Dude I think you have too much time on your hands.

:)

Also, I think you have an unclosed [strong] tag.

:P

[Darice de Cuba]

They have this new logo and design for some time now if I'm not mistaken. I really like the logo, although now you remarked about the header I noticed it too. When I get on their website I'm all for the content so I barely notice design details.

But this website is a wiki and I think the design serves the purpose perfectly.

[Jakob S]

That looks great, Mike. Thanks a bunch - consider it snatched :)

The logo is originally made by Jon Hicks, but after it was open sourced we got the current logo, made by Olivier Hericord who did a great job on improving it.

[Mike]

Jakob - Awesome! Thanks man!

[David Heinemeier Hansson]

Thanks, Mike. The new header has been integrated with the site.

[Ben Eastaugh]

A nice change: fits well with the rest of the site, and adds that little bit of polish it needed. Good job.

[Jeff Croft]

A big improvement. The web just keeps getting more Rundle-licious every day.

[Adam Michela]

Ah, that looks better. What is RoR.org with its standard Hieraki template doing on Style Gala though?

[Glen C.]

Makes my job a lot easier. ;D

[derek]

Typography is a big improvement. The white border on the letters really bothers me. Too McDonalds.

[Brian Doherty]

Yeah, I'd second the comment above re. the borders. I like the change overall, but I'd vote for ditching the drop shadows. The white borders plus the shadows just seems like too much to me. Thanks to the artist, though; even if you ignore the comments at keep it as-is, it's still a big improvement!

[Joe Clay]

I, too, will have to agree with the two guys above me. I'm not digging the white border so much, but the design is definitely an improvement.

[Jakob S]

@Adam Michela: www.rubyonrails.com is the originator of the design. Hieraki (being a Ruby on Rails project) is using the RoR.com "template".

[3stripe]

rubyonrails.com does NOTHING for me at all.... (maybe it's the sickly colour scheme?)

[David Jones]

Good job :-) An improvement for sure.

[logo design]

The good thing about your information is that it is explicit enough for students to grasp. Thanks for your efforts in spreading academic knowledge.