Return Home Tutorials About Us Services we offer Contact Us Affiliates Site Search
Hot Extras
Tutorial Spotlight:
Carbon Fiber Pattern Create a carbon fiber texture for use on your next layout, or interface! Very Cool! read more...
Join our Mailing List to receive:
  • Site Updates
  • Photoshop Tutorials
  • Webmaster Tips
  • Hot Site Reviews
  • & much more...

  • Mailing List: Privacy Policy

    Your Link Here

    www.VidPit.com: Funny, Cool & Sexy videos!

    FREE Photo Shop Tutorial

    FSTutorials.com Photoshop Tutorials - Photoshop Cs Tutorials

    Link to us
    ( Link to PhotoshopTower.com )

    wholesale computers

    PhotoshopForce.com - Photoshop Tutorials

    Site By: Coastal Web Innovations

    Some web hosting solutions you can find yourself on WHG and a list of
    web hosting companies.
    Header Design

    In this tutorial l will show you a how to create a header for a webpage. This technique will hopefully teach you a few tricks, as well as open your mind to some new ideas when designing your next web layout.
    Lets get started.
    Page 1 of 1

    Step 1.)
    Start a new document that is: 770 x 150 and fill the background layer with: #A7A78B

    Step 2.)
    Create a new layer. With the rectangular marquee tool, make the following selection:

    Fill this selection with: #859B50

    Double click this layer, and apply the following blending options:
    Gradient Overlay:


    Step 3.)
    Next set your foreground to #DDE3D5, get out the pencil tool and change the size to 3 pixels:

    and draw the following line all the way across the page:

    Step 4.)
    Create a new layer, and with the rectangular marquee tool make the following selection for the navigation buttons:

    Now go to "Select->modify->smooth" with a setting of: 11 pixels

    Fill this selection with: #DBDAC8

    Double click this layer, and apply the following blending options:
    Inner Glow:

    Gradient Overlay:



    Step 5.)
    Next add the text to your buttons. Heres what l used: Verdana Bold, 10 pt, #6F6A64

    Step 6.)
    Next get out the pencil tool again, set it to 2 pixels, and your foreground to white (#FFFFFF)

    And draw small dividers between each of your buttons:

    Step 7.)
    Next set your foreground color to #511424 set the pencil tool to 1 pixel. We're going to make some small arrow icons under the buttons.
    Zoom in real close by pressing the CTRL and the '+' key on your keyboard to zoom in good and close. Using the pencil tool draw this arrow one click at a time.
    There's 1 dot on top, 3 dots in the second line, and 5 dots at the bottom of the arrow.


    Step 8.)
    Next I applied the logo and company name in the top left corner of the header.

    At this point the layout is pretty much done, just continue to refine and add some details. Here's how mine ended up looking after adding a little content, and a "techie" image.

    I hope you've enjoyed this tutorial, and that you've learned some new tricks & ideas.

    Home | Tutorials | About Us | Services | Contact Us | Affiliates | Search | SM | Top^