(Continued — 3)

One simple workflow method to accomplish this semi-automatically would be to create your design in ImageReady or similar imaging software, and then slice a master table from the major equal areas of the design. Then go back and manually cut out an area such as navigation buttons that comprise one of the areas you created in the first step. Then, create a new set of slices (and table HTML) for your navigation, perhaps with rollover effects or animation. Take this table HTML and paste it into the static table cell you created in your master table HTML, replacing the image tag. If you can accomplish this, you have graduated to one of the most advanced tricks in Web site design architecture.

This type of HTML was one of the most valid reasons given by hand coders as to why they did not use WYSIWYG editors. Most applications like Dreamweaver instead offered layers to create grid-based layouts. Of course, tables are compatible with 3.0 generation browsers, while layers are not. Thankfully, this has now changed with the release of Macromedia’s DreamWeaver 4 (see review on page 18), with built-in support for nested table layouts, including the ability to import prior work done by hand.

The Underline
If you’ve ever visited a Web site and noticed that not all the links on the page, perhaps in a reference box, had underlines, you likely thought they were using cascading style sheets (CSS). In many cases, they might have been, but in many other cases, they may have been using a nifty HTML 4 shortcut that allows you to turn off the underline for text links without creating any styles or external style sheets.

This trick is applied to each anchor link such as <a href=""> by adding a little snippet like so: <a href="url" style="TEXT-DECORATION: none">link</a>

What’s neat about this is that it simply doesn’t work on older browsers that don’t support the tag, so with Netscape 3 you’d just see the regular underlined text. The drawback to using CSS for this is that you have to include both the style and non-style information to be backward-compatible, unless you create two different pages.

If you master these few skills, you will be well on your way to becoming an expert, and way ahead of the average bear, or grasshopper.

 < E N D >