Creating tables, using tables for data and layout


Student Learning Outcomes:

1. Discern the difference between data tables and layout tables.
2. Crate a table to display and organize data
3. Merge table columns or rows
4. Create aplan for layout tables
5. Create a table for layout.
6. Learn how to nest a data table within a layout table.

Important points:

1. Data table -purpose is to align text and number in columns and rows.
2. Layout table - align text and images on the page
3. Nested table - table inside of a table
4. Tables start with <table>, <tr> table row </tr>, <td> table data (creates columns)</td></table>  <th>table header</th>
5. Table borders are the horizontal and vertical ruled lines both outside and inside the table.(table gridlines, table grid)
6. Create a table:   place your cursor where you want the table and click insert table button on common toolbar,  you will see:

Table Grid

a. high light the number of rows and columns you want and release.  A table grid will appear with the number of row and columns you selected.
b. Click on the code tab you will see:

table code 

7. Cell padding is the distance between the contents of a cell and the edged of the cell.
8. Cell spacing is the distance between table cells
9. Table properties- right click anywhere in the table you will see:

Table properties

10. In the table properties you can set table size, layout, borders, background colors or picture, layout tools, and Set.

11. To insert a row.  click anywhere in last table cell and touch the tab key which will create another row or click on table in the menu bar, pint to insert, then choose.
a. column to the left
b. Column to the right
c. Row Above
d. Row below.
12. to display interior grid: select all cells, right click table, click cell properties, You will see:

  cell properties 

 13. Enter the size and color for the interior grid.

14. A layout table is a framework that holds a page contents
15. a layout cell is a region in a layout table that displays text, pictures, and other features
16. A layout table can be created by table draw feature or from the template gallery of table layouts.
a. Create a blank web page and save,
b. Click task panes, click layout tables. You will see in the bottom left hand corner of the screen.

Layout table task pane

c. Select the layout that you want.

17. Setting Vertical alignment
a. right click the cell
b. click cell properties from the shortcut menu:  You will see:

Cell Properties

c. click the vertical alignment list arrow
d. click either top middle, baseline or bottom
e. click ok.

18. Table autoformat

a. Put your cursor in the table
b. click table on menu bar
c. point to modify
d. click table autoformat you will see:

Table auto format

e. Select the format you want.

19. Table toolbar offers many option for formatting the table.
  Table toolbar

20. Insert table command can be used to create a table
21. Tables can be nested inside of tables
22. You can insert columns and rows in an existing table
23. Merge a group of cells spans multiple columns or rows.
24. Split a cell into rows and columns
25. A table caption is a title that appears either above or below a table.

Best Practices: