» Designing a Mock-up
» Slicing Images
» Building the Page
In this tutorial, we will build a basic webpage
using HTML tables. Tables in HTML were once only used to display tabular
data, but have since become the dominant means of designing web sites.
In recent years though, many developers have moved over to tableless web
design. Instead of HTML tables, Cascading Style Sheets (CSS) are used
to arrange elements and text on a web page.
was introduced by the World Wide Web Consortium (W3C) in an effort to
make HTML code semantic, where content and structure are seperate from
visual presentation. CSS offers some advantages over table-based
layout, such as improved accessibility (easier for screen readers,
braille devices, mobile phones, etc. to understand), faster load times
(as a result of less cluttered code) and easier maintainability (since
all layout information is centralized, site wide revisions and/or
changes can be made without opening every individual page).
The biggest problem with tableless design,
however, is browser support. Some CSS attributes don’t render correctly
on all browsers if at all, and CSS has a much steeper learning curve
than table based design. For the purposes of this tutorial, we will be
focusing on building basic webpages using table-based layout.
If this is the first time Dreamweaver is
launched, a dialog box should appear that lets you choose a workspace
layout (Windows only). For most users, beginners especially, Designer
workspace is recommended. Coder workspace is primarily for hand-coders,
with a layout similar to Macromedia HomeSite and Macromedia ColdFusion
Studio. You can always switch to a different workspace using the
Preferences dialog box later.
Next Page »