CMXtraneous: CSS

Right on the edge of useful

That Font Looks Nasty!

Posted Wednesday, September 22, 2004 1:14:36 PM by Stephanie


Quartz technology on OS X and ClearType on Window XP -- the answer to all our pixely type woes. For ages now I've been telling people that their XP machine can display fonts so well that we can now use CSS to style headers and nix the whole header image routine. (I even wrote an article about it last year -- Styling Headings for Fun and Profit with CSS.) No more of that pixely, horrid stuff -- everything will be smooth and lovely. And then I bought a testing box with XP on it. And it was not lovely. It was pixely and gross. Had I been lying to people all this time? I was alarmed. I looked for a setting within XP but to no avail.

I discussed this with Kim C., and he dug around and found the solution. The ClearType text smoothing ships in the OFF position. Yup, that's right. Microsoft added the beautiful ClearType smoothing to XP, but Joe and Jane User have no clue. And I, who had a clue, couldn' t find it. Just in case you're one of the clueless gang and you'd like a more beautiful web typography experience, here are the steps I took:

  1. Right click on your desktop. The Display Properties panel will appear.
  2. Click the Appearance Tab.
  3. On the bottom right side, click the effects button.
  4. Click the second item that says: "Use the following method to smooth edges of screen fonts." Select ClearType.
  5. Click OK
  6. Click OK in the Display Properties panel.

Now open a web site, or simply view this blog again. You'll notice the headings look almost as good as they do on a Mac. ;) Enjoy!

Category tags: CSS, Designing for the Web, Dreamweaver, Mac

Web Standards Checklist

Posted Monday, September 20, 2004 7:12:24 PM by Kim


Max Design, a Sydney, Australia-based design firm, has posted a comprehensive checklist of web design standards. As they say, designing to standards means to

"adhere to standards (HTML, XHTML, XML, CSS, XSLT, DOM, MathML, SVG etc) and pursue best practices (valid code, accessible code, semantically correct code, user-friendly URLs etc). In other words, a site built to web standards should ideally be lean, clean, CSS-based, accessible, usable and search engine friendly."

This is an excellent one-stop source for the kinds of things that modern web developers and designers should keep in mind when developing new sites with standards in mind. It's hard to imagine any professional developer who doesn't at least attempt to design to standards these days. For those still learning what the mysterious "standards" are, this checklist not only gives excellent short descriptions, but also provides relevant links to documents that provide more information.

Via Digital Media Minute.

Category tags: CSS

Colors and Color Blindness

Posted Wednesday, September 08, 2004 6:52:56 PM by Stephanie


Are you sometimes at a loss when trying to come up with colors to go with a client's logo. Here's a fun color tool. Color Scheme Generator will help you choose everything from a monochromatic scheme to a triadic, analgous, or complementary. Be sure to click around on the "degrees" of the circle -- you're not stuck with just the main colors shown.

And though there are many color scheme tools out there, this one has a couple interesting features. First, you can not only get the kind of color scheme you want, but you can also tone it down to pastels, contrast, pale, etc. Second, you can choose a variety of different types of color blindness. It can be interesting to see your color choices through their eyes. And since my father and son are both color blind, that is something I'm very aware of. Enjoy!

Category tags: CSS, Designing for the Web, Dreamweaver, Fireworks, Flash