Archive for Design

Why Browsers May Be Ignoring Your Floats

Here’s a little tip I thought I’d share, and may be very obvious to many.

I had a design I was testing that had 2 column, 3 column, and 4 column floats all on one page. Problem was, the only browser that seem to actually float the divs was Opera. I spent a hefty chunk of time trying to figure out why Firefox especially was just putting one right after the other.

Turns out the answer was super simple. I had named my classes things like “3col” and “4col”. Once I renamed them to “threecol” and “fourcol” the whole thing worked perfectly in all browsers. So simple.

*insert head smashing desk*

Hopefully I’ll save somebody some time.

Comments

Google Chrome, and the ACID 2 Test

Well, what’s the first thing I tried after downloading Google chrome? The ACID 2 test of course. And how did the new browser fair? Interesting quesion.

This is the screenshot I took. The errors changed based on how large my browser window was. Also, if I waited long enough (like 60 seconds or something), it would create the proper image.

As per most Google products, it’s a beta so I’m sure this will all be fixed soon enough.

Comments

Firefox 3 Beta 1 Passes the Acid 2 Test!

I was only moderately excited for the new Firefox beta since my current version of Firefox 2 is fairly customized and runs great.

However, as I was reading about the updates to Firefox 3, CSS rendering was supposed to be improved. I decided it was time to have another look at the Acid 2 test. It’s a test to see if the CSS rendering of the browser is standards complaint. Firefox 2 was pretty good, but not perfect. Well, Firefox 3 fixes all of that. Here’s the screenshot I took to prove it.

Firefox 3 Beta 1 rendering of the Acid 2 Test

Congratulations to Mozilla for fixing the last remaining significant argument against Firefox! As a designer, I’m very happy.

Comments (3)

Font Smoothing and Web Design

Something that had never occurred to me before today was font smoothing and the web. Cleartype is a font smoothing technology that was included in Windows XP, but was not turned on my default (I have no idea why it’s not the default). I have had it turned on for as long as I can remember, and it never occurred to me that some computers might not have it turned on.

This is a serious problem, I’m not sure how I never thought about it. Here’s a screenshot of the differences.

Comparison of smoothed and un-smoothed text

The effect is not so bad on headings, since the letters are thicker. It’s more obvious on smaller letter forms. And you can’t really get a feel for the effect with just one word.

When you have a text-heavy website, all the jaggies make it nearly unreadable. Especially when you’re looking at large amount of technical text.

Does anyone know about a solution from the web developer side?

Comments

Apple’s Clickwheel – A Borrowed Interface Behavior

I was thinking about the clickwheel on Apple’s iPod and where they got the idea from. I also wondered why this strange circular movement of the thumb is so easy to use.

Well it finally dawned on me. Combination padlocks.

Personally, I don’t use the “pinch and rotate” technique with my fingers to select my combination on my padlocks, I use my thumb over the actual numbered surface. This, I found, was more accurate and quick for me to open up my locker at the gym, in college, high school etc.

Then it dawned on me, virtually everyone has used this type of lock before. It’s a brilliant evolution of an interface everyone has used. Nobody realizes their thumbs have been trained for the iPod for years. Maybe the lock manufacturers should sue Apple. I’d say prior art is definitely established.

Comments

Take Advantage of Human Nature, Reduce Your Choices.

An excellent read from Andy Rutledge:

Few things are as compelling or as fruitful as a rivalry. Any landscape, no matter how vibrant or contentious, is merely tepid without the conspicuous presence of two, and only two, powerful and clearly defined antagonists.

Design View / Andy Rutledge - Versus

Thinking about all the decisions I’ve tried to make over the years (movies at the movie store, type of beer to drink, what kind of sub to buy, what movie to go see, where to walk the dog etc…) this totally makes sense. I have literally spent hours in stores trying to pick between like 5 possible items. Even deciding what to eat for dinner with my girlfriend is frequently a difficult decision.

Thinking now about my work, as much as I’d love to only present two possible designs for a website, I feel that a only two different designs might not represent the best options. I look at web design sometimes more like problem solving. What is the best way to display this information? What is the best method of navigation for this content? There is frequently more than two solutions. In fact, if I haven’t even thought about a thrid option, I probably haven’t thought long and hard enough. How can you reduce possibly hundreds of ideas into only two sets of choices for a client?
Maybe I should just try harder.

Comments