Peirce College - Examples of Page Layout Sketches to Help You Create Your Web Page Layouts

You are expected to create three (3) sketches using Word and its Drawing Toolbar to show how you want your Web pages to be laid out. (If you are taking this course in the classroom, you may use paper and pencil to create these three sketches.) You should read the project requirements, all of the first and second weeks' reading assignments, both the text and posted online notes, before trying to do this. Again, be sure to review the posted project requirements and your site map that you submitted.

I will expect your final Web site project to somewhat resemble what you are sending me at the beginning of the course.

Keep the design layout of your home page fairly simple. KISS - Keep it simple student... Avoid multiple columns for your home page and links stacked along the left side, because that will require you to know how to code tables. You'll learn about tables after working on your home page, and you'll apply TABLE coding to your "hobby" pages.

Use rectangles to depict graphics and describe all graphics that you are including in your page layouts. Do not write only "Picture", instead write something like "Picture of a box kite". In other words, I'm expecting you to let me know what the picture will be showing.

Indicate to where each link is connected. Use the words that you'll be using as links.

Please show where the fold line will occur. Make your best guess.

The red line in the sketch depicts a red horizontal line (rule). Show where you will be placing your horizontal lines.

To the right is a second version that is less specific. It shows a "generic" headline and sub headline names, "generic" descriptions of the pictures, and "generic" words that will be used as links. Your layouts should have specifics like I've shown above in the top example.

Lastly, I am expecting the use of sub headlines and horizontal lines. Please review the Project Description. I've made statement(s) requiring their use in your project. Please sketch other required items that are required by the Project Description.

You should use rectangles with the word "Text" inside to represent paragraphs like I've shown. Please indicate how many paragraphs are being represented by the rectangle.

At this stage you do not need to provide me the content of your paragraphs, but I am expecting you to let me know what words you are using for headlines and sub headlines. I'm also expecting you to provide me the words that you'll be using for links.

Here is another page showing a different arrangement of pictures and paragraphs and headlines, except I haven't shown paragraphs with rectangles like I want you to use (see the top example).

What you need to do is what people do who create newspapers and magazines do. You decide how you want to arrange the items that will be placed on your Web pages. This is your opportunity to be creative. Have fun...

NOTE: You do not need to fill your rectangles with colors.