No Code Web Pages Part II

Well, we made a page based on example 1, now lets turn our attention to examples 2 and 3. Links do not have to appear on the left only; the following page is from the College Website (Example 2) and contains a series of links to important college information:

Example 2

The links in the yellow table are linking to areas within the white table. This is done with the use of bookmarks in Word. My links are all going to external web pages but this should give you an idea of how to use the table format to make a series of links. The first series of links on the page above (the shaded area) as well as the second series are both made using the table menu. The difference between the two is how the cell spacing is configured.

Let’s attempt to make a series of links that will look like the shaded area above. Start by adding a table to your page.

Your table will be like the one below. If you place the mouse over the table, a star like cluster will appear in the upper left hand corner of the table, along with a circle in the lower right hand corner. These two areas can be used to select and reposition your table. The lower right dot is used to change the size of the table. Note: I had to approximate the look of these two icons. They do not normally appear on the screen capture image shown below.

Place your curser in the first box, and start typing in the names of the places you want your links to go. I placed a number of web page authoring sites in the boxes. After typing in the names of your sites, insert the hyperlink. Use Insert – Hyperlink, the popup below will appear. Your highlighted text will be in the Text to display area, you can type the link in the field below it.

As in the previous exercise, your hyperlinks will appear blue with underlines. Refer to the previous section if you want to modify your hyperlink format.

Now your page should look something like the one above. Let’s format the look of the table. First, lets give color to the table. You must place your curser inside the table. Select Table – Properties from the Menu bar. A pop up window will appear.

Select Borders and shading from the above left window, and the window above right will appear. From here you can select a color and apply it to the whole table.

Your table is coming together; we just have to get rid of the lines in between each cell. Cells have attributes one is cell borders. Re open the Table - Properties box.

Again select Borders and Shading. The popup window above right will appear. You can select “None” for the Borders Setting. This will apply to the entire table. The result is the graphic below:

The same way we created the table with no lines, you can create the second table by simple inserting the size table you want, create your links, and then using the borders and shading properties box, change the border to mimic the one in Example 2. If I use the same links as before, I could rearrange my links to look like the picture below.

Your completed web page should look like the one below. Compare this to Example 2 and you will see we are right on track.

Save your table page the same way we saved our index page. File - Save as Web Page. I called my page tables.htm. Not very original but it should do the trick.

Lets do the third page type we wanted to demonstrate (Example 3), is a text document designed to give information only. A page like this may contain imbedded links within the text if you want to. For practical purposes, the most common use for this type of page is your class syllabus.

Example 3

The easiest way to update your syllabus is to import the document into Word. Below is a picture of my syllabus. Note: The syllabus pictured below contains hyperlinks to web sites with course information, a link to my email along with many reference links which I use for student assignments.

By simply selecting FILE – Save as a Web Page, Microsoft will convert your word document into XML file format which is viewable by all modern web browsers.

Your syllabus can be saved as my syllabus.htm.

Remember, your index page is the only page which will open when someone comes to your website. This page is your navigation page. All other pages must be linked from here.

Good luck.