Homepage header mods using Adobe CS5

Psst:  we're doing something fun with the Homepage header this week! 

Adobe gave us a sneak peek at their Creative Suite 5 package, so we've used some of the new tools in CS5 to create five new themed headers and make some snazzy mods to some of our house ads.  It's a great way to have fun with our header, and celebrate the release of our new categories!

As a bonus for all you Photoshop artists out there, fungus amungus will be posting an Instructable documenting how he made the header images.  How did he get the laser-cut logo to float?  There are some neat new tricks that made the process super-easy. Check out How to Make an Instructables Header for full instructions!

Check back on the homepage every day this week to see what's new, and let us know what you think!

Note:  the rest of the site is normal; any changes are the result of our new categories and updated header.  The homepage header will revert to its normal orange on Saturday.

Picture of Homepage header mods using Adobe CS5
Screen shot 2010-04-11 at 7.50.53 PM.png
sort by: active | newest | oldest
Cusqueno7 years ago
Now I see what the search bar is meant to look like, but mine doesn't.  Possibly a browser (IE6) problem?   See my post in help/bugs for description.  I can't get either the Google or the normal search.
Ouch,  IE6?   Yeah, that would be my guess too.  I "have" IE8 but I don't use it in here....that doesn't even work so well.....FF seems to work the best here...
kcls7 years ago
I'm actually kinda liking it now. Makes the site look snazzy.
n8man7 years ago
 I actually really like the new header on the home page. Have it cycle through projects from all channels of the site and it would be really cool.
canida (author)  n8man7 years ago
We've covered each of the main categories, and will be posting a new one each day - check out the Instructable.
kelseymh7 years ago
Hi, Canida.  The new masthead is much cleaner than the old, and I appreciate the larger font for the category names.  However, as I've posted in a bug report, the orange/yellow/grey backgrounds cut-off just at the word "You", leaving the normal white background to the right of them. 

This has the unfortunate side effect of leaving the word "Shortcuts" (in your second picture) as white-on-white, just a bit hard to see.
canida (author)  kelseymh7 years ago
Thanks for the heads-up!
By the way, how wide is your browser?  I find this happens if I shrink my window size then scroll sideways.
kelseymh canida7 years ago
Yes, that's exactly right.  If I shrink the window horizontally, the orange/yellow gets eaten up, and the horizontal scroll-bar reveals white.  If I make the window wider, the orange and yellow expand to fill the physical space, but not into the scrollbar region.

Maybe this is just another aspect of a longstanding annoyance I have with the I'bles (and many other Web sites') design.  Good Web design for accessibility should defer dimensions, fonts, sizes, everything to the user's browser whenever possible.  Requiring a particular size screen means you are making assumptions about what the end user can see and interact with.
I need to qualify this.  You've put most of the dimensioning stuff into your stylesheet.  Users can configure their browser to override those settings, but the HTML will still be usable (e.g., you've used CSS to modify the way standard HTML UL/LI tags are rendered).  This is nice.