Demo 2

Demo 3

Webpage Divided into Columns

Instructions:

This webpage was is designed to split the page into two parts by Columns. This is demonstrated on http://www.public.asu.edu/~pbaluch/demo3.html. To create this type of page requires the formation of three pages where two are layered into one organizing page. The main "organizing" page is the index page that will divide the page into columns. To create this page open a blank webpage and paste the following code into the html section after the </HEAD> section:

</FRAMESET>

The 20% indicates that the left column will take up that much space of the page and the right column will be 80% of the page. You can change these percentages to how you want your page formatted. You can even divide the page into multiple smaller columns if you want. In the next part, the webpages that fill those columns are listed. These are individual pages that are created and given their own address and are referenced by the index page to compose the final image. In my example, if I want to change out the right column because I pressed the "protocol" link in the left column I will have to create a protocol page that lists the frame outline above but replace pg2.html with a new page that will have my protocol data. So I now have a protocol.html page (lists frame organization), a pg_.html page (lists protocol data) and the pg1.html (links) page. This combination will create the protocol page when the protocol link is pressed (the protocol.html hyperlink will have to be inserted into the link).

Repeat this procedure with all of the links to create new page images. Once you become proficient with this technique and with the rows that work the same way you can be creative and form different combinations with both columns and rows. Some of the useful web design links that I have listed demonstrate this technique and how to divide the rows and columns and organize them the way you want them to appear (For example Voodoo's Page).

Website maintained by Page Baluch: debra.baluch@asu.edu

Last updated 2/5/2000