Brockhaus, Germany The separation of form and content ... gave me great flexibility while designing the site

URL: http://www.brockhaus.de/multimedial
Company: digitale informationssysteme for Brockhaus
Frontier scripting: Christoph Pingel, pingel@digi-info.de

Christoph Pingel describes the project:
The publishing house Brockhaus, publisher of the most renowned encyclopedia in German, just released their multimedia CD-ROM "Brockhaus multimedial". They asked us for a special "add-on" web site containing in-depth information on current issues like the elections in Germany, the new European currency "Euro", and a large archive with the topics "politics", "culture and science", "sports", and "deceased personalities". For the owners of the CD-ROM, the archives of this Chronik section go back to January 1998, and they contain lots of press photographs; the "public" part is only the current month, and without the pictures.

From the first moment, it was evident that the Chronik part of the site would best be done with Frontier: Lots of information in the same layout, with the same features, presented in chronological order.

The editors provide the pictures for every month and a tab delimited text containing the subject, text and picture ID for each single "event". If there are references to the picture in the text, there is an additional version for the plain text without pictures.

The web site consists of 4 "realms" for each topic; after choosing the topic, the user chooses a month to look at. Now he is presented a frameset with a calendar at the left side (an imagemap) where he can choose from the "active" days (i.e., there is some information for that day). A click on a picture opens an additional window with the same picture in large scale; it has an "onblur" JavaScript statement in the body which closes the window as soon as the user clicks the window behind. There are arrows pointing to the next/previous "active" day at the top and bottom of each page so that one can easily read in chronological order. If there are less than three items on the page, the arrows at the bottom do not appear.

Let's have a look at the workflow:

Step 1: Parsing Information
I first read the tab-delim text into a Frontier table, converting special characters into html-entities.

For the pictures, a PhotoShop action produces a second "small" image with a fixed width that appears on the web page along the text. In Frontier, we create a table with the widths and heights of the images of both the large and small image folders.

Step 2: Creating the web site inside Frontier
A script runs through my "internal" database, looking for the items belonging to a given subject per day, creating a new page in the "websites" table. Along the way, the values for the calendar imagemap (is it an "active" day with a link or not?) are collected, and the navigation panel for each month is created.

Step 3: The web site is rendered

To make everything manageable for someone who is not proficient with Frontier, all necessary actions are accessible through a custom menu.

As you can see, there is a lot of information gathered and processed along the way. Custom scripts take care of the next/prev-links within a given month, the correct layout of the navigation calendar (it has a fixed layout based on weekdays, so we have to know what day of the week each date is), the embedded javascript/DHTML, and so forth. Some of the scripting was kind of tricky, but the result is: We turn the tab-delimited text for a new month into a beautiful website with approximately 150 - 200 files.

It was good to see that Frontier works seamless in conjunction with "advanced" DHTML (the templates were done with DreamWeaver); there is almost no tag or script on these pages that doesn't receive some values automatically at rendertime from within Frontier. With some scripting effort, there were absolutely no restrictions imposed on our chosen page design by the scripting tool - which is better than I initially expected.