RidgeStar
About
Locations
Manual
Reference
Notices
Email
HTML
Animation
Color Chart
Fonts
Frames
Heavy Graphics
Tables
Internet
Passwords
Processes
Results Lists
RidgeStar
Tools
Service
Logon
RidgeStar

Reference: HTML-Tables

Logontranslate
Get Started |Calendar |Locations

While not every Site makes use of the familiar HTML TABLE tag, most do. This page presents several common alternatives for you to consider when you are selecting a "standard" for use on your Site.

Yes, RidgeStar recommends that data displayed in a Site in a Tabular format should normally be presented in a consistent style and appearance within the Site. This does not mean that every TABLE must have an identical presentation, but you should strive to have every table with a similar purpose appear the same as others with the same purpose.

TABLEs basically have 4 general characteristics that can generally effect how they appear on a Site. We reference them as Borders, Backgrounds, Headings, and Alignment.

Borders
The Borders around a table permit the data contained within a single cell to have an organized and "contained" appearance.
Backgrounds
The background treatment in headings, rows, columns, and/or cells can provide a nice visual connection between related data.
Headings
Key titles on top of columns or to the left of input fields can help identify the data being displayed in the table.
Alignment
The number of text characters in cells in the row and all the cells in a specific column will affect the relative width of the columns. Centering in the cell is quite often appropriate, but not always.

Sample Table Presentations

The following samples are just that - Samples. These are by no means the only variations of the basic TABLE elements. On the other hand, they do demonstrate how the various treatments can have a significant impact on the presentation of data.

#1. No Formatting#2. Light color with some dimension
Line1Contents2Contents3
Line2Contents2Contents3
Line3Contents2Contents3
Line1Contents2Contents3
Line2Contents2Contents3
Line3Contents2Contents3
#3. Graphic Header Shaded Background and Small Border#4. Dotted Red Border with Valentine Theme
Graphic header
Line2Contents2Contents3
Line3Contents3Contents3
Line1Contents2Contents3
Line2Contents2Contents3
Line3Contents2Contents3
#5. Framed Borders, Heading with Background and highlighted cell#6. Cloud Table with White Data
Heading1Heading2Heading3
Line1Contents2Contents3
Line2Contents2Contents3
Line3Contents2Contents3
Heading1
Line1Contents2Contents3
Line2Contents2Contents3
Line3Contents2Contents3
#7. Happy Halloween!#8. No Borders or Spacing, Alternating Shaded Backgrounds by Row
Halloween
MonstersGhostVampire
CandyCandy CornChocolate Bars
ActivitesCostume ContestBobbing for Apples
Heading1Heading2Heading3
Line1Contents2Contents3
Line2Contents2Contents3
Line2Contents2Contents3