Create A Blog Layout

1. Create a document that’s dimensions are 600×600 and fill it with black.

Picture 1

2. First, take your Rounded Rectangle Tool Picture 2, and create a large rectangle leaving some edges on the

sides and bottom. You’ll want to leave a little more space on the top. Make it look like the screen below. Then you’ll want to add a gradient overlay with these numbers

Picture 3_1

Your document should look like this…

Picture 3

3. Next we’re going to add a header to the top of the page, which is why we left the space open. First

create two guides. One at 57px, and the other at 543px. It should look like this:

Picture 4

4. Then, take your rectangle tool again and make it stretch from one guide to the other. The top of your rectangle should be just about 10px from the top. The bottom should run about 15 px into your big rectangle. Here is a picture of what it should look like:

Picture 5

Before this next step it’s important to make sure you’re still working in the same layer as the big rectangle. Because you want this top part to blend in with the bigger rectangle. Now just right click and fill it in with any color. Your document should start taking shape.

Picture 6

5. Yet again take your rectangle tool and make one that sits on top of the rectangle you just added. Make it alittle smaller than the back ground. Add these blending options. Also use the image below to gauge how big you want the header to be.

Picture 7

Picture 8

Picture 9

6. This step just take you rectangle tool and make a box right where the big rectangle expands from the smaller one on top. Your document should look like this:

Picture 10

7. This next step is kind of hard to explain in words. Take your polygon lasso tool. You’re going to create a sort of border to wrap around the rectangle you just made. Then when you get the top done, copy that layer and put it down right below. It sounds confusing, but just use the image below for reference.

Picture 11

Now, just take your eraser, and select the rectangle under the border, and erase the excess edges expanding beyond the border.

8. Again, grab your polygon lasso tool and make the same basic shape as before. You’ll want to start about 40px down from the menu. Look to this image for reference

Picture 12

9. Next we’re going to add a side bar, and area for your blog posts. Take your rectangle tool and make a box like down below and fill it with white

Picture 13

Now do the same again, only make it a slim rectangle, and put it on the left side of the layout. Again like down below

Picture 14

The rest is now up to you. You can get as creative as you want beyond this point. Add little gadgets, or make some cool text for you header. The limits are up to you.

Leave a comment