It’s come to my attention, mainly by viewing my own sites, that I make type very small in my designs. I’m unsure as to if this is a good thing.

I’ve looked at other web designs and other folks make similarly-small type a feature of they body text as well, so it’s not as if I’m alone in this, but I think it does deserve an answer to a very simple question: why? Why are designers, myself included, making web type so damn small?

Personally, it’s because my start in writing and design was with print. In print, it’s 10pt in tight columns, period. The reason for that is space —- a printed page is only so large. Does that apply to the web? Are we limited in space? Yes and no. We are limited in the horizontal measure, but not the vertical one as pages grow with their content. So there’s no technical reason not to increase the size of the body font.

I was doing some work a while earlier today and hit command-tab to switch to a program and noticed something odd about Mac OS X icons. They’re all blue. In fact, the whole damn OS is blue.

I had open: Finder, Mail, Adium (with an iChat-like icon), Safari, ecto, BBEdit, Xcode, and Notae. Every last one of them (save Notae, kind of) is predominantly blue. Then I looked around and the globe on the location bar is blue, the scroller is blue, the default background is blue, the .Mac logo is blue, and the Apple and Spotlight menus are blue.

Freaking blue, man.

Then I’m in blue jeans on a blue couch, in a blue-gray shirt. Freaking blue is everywhere today.

You will nod your head, spew your coffee, call your friends, post/print/copy/email this to a dozen people, and then sit back and read it again. It’s just so true.

If Architects Had To Work Like Web Designers

So, an update to my Fixed vs. Fluid dilemma. The reason for the concern was my update of the design of Mac Geekery to not be just a quick clone of codepoetry’s design. In doing so I realized that a narrow column of text was more readable, the page looked better when the size was limited, and things generally worked better when I knew there was a horizontal limit. The downside is that if you resize the window to less than the size of the layout, things break (horizontal scroll means it broke, in my book).

So, screw IE, I’m using max-width in my design. As I’ve stated several times before I’m not designing with Internet Exploder in mind, so I can free myself to use modern standards. In my opinion, designing with IE in mind is like designing with Netscape 4 in mind.

“But so many people use it!” is not an argument I care about. I create Mac-centric sites.

So, the idea is that I know my layout will stop at 850 pixels wide, always. This means I can limit the width of the center column so that it’s narrow enough to be readable and get a good layout no matter the window size.

And, on the plus side, it looks like ass in IE, which makes me happy. I’ll get a Safari/FireFox logo in there soon, too.

I working on two new site layouts at the moment (other sites, I feel CP is rather fine for now, though I might add some graphical flair in a few months’ time) and in doing so I’ve come across a conundrum that I previously ignored: fixed vs. fluid. That is, do I make a spectacularly beautiful site (like stopdesign, mezzoblue, or //hicksdesign) and use fixed-width graphics to augment the design or do I stick with basic CSS boxes and create a design with fewer graphics that scales well in smaller windows?

The argument is no longer large screens vs. small screens but large windows versus small ones. As our screen resolutions increase a lot of people are putting their browser windows in smaller, narrow windows off to the side and using the rest of the screen for normal work. As such, fixing a design at too large a size causes problems in that it won’t scale very well (or at all) for smaller windows. Fixing it too small inhibits proper space to design in.

If you resize the window for CP you’ll notice that in real browsers (ones other than IE) the content resizes gracefully when you resize the window smaller than the default width of the container box. Make it larger and it stops at optimum width for readability. This is fluid. The downside is that it’s hard to add horizontal graphical flair to the page other than basic backdrops because the width must be treated as unknown. I cannot, for instance, use horizontal gradients or shadows (like around the edges of the box) because I cannot know how large it will be. I could resort to the use of tables for layout but the only time I have, so far, accepted that was for making columns within a layout (because CSS just can’t do that properly for more than two columns). Moving to a full table layout again just seems dirty, even though it would fix some of the problem (container edge flair).

It’s a conundrum, and it’s giving me a headache.

Text-shadow can be used for a bit more than just drop shadows, you can create inset and outset effects with it as well. The trick to out/inset is simply adding lighter or darker areas with a similar shape to the text somewhere near it. That is, coincidentally, exactly what a text shadow does.

color:black; text-shadow: 2px 2px 0px white;

color:black; text-shadow: -2px -2px 0px white;

Yep, you’ll need Safari/WebKit to see that. Unsure if KHTML on the Linux side can even show it.

I decided to split CSS Debug into two bookmarklets: CSS Outline and CSS Label. They’re like CSS Debug except each just does one half the work. CSS Outline uses the outline and -moz-outline items so the format of the page is not changed. You don’t get the nice labeling of CSS Debug, but you get all the pretty colors. CSS Label labels the start of each item (not so useful alone, really).

Have fun.

All right, I was looking for “killer features” that would make me move to an RSS reader over just browsing the sites every few days (yes, I still do that) and Pulp Fiction wins with something so simple but so perfect.

First, the problem. I’m a design nut. I like pretty things. It’s just how I work, I guess, but a well-designed page makes me all happy inside and so I go through sites like Andy Budd’s on semi-daily sprees for old posts because I want to look at the pretty pages. I have also a second condition: I love information. I want it all, here, and now. So RSS is perfect, but normal clients drop older entries so I can’t keep ‘em around, so it’s nice for a “what’s recent” list but not much more.

So the last problem first, PF keeps everything it touches. Every time a feed is parsed it finds new entries and stores them. You get all the standard things that work for filtering mail and that works out great. All data, forever. Yum.

The second problem was fixed by a contribution, oddly enough. PF allows for people to write their own stylesheets for the “browser” area of the interface so that RSS entries can show up with some kind of form to them. With a little cajoling that was hacked to be a META redirect to the actual entry. So we have a list on the top of all the entries and then the page itself, in a pane, below it.

The only thing I want now is to set stylesheets per feed. There are some sites that read better when I don’t have to look at them…

There is one little bug in all this: PF refreshes the bottom pane sometimes (once a minute?), thus re-loading the redirect page and then re-redirecting me back to the page and, thus, I lose my place. Well, it was almost a perfect solution.

I’ve never been one for art in the sense of pictures and such, but I’ve always loved type, and Didot just appeals to me tonight. So, given something with a similar name, how’s this for a logo?

Yeah, just needed a little break. Back to the fun.

It appears Safari uses the DOCTYPE declaration as the definitive description of the content of the page (as it should). Unfortunately, IE and Gecko do not do this. As such, the tabs on CP show up great on the store link in the other browsers but because CafePress insists upon an HTML4 DOCTYPE on all pages, even custom ones, I’m stuck with non-pretty tabs. If I save it to disk and change the DOCTYPE it works fine, so I know it’s that.

Any ideas on changing the unchangeable? I have a support ticket open, but I’m not hopeful.