Frontier

Using Frontier

Extending Frontier

adding favicons

migrating websites

Using CSS

Fixing Radio 8.1

Fixing Frontier 5

nextPrev broken

err log sans timestamp

temperature conversion

our WebRing

Sunday 27 February 2005

The last time I wrote about modifying my website rendering engine, it was Userland Frontier I was tweaking. Two years later I'm using Radio, a much cheaper Userland product with the same core rendering engine. Nothing has changed in the way I do things, except I select slightly different menu items and pay $40 per year instead of $1099 per year.

But that's not why we're here. Today I'm making the switch from hand-coded HTML, which I've been doing since 1993, to CSS. Cascading Style Sheets is a modern, better way of doing that which needs to be done to have web browsers display content.

I won't be showing you anything about CSS itself, just what's the minimal Radio (or Frontier) infrastructure for deploying a website with CSS. It turns out it's pretty minimal. Without further ado, here it is:

Let's examine each item in turn. You'll be up and running in a few minutes.

The page template is pretty sparse. Only a call to have the page content, the body, inserted. You may build a site-wide look-and-feel by adding CSS to this item, but this'll do for the moment.

A minimal page includes four useful directives, only the first of which is required:

1. The page title
2. A subtext summary which is picked up by the outlineSite() macro (which I will add to a top level site map)
3. A pointer to a folder which contains images referred to by imgFileRef()
4. A command to put the subtext into the page's META tags

The pageHeader in #prefs contains the DOCTYPE and XHTML pointers needed for page validation, a call to generate the page title, the META tags, and to link to a CSS stylesheet.

And lastly, optional, but vital for my Userland Radio / Frontier experience, is the glossary-generating call in a greatly-truncated pageFilter in #filters.

Going back to the first image on this page you may notice that the stylesheet (called AppleHelpers) is of type WP Text rather than outline. This lets you create a CSS stylesheet in the same format as is written about all over the web and in books.

And that's pretty much it! Perhaps someday I'll write how I created a basic CSS page design for a website, but not today.