Drop down menus are a really convient way to fit a large menu into a really small initial space. For a long time people have just used a form element for standard drop downs, but with minimal effort you can create a much slicker effect using jQuery and CSS.
I posted a tutorial over at Templamatic today, and you can read the whole thing in the Templamatic Blog. The tutorial is just a basic walk through explaining important style points of web 2.0 template design. From now on, I will be posting my web design tutorials over at Templamatic, but I’ll always make a little alert here to make sure everyone sees it.
Despite the fact that its quickly becoming a cliche, the style of web 2.0 still has a lot of nice techniques that are worth learning. This layout utilizes all the big web 2.0 standards: bright colors, gradient fades, drop shadows, and rounded edges. The key to all of these things is mastering selections. It sounds weird, but the key to good web design with Photoshop is making good selections. Almost every step of this tutorial includes making a selection.
This is a very popular look, and I’m not sure if it has an official name, so I’m going to just call it a ‘drop shadow overhang’ just because I don’t know what else to call it. Its basically a bar of color across the top of the page, with a box of white jetting up over the edge. Its got a web 2.0 look, so its been getting a lot of use.