Scalable ContentSunday, June 22, 1997 by Dave Winer. I've been upgrading the look of the Scripting News home page. The work isn't finished, it'll keep evolving, especially as we learn more about the capabilities of the new browsers from Netscape and Microsoft. As I changed things, I started getting email from people using older web browsers such as Netscape 2.0. Yesterday I found a copy of 2.0, launched it and checked out the Scripting News page. It was unreadable. The problem is that 2.0 didn't support background colors for table cells. So the dates, in a very light color, were not visible against a white background. I tried playing with the background and the font color for the dates, but nothing I could come up with looked good in both the old browser and the new one. A fork in the roadI've been listening to content developers from the Director world, Marc Canter and Marney Morris, and the concept of scalable content keeps coming up. The same writing, graphics and animations should flow thru each different output channel, with modifications made that are appropriate to the channel. When we talk I explain how Frontier has the filters that make it possible to create different levels of flow; but until today I hadn't implemented a dual-flow website. Now I have, and I like it! Backward compatibilityScalable content is a different phrase for a concept that I've implemented in previous lives as a software developer -- backward compatibility. Examples. As long as lots of people were using System 6, we produced versions of Frontier that worked with both System 6 and System 7. Many people have 68K Macs, so we provide a "fat" version of the app that contains PowerPC and 68K versions embedded and a small bit of code that jumps to the right place depending on what kind of machine it's running on. Many Windows software products ship in separate Windows 3.1 and Windows 95 formats. We always prefer if one app can work in all environments and the same is true of web pages. I'd like to make one Scripting News page that looks great in old browsers and looks even better in new ones. But we're over the line, using features that do not downgrade well in old browsers. A new attitudeMy first reaction to the problem that Netscape 2.0 users were having with my home page was to require Netscape 3.0 or greater. In other words, if you want to read my page, you have to upgrade to a more current browser. Then I saw an opportunity to learn how scalable content applies to websites. I spent the morning reprogramming the scripts that build the home page. If you want to have a look, check out "user.websites.home". The source code is there, embedded in the fat page. How it worksThe script that builds the home page now adds comments that tell the filter script how to prepare a version of the page that displays well in Netscape 2.0. To see how this works, visit the home page and view source. You'll see <!-- notForNetscape2Start --> and <!-- notForNetscape2End --> in the text. A filter script, at user.websites.home.["#filters"].finalfilter, runs when the page is finished building, copies the text and removes the parts that aren't part of the Netscape 2 page and writes the result out at: http://www.scripting.com/defaultNetscape2.html Every time I add an item to the Scripting News page, the Netscape 2.0 version of the page is updated. So people who are using an older browser, or who prefer a simpler look, can visit that page for the latest news and commentary. PerspectiveI program the home page by entering text into an outline. The fancy home page is built automatically, as always, from the last ten days of outlines, stored in my database. The new thing -- there's now a simple version built automatically from the fancier version. Enough users were left behind in the shift from Netscape 2.0 to 3.0, that by extrapolation, a lot of users are going to stay with the 3.0 browsers as the more adventurous people switch to 4.0. As a web developer I want to explore the new features, but after thinking about it, I realized I didn't want to leave anyone behind. Dave Winer |