Photoshop Website Design – Nav Bar

www.pixelfolife.com This is the first part of a “Photoshop Website Design” series. You can find the project files and other parts of this series at: www.pixelforlife.com

22 Comments+ Add Comment

  • Nice tutorial 🙂

  • this guys is a genius, but it seems way to hard to do it yourself.

  • Nice and helpful tutorial. Thanks.

  • Good job I like your work..Very creative.

  • This is really helpful. What’s great about this tutorial compared to a lot of the other ones is that you did things from scratch rather than using elements from a project CD or file.

  • Awesome video! Your real easy to follow (for a beginner like me)… How about slicing and adding the links?

  • pixel for life i have a problems in video part 2 time 2:47 that you say some thing select delete inverse and delete i dont now how to delete please help me how can delete that

  • Great Job Man!

  • i dont understand half of it but its just fun watching you devastate with photoshop lol

  • hit delete on your keyboard

  • sub 😉

  • I cant reselect the text to change it… it just brings up the square select font space again…

  • @JustaFreak15 u either rasterized the text, meaning making the text into an image or you are just selecting it wrongly. Use the Text tool and press on the words again. if it doesnt work, means you have flattened the image already (meaning rasterized i think)

  • I think i understand what I did, because I was making that statement based on the Text Outline.. instead of the actual text.
    When I did so on the actual text, it worked fine. Thanks for gettin back to me though.

  • alt+ctrl+i

  • When you are making your header and navigation bar are you just free handing the rough size or are you somehow setting it to a specific size?

  • Such a cool design, I hope I can to your standards.

  • @mattreeves437 I know it’s kind of late, but.. When I create a header and navigation bar, I pretty much free hand it. I can normally tell at a glance if the proportions are off.

    You can also tell by going off of your navigation bar. Make you font about 15px, and then center it within a box, and work off of that.

  • how do you connect like use the a href tag?? to link the different things


  • @kurogane2x That would be HTML. Use photoshop to play around with colors and such, then you have to code it out using HTML/CSS. You can use Photoshop’s export function but that is VERY rough and I do not recommend it.

  • Lkng for a Web Developer to HELP build my website – newyork | At checkoutleads . com, it takes 2 minutes to instantly generate and contact more quality leads like this one to buyers interested in what you are offering.