Question:
I’ve been working on completely redoing my company’s Web site for over a month and a half now. To help me out, I bought a book on HTML 4.0 and for positioning elements, I followed its directions, using the tag, for example: . I’ve been consistently checking the pages on Netscape Communicator 4.0, but just as I was about to load all 95 pages onto the server, I opened a page in Internet Explorer 3.0 and it completely mangled it. I downloaded IE4, which reads the pages correctly, although it performs poorly on at least one imagemap on the front page. I’ve used the tag on 90+ pages, often with multiple objects–changing 500-800 instances of this will be a bear! I could say somewhere on the page, “This page is optimized for Netscape 4.0 or IE 4.0” and give links to those download sites, but most people couldn’t be bothered and will just forget the site. Is there anything I can do to position these elements relatively easily as I have with the attribute? That is, is there anything in HTML 3.2 that I can use to absolutely position elements besides tables, which would take an immense amount of work to plan out and insert the proper elements into?

Answer:
Ouch. This is the ugly reality of DHTML development–if you take advantage of DHTML features, you basically sacrifice readability in earlier browsers. Before you go scrapping all your hard work (or most of it, anyway), here are a few points that you may want to consider:

1. First of all, most corporate Web sites contain a significant amount of boilerplate information that can be incorporated into generalized forms. I’ve found that when a Web site begins to creep past about ten pages, that’s usually a good point to start considering a combined client/server approach. Keep the relevant HTML in a database, then use a server environment such as Microsoft’s Internet Information Server or Allaire’s Cold Fusion to retrieve the data. While this solution may not necessarily be comforting at the moment, the sheer magnitude of your site means that creating templates that can be customized for different browsers far outweighs the inconvenience of reworking your site.
2. If you are shooting for IE3 compliance only and not NS3 compliance as well, you can create an alternative version that uses Microsoft’s Active Layout Component (also known by its file extension as ALX). This older technology has been superceded by DHTML, but it works fairly well to provide positional placement for Internet Explorer 3.0.
3. If the information that you need to position is graphical in nature, you may want to explore the use of programs like Macromedia Shockwave or Flash. These programs can give you full support across even older browsers, and Shockwave in conjunction with Director will give you at least some of the capabilities of DHTML. These solutions are not cheap–Flash runs $250 and Director runs about $550 for the initial license. So you need to weigh those costs against the amount of time you’ll spend trying to get things to work consistently.
4. Finally, you should talk with your employer about what platforms they really want to target. Cross-browser solutions can get as expensive as cross-platform solutions. A good rule of thumb is that anytime you need to provide a page that has cross-platform support to a browser at the same level, add 25% more time (that is, if it takes you 100 hours to create your site for IE4, it will take an additional 25 hours to modify it for Netscape 4). Add an additional 35% for each backward compatible browser that you want to make work (so building an IE3 compliant site will take 35 hours). Going forward usually doesn’t cost you anything, but you also don’t get the advantages of the new platform. So, if it’s worth it to your company to spend an additional 60%-70% on the site to give you a wider reach, then go for it (although the typical rate of $35-$50/hr for an in-house Web designer may make people rethink how much they really want to hit that 20% of older browsers).
5. Keep in mind finally that while DHTML support is a feature of the 4.0 browsers, Cascading Style Sheets were part of the specification for both IE3 and Netscape 3. Cascading Style Sheets make use of the Class attribute within DIVs, SPANs and other containers to set styles. If your primary need for spans lays in this direction, find a good book on HTML that covers the CSS specifications (personally I’d recommend the Wrox line of books), set up a global style sheet, then just do a search and replace for each

   The best short-term solution would be to use classes to bring your text to a minimal level of discomfort. Long term, you should think about integrating server-side solutions with your client-side code.