I remember the first table I developed for the Internet. I liked the embossed look. And, I especially liked the way it let me organize my text. The first HTML word processors didn't support creating tables. But that's changed. And, as the distinction between HTML authoring and word processing blurs, tables have become a powerful and flexible formatting tool.

Return to Newsletter

You May Not Even Recognize Tables When You See Them

Chances are, when you see a table on the Internet, you won't know it's a table. It may be used to indent text (as it is in this newsletter), align graphics or position text and graphics side by side.

The secret is to make the table borderless. The rest is up to your imagination!

More information about:

Pull Quotes

Use a Table to Create a Right Margin

Browsers have an annoying way of making the left side of the screen your document margin. Simple word processing doesn't solve the problem because browsers don't recognize indent commands.

You can create an indented right margin by placing your text in a centered, borderless table. With a two-column table, you can use the additional right or left column for pull quotes or for brief menu items.

More information about:

Aligning Text with Graphics Using HTML

Use a Table to Align Text With Graphics

HTML treats a graphic as a character. Because of that, you can only place one line of text beside the graphic in running text. Additional HTML coding lets you align a block of text with a graphic, but it often aligns unwanted text as well if the graphic text is too short.

The solution? Use a table row to align the text and graphic!

With a table, it's easy to align text at the right or left of a graphic. If the text is shorter than the graphic, the bottom of the table row will keep unwanted text from moving up. If the text is longer than the graphic, you can create a new row with merged columns beneath it, and then make the additional text wrap around the graphic. Sample

Use a Table to Publish in Columns

You can use a table to publish in columns. Columns work well for aligning:

• side headings with text
• graphics with text
• pull quotes or special notes with text.

Newspaper-style columns don't work well in most cases because they force the reader to scroll down, then back up to read the material.

TIP: Always keep usability in mind when designing with columns. Play the part of your reader, and test your document in your browser.

Use a Table to Create White Space

When you look at great layouts, in print or online, it's the use of white space, areas without text or graphics, that add to their appeal.

With HTML coding, creating white space was one of the hardest things to do. With tables, it's easy. Just leave rows or columns blank.

Quick Reference Guide

As a writer, tables are the most powerful Internet design tools you have. Experiment with them. Use them. And, enjoy!