Andrew Pollack's Blog

Technology, Family, Entertainment, Politics, and Random Noise

Config driven CSS websites in Domino - What do you tokenize?

By Andrew Pollack on 07/04/2008 at 01:58 PM EDT

I'm soliciting ideas & best practices on building configurable "theme like" CSS for a Domino site. I'm in the midst of a design refresh for this blog, as well as the main NCT site. They are both functional but truly ugly. I've decided to merge the two into a much more integrated self -- but more on that later. As part of the redesign work, I've been hand crafting a bit of HTML and CSS that will eventually become the framework into which all the active content will be placed. Every time I do this, I try to come up with the best scheme for making the site easily updated with new colors and so on.

The whole point of CSS is that it makes up for the lack of tokenization in HTML. That is to say, there is no "Meta-Tag" that you can use for colors in html tags so that you can define your colors in one place. Instead of every table cell you want to be "red" having to have a color tag on the table cell tag, you define your table cells with a "class" and then you assign your colors and things there.

Great, now the bad news. CSS is one of long line of terrible standards created during the hype of the late 90's when foolish investors paid six figure salaries to 20 something year old CIS majors fresh out of university, gave them big offices, swimming pools, game rooms, and a bunch of equipment with the sole job of creating "something interesting".

CSS, designed to solve the problem of no tokenization in HTML, has no tokenization. You end up with long CSS files where the same color codes and file paths are repeated over and over, making updates painful.

We can get around that in Domino, by generating our pages on the fly. Other systems use external scripting to do the same thing. Where you would normally put a color tag, you might embed a token like ${MainBGcolor}. A scripting tool can then run and quickly replace all instances of that token in your template with the color you've assigned, and produce an output file containing your actual CSS. In Domino, instead of tokens we use <computed text&rt;.

All of these solutions talk about HOW you can tokenize your CSS ahead of time, but the better question is still "WHAT" do you tokenize and how? Colors are the obvious choice, background images? Icon images? What do you tokenize when you build your css?


There are  - loading -  comments....

re: Config driven CSS websites in Domino - What do you tokenize?By Nathan T. Freeman on 07/04/2008 at 04:44 PM EDT
Hrmmm... I tend to wonder... if you're doing that much tokenization in your
CSS, are you correctly using the CASCADING aspect of it?

I can't think of a circumstance where I wished I'd had tokenization like that.
As I ponder it, it seems like I'd be over-classing and not using the
hierarchical nature of CSS if I did run into that problem.

Like.... why would you need to define MainBGColor in more than one place?
That's just the BODY {background-color: }

Even if you were looking to do individual cells or something, then it's just TD
{background-color:}
Probably so --By Andrew Pollack on 07/04/2008 at 05:24 PM EDT
-- the first real serious use I made of CSS was building an earlier version of
this blog site. Since, I've done a great deal more with it and with html and
javascript in general (this blog site was a learning exercise).

These days I do fairly large "household name" sites that most people who read
this would recognize, and that's forced me to get deeper into the browser
variants and so on.

In answer to your question: First is "yes" I'm probably not using it in the
most efficient way.

The second answer is that I often will try to stick with a color scheme that
uses the same colors for different things on the site. They don't necessarily
cascade from one another.

The third answer is that cascading doesn't always work. Anchor references are
among my biggest complain in that regard.
re: Probably so --By Nathan T. Freeman on 07/05/2008 at 07:10 AM EDT
Bear in mind that any element can have more than one class as well. So you
could have DIV.sidebar and DIV.comment (which on this side share a background
color) but you could also have DIV.blue-background, which just set the
background, border and text colors, and assign your comments to have class
"comment blue-background" and you sidebar to have "sidebar blue-background."

Then both would apply.

(Of course, the sidebar probably ought to be an ID instead of a class, but you
get the point.)
re: Config driven CSS websites in Domino - What do you tokenize?By Jim Knight on 07/04/2008 at 06:35 PM EDT
When I was building Struturo as a commercial venture, I was thinking it would
be easier for end users to modify the colors and sizes. I had color picker and
drop downs for header tags and paragraphs and lists. And it was pretty cool at
first but then I realized it was very limiting and I had to add more and more
fields to make it work right.
So I came to the conclusion that unless you are using one very bland design
that will not change much, this approach wouldn't work. It was a lot faster to
just plain type in the CSS and be able to tweak as text than to use fields or
tokens representing the individual properties.
What I did end up doing was a stylesheet or theme document with tabs for
header, main, col1, col2, etc so at least the end user could find things
easier. Then on the output form to the web, I formalize it into a flat text
sheet.
The cool thing about Domino is that I could make the sheet appear one way with
tabs etc on Notes and flatten for the web.
re: Config driven CSS websites in Domino - What do you tokenize?By Ben Poole on 07/05/2008 at 11:59 AM EDT
I store all CSS in standard documents with an appropriate MIME type set. The
CSS itself is in a rich text field, allowing the use of colour formatting,
computed text, etc. Given all that, it's pretty easy to define a number of text
fields in the same document which store colour hex values. These fields can
then be referenced in the body of the CSS via computed text, making central
updates a breeze (i.e. define a colour "tag" and link that to one of these
colour fields).


Other Recent Stories...

  1. 05/05/2016Is the growing social-sourced economy the modern back door into socialism?Is the growing social-sourced economy the modern back door into socialism? I read a really insightful post a couple of days ago that suggested the use of social network funding sites like “Go Fund Me” and “Kickstarter” have come about and gained popularity in part because the existing economy in no longer serving its purpose for anyone who isn’t already wealthy. Have the traditional ways to get new ventures funded become closed to all but a few who aren’t already connected to them and so onerous as to make ...... 
  2. 04/20/2016Want to be whitelisted? Here are some sensible rules for web site advertisingAn increasing number of websites are now detecting when users have ad-blocking enabled, and refuse to show content unless you "whitelist" their site (disable your ad-blocking for them). I think that is a fair decision on their part, it's how they pay for the site. However, if you want me (and many others) to white list your site, there are some rules you should follow. If you violate these rules, I won't whitelist your site, I'll just find content elsewhere. 1. The total space taken up by advertisements ...... 
  3. 12/30/2015Fantastic new series on Syfy called “The Expanse” – for people who love traditional science fiction[] “The Expanse” is a new science fiction series being broadcast onthe Syfy channelthis winter. It’s closely based on a series of books by author James S. A. Corey beginning with “Leviathan Wakes”. There are 5 books in the “Expanse” series so far. If you’re a fan of the novels you’ll appreciate how closely the books are followed.TIP: The first five episodes are already available on Syfy.com. If you’re having trouble getting into the characters and plot, use those to get up to speed.The worlds created for ...... 
  4. 10/20/2015My suggestion is to stay away from PayAnywhere(dot)com  
  5. 08/07/2015Here is one for you VMWARE gurus - particularly if you run ESXi without fancy drive arrays 
  6. 08/06/2015The Killer of Orphans (Orphan Documents) 
  7. 06/02/2015Homeopathic Marketing: Traveler on my Android is now calling itself VERSE. Allow me to translate that for the IBM Notes community... 
  8. 03/17/2015A review of British Airways Premium Economy Service – How to destroy customer goodwill all at once 
  9. 02/26/2015There's a bug in how @TextToTime() and @ToTime() process date strings related to international standards and browser settings. 
  10. 01/21/2015Delivering two new presentations at Developer Camp (EntwicklerCamp) 2015 in Germany 
Click here for more articles.....


pen icon Comment Entry
Subject
Your Name
Homepage
*Your Email
* Your email address is required, but not displayed.
 
Your thoughts....
 
Remember Me  

Please wait while your document is saved.