About this site's lack of design: Yes, it's supposed to look this way — I'm helping create a new sandbox theme for WordPress (see it on GitHub).

Dan Rubin's SuperfluousBanter

Suffering from chronic idiocy since 1977

Archive for May, 2004

Newer

Blogger. Templates. Designed.

Wednesday, May 12th, 2004

Note: My tem­plate set has been updated — get the scoop here »

bloggerI’ve been wait­ing to write about this for months now. Really. Blog­ger has finally relauched with a snazzy new look cour­tesy of Dou­glas Bow­man and Adap­tive Path. The new Blog­ger fea­tures not only a nicer, rounder design, but also a much-improved process for cre­at­ing and man­ag­ing blogs — and a bevy of fresh tem­plates designed by some famil­iar names.

Brand Name Designers

Doug recruited some ter­rific design­ers to design and style brand new, standards-based tem­plates for the relaunch (in addi­tion to the fine tem­plates he con­tributed), and I was hon­ored to be one of this select group: Dan Ceder­holm, Todd Dominey, Dave Shea and Jef­frey Zeld­man all cre­ated some fan­tas­tic designs for the new tem­plates (view a list of all the tem­plate designs).

Beau­ti­fully Generic

The trick with this project was to design some­thing visu­ally fetch­ing, but not too per­sonal (the pri­mary func­tion is a reusable tem­plate, which might dis­play many dif­fer­ent types of con­tent), yet indi­vid­ual enough to inspire some­one to actu­ally use it.

Your tem­plates really stand out to me as hav­ing a per­son­al­ity while still pre­sent­ing a ‘generic’ feel…” Dan Ben­jamin

My pri­mary goal was to design a base tem­plate that would work in many sit­u­a­tions, for many dif­fer­ent peo­ple. The best way to accom­plish this from the out­set was to limit the color palette to sim­i­lar hues, which also made it eas­ier to cre­ate alter­nate color schemes that have a fairly dif­fer­ent look with­out hav­ing to change any of the base elements:

For the design, I wanted to play a lit­tle with gra­di­ents, as well as try some lay­er­ing of back­ground ele­ments in CSS to cre­ate sub­tle effects (as it turned out, they are extremely sub­tle). I ended up apply­ing gra­di­ents to every pri­mary ele­ment, though chances are you won’t notice them all right away.

The sub­tle gra­di­ents gen­tly direct the eye down the page, and cre­ate the slight decrease in con­trast of the back­ground arrows in the side­bar as they move fur­ther down the page (get­ting closer to the darker color of the gradient).

Stan­dards for the People

The num­ber of peo­ple who will make use of these tem­plates is astound­ing (it’s already started), and the web is going to be a much bet­ter place for the effort (just think of the hun­dreds of thou­sands of sites that will soon be using well-designed standards-based markup!). I’m very happy with how Thi­s­away turned out, espe­cially the alter­nate col­ors. I think it fits in nicely with the look and feel of the new Blog­ger (though that was entirely acci­den­tal, since none of us saw the design before Sun­day), and com­pli­ments the other new designs while remain­ing unique.

Con­grat­u­la­tions, kudos and thanks to Ev and the rest of the Blog­ger crew, as well as Doug and the folks at Adap­tive Path for allow­ing such a ter­rific team of design­ers to con­tribute to this project.

Blog­ger tem­plate ques­tions? Please search and/or post to the offi­cial Blog­ger Help Google Group—you are much more likely to get a response there than by email­ing me.

Categories:

33 Comments

When Black Is Not Black

Tuesday, May 11th, 2004

Stop using black for copy text. Just stop. It hurts my eyes. All you con­trast freaks, stop telling me that default black (#000) text is a neces­sity on white back­grounds. It is not, I repeat, it is not. I will stop read­ing blogs and web sites that insist on defy­ing com­mon sense rules of design, leg­i­bil­ity and style. More con­trast does not result in de facto bet­ter readability.

If you use black (#000) for body text, think again. Think for cry­ing out loud! Change it to #333 right now. Hon­estly, any value between #666 and #333 is so much bet­ter than #000. Oh, and while you’re edit­ing your stylesheet any­way, do Andrei a favour and remove any instance of Tre­buchet, espe­cially as copy font. Do I agree with him that Tre­buchet must die? No. Do I think it’s not the best font around? Prob­a­bly. If noth­ing else I admire his effort to sac­ri­fice for the greater good of Design (yes, that’s spelled with a cap­i­tal “D”).

But, mis­rep­re­sent­ing your own wife. Ouch. Good luck fellow.

On another note I’d like to take the time to con­grat­u­late Dan on his won­der­ful tem­plate design for Blog­ger. Actu­ally, let me just con­grat­u­late every­one who worked on the Blog­ger redesign, espe­cially the folks at Adap­tive Path and the tal­ented Dou­glas Bow­man of Stopde­sign. Slick job guys! To close off the fes­tiv­i­ties I’ll point you to Dave Shea’s new cor­po­rate home. Sweet stuff, dude!

As it seems, it’s also the day to share a list of peo­ple that have influ­enced one’s design style or thoughts on design. So here we go, in no par­tic­u­lar order: Philippe Starck, Rem Kool­haas, Don­ald Nor­man, Hill­man Cur­tis, Joshua Davis, Dou­glas Bow­man, Jason Fried, Todd Dominey and Andrei Herasim­chuk (yeah, you just made the list, boy). But wait, my list would not be com­plete with­out men­tion­ing Dan Rubin, specif­i­cally. Actu­ally, I’m sure I for­got to include a bunch of peo­ple. Nev­er­mind. Bet­ter luck next year. Any­way, I’ll be away for a few days, catch you later.

Categories:

36 Comments

Weekend Reading (19)

Saturday, May 8th, 2004

Categories:

No Comments

Navigation Matrix Reloaded

Wednesday, May 5th, 2004

In my pre­vi­ous post, Jon Hicks raised the IE6 flick­er­ing issue, which has been tor­ment­ing design­ers and coders alike for too long now. At first I thought there was no ele­gant solu­tion to this prob­lem, but after a few error and trial ses­sions I came up with a solu­tion that gets rid of the flick­er­ing — in any situation.

(more…)

Categories:

31 Comments

Navigation Matrix

Tuesday, May 4th, 2004

This method has been updated! See Nav­i­ga­tion Matrix Reloaded.

navigationIt’s been a while since I shared my last nav­i­ga­tion exper­i­ment. This new exper­i­ment is, as the first one, based exclu­sively on graph­ics — there­fore the same usabil­ity and acces­si­b­lity cau­tions apply. Unsur­pris­ingly, once CSS is dis­abled, a nice unordered list should remain. I prob­a­bly don’t need to explicitely men­tion that this exam­ple is con­structed using well-formed and seman­tic XHTML instead of tables. All the tabs work and are linked to 4 indi­vid­ual html pages (welcome.html, products.html, support.html and contact.html) that each load the same stylesheet.

(more…)

Categories:

36 Comments

Newer