gregdoolittle.com

the css of css

November 9th, 2006

i had an idea a while back. basically i wanted to include variables in my CSS. the point was to extend the ease of updating a site’s style.

in a CSS document you usually use the same color value for multiple elements. when you want to update the color scheme of your site’s design, you have to do a find-and-replace for all occurrences of the old color, swapping it out with the new color. instead of updating every instance of a color, an image URL, or a typeface, imagine how easy it would be to do if you could just update your variables which you had declared at the top of your document.

i thought i had a great original idea. i had even tried implementing it with JavaScript, but to no avail. tonight i was brushing up on the SiFR type technique, when i came across “my idea”, implemented and documented by Shaun Inman. basically, he’s figured out how to do exactly what i thought i invented, and named it: CSS-SSC.

this is the basic syntax:


@server constants {
constantName1: constantValue1;
constantName2: constantValue2;
}

selector {
property1: constantName1;
property2: constantName2;
}

you can also import the constants from an external file:

@server url(constants.css);

if this interests you, read the full article. it looks like in addition to using this syntax for variables, you will also need to add a special PHP script to your CSS directory, and tell your server to parse your CSS files using the PHP interpreter by modifying the .htaccess file.

two thumbs up

October 3rd, 2006


i recently finished reading a book for css design, by Dave Shea and Molly Holzschlag. i’ve never done a book review, so this is a first attempt:
the title is rather cheesy (the zen of css design), but the book is fantastic. if you’ve never heard of the “css Zen Garden” it is definately a site worth checking out. Started by Dave Shea in 2001, the site demonstrates the promise of CSS’s ability to control all design aspects in a remote document. Designers are given an HTML file which they cannot modify, and are asked to create a .css file that stylizes every element on the page. The best entries are featured on the site (sort of the “prize” for winning). The book goes through about 40 different css zen garden proposals and dissects the code and techniques that underly. The book starts from an art theory perspective and ends with some technical hacks for getting around different browsers. Quite a good mix of content. You can read the book from cover to cover. Two thumbs up.

<div id=”GoDaddyTriedToScamMeAndIBeatThem”></div>

September 17th, 2006

Victory is mine.

After spending quite some time on the phone with GoDaddy.com’s customer service reps, complaining about what I thought was a mistake on their part, I realized I had not read every word in the fine print.

It all started when they sent me yet another a promotional email last week; the subject was: “Exclusive Savings - .COM just $6.95/year”, and the fine print said something about a free web-hosting package if you signed up this weekend, valued at $96.00. Since I had known GoDaddy to occasionally have absurd offers for web hosting packages, I thought: sure, this will be a good opportunity to start that website I’ve been thinking about. So I registered for the site.

I designed a logo on my desktop with CSS (as opposed to in photoshop), this way the file size would be much smaller. I felt so smug. A few hours after registering, I uploaded my logo to my new site (www.cssfoundry.com). I always get a little thrill out of seeing my stuff through an http request, as opposed to from my desktop, so of course I looked at my site. typed the URL into the browser, and WTF DO I SEE? THERE’S ADS FOR GODADDY ON MY PAGE!!!!! all across the top of the page about 100 pixels in height, there are ads for go daddy! How did these get here? They weren’t in my code, and I sure as heck didn’t sign up for them. I signed up for hosting that was worth $96.00, not some crummy free geocities, or aol sponsored site. I mean, I paid money to have the site! You can imagine how ripped-off, and how stupid I felt when the guy on the phone said that the free hosting was supposed to be free “ad-supported” hosting. How that could be worth $96.00 is beyond me. Faulty advertising at its best, I thought. Oh well, I’ll have to switch hosts….

…but wait! I just thought of something. Why don’t I just cover their ads with a div element? This way, the ads would not be visible; people would only see the div element layered on top of the ads. The ads wouldn’t even be clickable. It was such a great plan, because GoDaddy wouldn’t get to make money off of my site, and my visitors wouldn’t be bothered with their ads. So that’s what I did. GoDaddy tried to scam me, and I beat them, here is the CSS:

#GoDaddyTriedToScamMeAndIBeatThem {
	position: absolute;
	top:0px;
	width: 100%;
	height: 101px;
	background-color: inherit;
}

and the corresponding html, of course:

<div id="GoDaddyTriedToScamMeAndIBeatThem"></div>

What a satisfying feeling… I just hope they don’t catch on to me. At least for the time-being, I can say that I won. My little way of “sticking it to the man”.
;)

boagworld.com

August 24th, 2006

i just found my new mentor for web design: boagworld.com. it’s a pretty cool site for beginners. they cover a lot of stuff you would never talk about in a class. and they stay very current with web standards. neato.

Powered by WordPress