Design Web Template

August 25, 2010 | Filed underBackground,Designing,Effects,Photoshop,PSD,Templates,Tools Designing,Transform | Posted by NadeemSMB

3. Underneath Details
In my ‘Under Bits’ group, I have the website title at the top left, the copyright down the bottom, and some circle shapes around the top middle.

So get the text tool and add in the text. I used the font Tahoma, 11pt & 12pt, #ffffff.
Now we’ll draw these nice circles..
I made my circles by brushing on the canvas, then making some circles with the Ellipse Tool, turn it into a vector mask and added layer styles.
If you know about the pen tool and paths etc, you can do that, but if not you can make them this way…
Create a new layer and with the Elliptical Marquee Tool make a few circle selections, fill them with #7d3300.

Now apply the following layer styles:
Inner Shadow
Inner Glow

Create another layer, make some rounded selections and fill with a lighter, more yellow color, I used #e99206, apply similar layer styles as the last layer.

4. Sidebar Text
Now let’s add in the text in the left sidebar.
With the text tool, make a selection pretty much the entire width and height of the side bar, write out your text.

For the word ‘Navigation’ and ‘Updates’ text I used Tahoma, 11pt, bold, #c8c8c8. For the links text I used the same except a darker color with an underline, #b9b9b9, and for the updates links, I used the same except non-bold and with an underline.
5. Content Area Details
You can add a small banner at the top if you want, but I can’t come up with anything good for it. All I added lastly was ‘updates’ text.