|
|
|
| INSERT>Table>Table | Creates a new Table with information you add as needed |
| INSERT>Table>Row | Inserts a new Row at the insertion point |
| INSERT>Table>Column | Inserts a new Column at the insertion point |
| FORMAT>Table Info | Allows you to change information and properties for an existing table. Has 3 tabs allowing you to change properties for the table, for a rows or a cell |
A table allows you to get around some of the basic limitations of web page layout. In their basic form, a table is just a table. But using some simple tricks, you can create some impressive pages.
Essentially, you envision your page laid out in a form that can be reduced to a series of rectangular areas. For example, look at the table above, describing some of the information that will be presented in this module.
The information is presented in a table format, with 2 columns and 5 rows. If you wish, you can see the framework behind the text by editing this page (FILE menu>Edit Page).
If you tried to create this table in a web page, you might try using the space bar to line up the second column. But remember, web pages are words and picture references, nothing more. You might get your page laid out as you want by spaces and "brute-force," but when you "publish" your page on the Web, alignment of columns would not be as you had planned. In essence, there are no Tabs, there are no Indents (with some exceptions) and the space bar only works for one space between words.
If you use the space bar multiple times, it may look acceptable in Composer, but when you Preview it, spacing could be vastly different. (To see an example of this, click here... the table on that page was created by spaces and forced to look like the one above in Composer. Depending on your web server or browser, you may or may not see a difference.) So, the way around this is by using a table.
For a practice example, we will create a web page that has a chart of the color distribution of colored chocolate candies. The final chart will look similar to this one:
1. For this exercise, we will create a new composer page. You can do this by FILE>New>Composer Page.
2. Now type the title "My Chocolate Candy Data", make it Heading 1, and center it on the page.
3. Now type the sentence below, make it left aligned, and make it "Paragraph" text.
Here is what I found by counting candy:
and then press the RETURN key.
4. Now click on the "Table" icon
in the Toolbar (or pull down the INSERT menu to Table...).
5. In the following screen, enter 5 in the Rows box and 2 in the Columns box. Notice the other options on the page but don't change any of them just yet. Click INSERT or OK when done.
6. Now enter the information in the corresponding boxes as below. TAB or click to move from one box to the next.
7. Now select (highlight) the word Color and make it BOLD (don't use Apple-B or Control-B since some versions of Composer use these keys to Edit your Bookmarks- if you want to be sure of the shortcut for BOLD, see the FORMAT>Style menu)
8. Do the same for the word Number (make it bold)
9. Now make those words Center aligned within the table.
10. Now make the numbers (just the numbers) align to the RIGHT.
11. Now click (if the insertion point is not already there) somewhere inside the table.
12. Pull down the TABLE menu to Table Info (on PCs, it will read Table Properties)
13. Now to "shrink" the table, click the TABLE tab and check the box in front of "Table Width" and change the percentage to 25 (This will give the table 25% of the window, however the user has sized it)
14. Now center the entire table on the screen (TABLE>Table Properties
then Table Alignment>Center)
Note: Composer handles Tables differently than other programs. A more precise statement may be, " Different programs handle tables in their own way- check each program's help or documentation for more information." An even better statement may be "Play with the options until you get what you want!"
15. SAVE your work under the name Page3.html in your
WebProject folder.