(Shelly Cashman Series) Gary B. Shelly, H. Albert Napier, Ollie N. Rivers-Web design_ introductory concepts and techniques -Cengage Learning (2008)

112 Chapter 4 Planning a Successful Web Site: Part 2
alignment, float, cell
padding, and cell
spacing properties
height and width
properties
border
properties
Figure 4-13 HTML table and cell properties, such as height and width, can
be easily modified.
@SOURCE
Q&A
Accessible Tables
For more information
about tables and accessibility,
visit the Web
Design Chapter 4
Online Companion page
(scsite.com/web3e/ch4/)
and then click Accessible
Tables in the
@Source links.
Is there a controversy
over layout tables
versus CSS?
Yes. Some designers
continue to favor layout
tables because of their
ease of use and because
of poor browser support
for CSS standards.
Other designers prefer
CSS because it meets
current WAI standards,
promotes liquid layouts,
provides for easier page
updating, and because
current browsers
increasingly support
CSS standards.
Both data and layout tables can be created as either fixed-width or relative-width
tables. A fixed-width table, defined in pixels, is absolute and will not resize if the
browser window resizes. The advantage of using a fixed-width table is you have
better control over what the visitor sees at the specific resolution for which the page is
designed. The disadvantage is the table does not resize when viewed at a lower or higher
resolution. A relative-width table, defined as a percentage of the browser window, is
flexible and resizes as the browser window resizes. For example, a relative-width table
defined at 95 percent will expand or contract to display in 95 percent of the browser
window. In Chapter 2, you were introduced to the concept of liquid design or liquid
layout, a page layout in which the page resizes with the browser window size, helping to
resolve monitor resolution issues. An advantage of relative-width layout tables is they can
be used to create a liquid layout.
A major disadvantage of using layout tables involves accessibility. For example, a
screen reader is an assistive technology that reads a Web page to a visually impaired
user. Layout tables with side-by-side content rather than linear content create a problem
for screen readers attempting to correctly interpret page content. An alternative to
layout tables that meets the WAI standard for Web accessibility is to control page layout
using CSS.
CSS AND PAGE LAYOUT Earlier in the chapter, you learned how style sheets are used
to control formatting across pages, thus creating visual consistency. Style sheets can also
be used to control page layout by dividing a page into sections, such as a header section
or a navigation section. The tag within a page’s code specifies a section identified
by the style sheet. Within each tag pair reside the other content tags for that
section. Figure 4-14 illustrates the external style sheet for a WYSIWYG template that
establishes page sections and a portion of the page code for a section established by the
style sheet.