Her

Home Photoshop Tutorials Web Layout Designing a Web 2.0 Look Home Page for a Corporate Site

Designing a Web 2.0 Look Home Page for a Corporate Site

Author: PhotoshopForFun.com Author's URL: http://photoshopforfun.com More by this author

Start by applying a gradient (light gray to white) to the background. Create two gray rectangles using rectangular shape tool. Place it on the top and bottom as shown.

image 1

Create a rectangle for the header using rectangular shape tool. Apply gradient overlay style. Use a web 2.0 color like lime,red or orange.

image 2

Create a line using line tool. Fill it with white color.

image 3

Double click the layer to open layer style window. Apply settings as shown.

image 4

image 5

Duplicate the layer twice and place as shown.

image 6

Create two more rectangles for the content area as shown. Apply same layer style.

image 7

Create an icon of nine very small squares using rectangular shape tool. Insert this icon with each link name as shown.

image 8

Create two rectangular bands. Place them as shown. Apply same gradient we used for the header.

image 9

Create a square as shown.

image 10

Insert a relevant image. Move this layer right above the square layer in layer order in layer palette. Press Ctrl+Alt+G to create a clipping mask.

image 11

Similarly insert more images. Type content and information next to the images.

image 12

Populate the template by inserting more images, text and company name & logo.

Designing a Web 2.0 Look Home Page for a Corporate Site
Click to enlarge