Web 2.0 Navigation Design
 

Start this out with a 500×200 blank canvas. Drag a gradient like so over the canvas.
Left= #d3d3d3 Right= #f8f8f8. http://www.muhakeme.net/forum/forumr...icture14-1.png Using the line tool, draw a 2px line across the canvas with #d3d3d3 as the foreground color. Mine looks like this: http://www.muhakeme.net/forum/forumr...icture25-1.png Create a new layer and name it "Tab Bottom."
Grab the rounded rectangle tool. Set your radius to 6. Draw a rounded rectangle. Remove any of the tab above your horizontal line. It should look like this: http://www.muhakeme.net/forum/forumr...icture34-1.png Add the following layer styles: http://www.muhakeme.net/forum/forumr...icture44-1.png Left= #bebebe Right= #c8c8c8.
http://www.muhakeme.net/forum/forumr...icture54-1.png Your tab should look something like this: http://www.muhakeme.net/forum/forumr...icture64-1.png Duplicate the "tab bottom" layer. Name it "tab top." http://www.muhakeme.net/forum/forumr...icture74-1.png Add this gradient overlay - Left= #f9f9f9 Right= #f6f5f5. http://www.muhakeme.net/forum/forumr...icture84-1.png Lower the opacity of "tab top" to around 80%. Hopefully, you have something like this: http://www.muhakeme.net/forum/forumr...icture94-1.png Type in some black text. I wrote 'home.' Lower the opacity of the text to around 67%. http://www.muhakeme.net/forum/forumr...cture104-1.png For this step, grab the pencil tool with a 1px size. Draw these small details on the tab in a slightly darker gray. http://www.muhakeme.net/forum/forumr...cture231-1.png So far, your tabs should look like this: http://www.muhakeme.net/forum/forumr...cture123-1.png Duplicate all these layers: Tab bottom, tab top, and the designs on the tab.Put these layers underneath the original tab and position them underneath your original tab. On Tab Bottom Copy, use this gradient overlay - Left= #2a2a2a Right= #4e4e4e.

http://www.muhakeme.net/forum/forumr...cture133-1.png On Tab Top Copy, add this gradient overlay - Left= #222222 Right= #2e2e2e. http://www.muhakeme.net/forum/forumr...cture143-1.png Change the text on this second tab. I made mine white, opacity 67%. Mine looks like this: http://www.muhakeme.net/forum/forumr...cture152-1.png Make a selection over the top half of the black tab. http://www.muhakeme.net/forum/forumr...cture162-1.png Create a new layer. Title it "gloss." With the gloss layer selected, Cmd+Alt+Shift click the thumbnail for Tab Top Copy. Your selection should automatically look like this: http://www.muhakeme.net/forum/forumr...cture172-1.png Drag a white to transparent gradient vertically across this selection. Lower the opacity to around 5% to get this smooth gloss effect. http://www.muhakeme.net/forum/forumr...cture182-1.png I went ahead and made a second black tab: http://www.muhakeme.net/forum/forumr...cture192-1.png For the last part of this tutorial, I really want to add in a distinct tab for my RSS feed. Go ahead and duplicate one of your current tabs and drag it to the right edge of the canvas.I added the following gradient overlays to Tab Bottom and Tab Top respectively: Left= #fea203 Right= #c98001.
http://www.muhakeme.net/forum/forumr...cture202-1.png Left= #fea203 Right= #ff8a00.
http://www.muhakeme.net/forum/forumr...cture212-1.png I changed the text to RSS and shortened the size of the tab. My final product looks like this: http://www.muhakeme.net/forum/forumr...cture241-1.png