Localization for different versions

At present there are three versions of ATI: the online version (i.e., what lives at www.accesstoinsight.org), the "bulk download" version, and the CD-ROM version. These are almost identical, except that links that are local in some are remote in others. For example: on the live website links to PDF files use relative addresses on the server, since that's where the files reside (e.g., <a href='./somefile.pdf'>PDF</a>). In the bulk download version, however, which does not include the PDFs, links to PDF files point to files on the live website (e.g., <a href='http://www.accesstoinsight.org/somefile.pdf'>PDF</a>). Adjusting the CSS to accomodate these different versions is what I call CSS-localization.

The idea is kludgey but simple. Versions that require local links, have their remote links hidden using CSS's display:none element, and vice-versa. To handle PDF files, for example, I have two classes, pdf-local and pdf-remote. For the online edition, I define them as follows:

.pdf-local {}
.pdf-remote {display:none}

For the bulk download version, I define them thus:

.pdf-local {display:none}
.pdf-remote {}

A snippet of HTML might look something like this:

<p>
   You can also read this as a
   <a class='pdf-local' href='./somefile.pdf'>PDF file<a>
   <a class='pdf-remote' href='http://www.accesstoinsight.org/somefile.pdf'>PDF file<a>.
<p>

When browsing the online version, you'd see the first link, but not the second; when browsing the bulk version, you'd see the second link, but not the first. (I'm not sure, but I have a hunch that this is a horrible idea from the standpoint of usability by blind users; I don't know how text readers handle display:none.)

In my main css file (/css/base.css), there's this line:

@import url(locale.css);

Where "locale.css" contains pairs of lines like those above. To further simplify the automation of switching from one locale to another, I've prepared a css file for each locale. For example, part of "locale-online.css" might look like this:

/* cgi stuff is only available locally, so hide the remote links to them. */
.cgi-local {}
.cgi-remote{display:none;}

/* bulk download is only available locally, so hide the remote links to them. */
.bulk-local {}
.bulk-remote{display:none;}

/* news is only available locally, so hide the remote links to it. */
.news-local {}
.news-remote{display:none;}
Part of "locale-cd.css" might look like this:
/* cgi stuff is only available remotely, so hide the local links to them. */
.cgi-local {display:none;}
.cgi-remote{}

/* bulk download is only available remotely, so hide the local links to them. */
.bulk-local {display:none;}
.bulk-remote{}

/* news is only available remotely, so hide the local links to it. */
.news-local {display:none;}
.news-remote{}
All it takes is a single shell command to switch to the CD locale:
cp locale-cd.css locale.css
or to the bulk locale:
cp locale-bulk.css locale.css

Why is all this useful? Because anyone who has, say, a complete set of bulk download files can easily prepare a version of the website for online use, simply by swapping in the correct locale file. Likewise, given a CD version, you can, in a few simple edits, turn it into a workable online version. Neat, huh?


background: white;
There's just no telling how a given browser and a given printer will handle background color. I've come across some pages on the web that look OK on-screen, but which are utterly unreadable when printed on a b/w laser printer. Yes, I could use an alternate style sheet for printing (i.e., media="print"), but I wonder: how many users care to do the extra mousing to select the appropriate style sheet, when all they really want is to run off a quick copy of a sutta?