colophon
A colophon is something you occasionally find at the end of old books.
The author and the publisher are responsible for the title page, the list of contents and then the content of the book itself. There may also follow a table of literature sources and possibly an alphabetical index. But sometimes there is a short section where the typesetter says something about his own handiwork. In the Colophon he might mention the typefaces he used to set the book, what kind and quality of paper he sewed together and bound between what sort of covers.
In this tradition the designer of the Zen Road website would like to say a little about how the site is built.
the photographs
The photos illustrate an important theme of this site: Zen in everyday life, whether at the bus stop, on a bridge or at a road junction, whether in a crowd or walking in the country looking at the sky. Wherever you go a way. All the photographs were donated by friends of Philippe Coupey. They were taken mostly in 2004, in Ireland, Canada, Mexico, Portugal, England, France and Germany.
the typefaces
Designing a website so that it is a pleasurable and informative experience to the visitor is a multi-disciplinary exercise. One of the necessary requirements is a feeling for typography. About 90% of internet surfers use Windows PCs, about 3% use the Mac, so we looked for a typeface common to both systems. If you are reading this text on a Windows PC or a Mac, then you are most probably seeing a typeface called Trebuchet MS, a pleasant, lightweight sans-serif font which scales well when you change the browser’s font size.
Trebuchet has some interesting quirks which are not apparent at first sight but which are very aesthetic. A capital M slopes unusually, a small g is like in an old book, and a small l has a little tail at the bottom. Trebuchet also has more or less typographically correct quotation marks. Other typefaces make a capital I (eye) and a small l (el) very similar, so that the following 18th century news headline about a sick English king:
“George III is Ill” is more easily readable in Trebuchet than
“George III is Ill” which is how it would look in a font called Arial.
When you print any of the content of the website as described in the sidebar on the right, you will discover that the pages are printed in a curly, serif font called Georgia. In contrast to reading on a computer screen, the brain is more accustomed to reading printed text in a seriffed font.
ergonomic design
The logo, the photograph, the main menu and the language bar at the top of the screen give the impression of a cluttered desktop. The individual pieces move around when you resize the browser window (by pulling at the bottom right corner of the browser) or when you change the font size. This design has the advantage of making all the site navigation visible — also on a small computer screen with 800×600 resolution — while giving you the chance not to miss any of the details in the lovely photographs. It’s also rather fun.
If scripting is enabled in your browser — this is normally the case except on computers requiring very high security — the photo will move to the front or hide again behind the main menu when you click on it. If you are not using a mouse, a key press will have the same effect when you have tabbed to the photo.
JavaScript and other active content
In order to keep the website simple and uncluttered, we intentionally avoided active content. You will not find second and third browser windows suddenly popping open unannounced and access times should be fast because we do not rely on extravagant graphic effects. JavaScript is used only for swapping the photo position as described above, while other dynamic programming techniques such as Active-X or Flash have been avoided completely. If JavaScript is disabled in your browser — about 10% of web surfers do this — you won’t be able to swap the position of the photo, but this is no great hindrance in using the site. In fact, if you’re turning JavaScript off, you’ve probably got a screen large enough not to need the picture-swapping.
An important reason for avoiding client-side dynamic content is to permit the use of the website by a screen reader, a special browser used by blind and other visually handicapped web surfers. It reads aloud the content of the site, or converts it to Braille. A screen reader would naturally have problems with flashing and popping effects and might get confused when the navigation opens up another window.
Another good reason to avoid dynamic content is that without it the website becomes more accessible to search engines such as Google, MSN and others.
enabling cookies
The only browser-side dynamic effect you will have to activate is cookies, if you want to view the teachings available in the “subscriptions” section. By default, cookies are activated in most browsers, but many security-conscious surfers switch them off. If you are having difficulty logging on to the Subscription pages, please check if your browser has an option named something like “Accept cookies from originating site”. We must ask you to switch cookie-acceptance on to have full access to this password-protected part of Zen Road.
web standards
Web Standards is a broad term which has become fashionable in web development in recent years. It results from the work of the World Wide Web Consortium (W3C), an international standards organisation headed by Sir Tim Berners-Lee, an Englishman who is regarded as the inventor of the web. The W3C defines the programming languages and conventions which enable communication over the web and promotes the use of the web by everyone, irrespective of any disabilities they may have. (For more on this subject, see the accessibility page.)
Web Standards is a way of programming a website according to the W3C standards. In particular, it involves a separation of content from style — the words you are reading at this moment and the ideas you are assimilating are separate from their presentation as black text on a white background surrounded by dark green. The medium and the message are kept apart. Adhering to Web Standards has the effect that a website will function the same and even look the same in any modern browser and still be accessible to screen readers and other text-based, non-visual browsers.
programming and testing
The pages of this site are written in XHTML (extensible hypertext markup language) and use Cascading Style Sheets, Level 2 (CCS2) for the presentation and for printing. Each page has been verified syntactically by the validator programs provided by the World Wide Web Consortium. In addition, the website as a whole has been tested against the checklist of the W3C’s Web Content Accessibility Guidelines (WCAG), with the intention of verifying the general accessibility of the website to people with disabilities. The following links illustrate these principles:
The website was tested in a number of browsers: Internet Explorer 6 and 5.5 for Windows, Internet Explorer 5.2
for Mac, Mozilla 1.7, Opera 7.5 and Lynx. Pages are served with MIME-type application/xhtml+xml to browsers which are
fully compliant to the web standards recommendations of the W3C, otherwise as text/html.
Currently only the most recent versions of Mozilla and Opera can be regarded as fully compliant.
a word of thanks
This website would be less interesting if it did not have information which is continually updated. It would be merely static. Perhaps in nice colours and with exciting photographs, but you would tire of it after a while. To produce a dynamic website we integrated two software tools which deserve special mention:
- Ralf Stadtaus’ Form-Mail-Script provides the basis for the webmail, allowing the sending of spam-free e-mails directly from the Zen Road website;
- and the awesome WordPress Web Publishing Platform by Matthew Mullenweg powers the “teachings”, “subscriptions” and “blog” sections of the site, combining a simple presentation of new material with intelligently designed archiving and search features.
Thanks and respect to them both and to their teams for untold man-years of work from which Zen Road benefits. Links to their websites can be found below:
concept and design
Paul Buller, Berlin, Autumn 2004
eMail: daor–nez@retsambew.org,
tel.(+49 30) 347 877 45