The Old Joel on Software Forum: Part 3 (of 5)

Redesign at FogCreek.com

I know this will sound really crotchety, but when did the world decide Web links do not need to be underlined?

When Netscape was in 0.9N or whatever and the Web was young, links were blue and underlined. Which is nice because links are, you know, sort of an important part of the whole World Wide Cybernet interface. You saw blue underlined text, you knew what to do. If it was purple, you'd already been there. You might say blue links _afforded_ clicking.

Soon thereafter, everyone started using the Netscape add-in to HTML that let you to do a 180 and make visited links red and clicked links blue and unvisited links purple. Or whatever you wanted. All of a sudden, no one could really count on link color to mean anything. We all sort of just gave up on that, and then it became even more OK to futz with link colors on your web page, so the links match the solid colored nav bar running down the right side of your page (it's 1995, after all).

There has always been a browser option to get your link colors back, by the way. The trouble is that clicking the option also forces your font colors to override what's in the page and sometimes your background colors too. So white text on a dark graphical background image would become black and unreadable, white white text in a transparent GIF would lose its black background.

Then, a year or two ago, everyone started fetishistically scrubbing the lines from under their links. You only get a link if you _hover_ over the text, which means you have to scrub your mouse pointer up and down the page to see any underlining and hence any links.

So now Web links are totally rogue. We can't count on them to be blue *or* to _even_be_underlined_.

Now I click into Joel on Software, by the guy who wrote the book (or at least *a* book) on user interface design. He's rolled out a new company home page. The body text is blue, just like the de-underlined link text on many other sites. The link text is the same color, but with just a *touch* of green. (Boy am I glad I have my monitor set to 24-bit color!) It is, likewise, not underlined.

Anyway, it's sort of screwy to get all worked up at Fog Creek for doing what everyone else, for some reason, is doing as well. After all, the first rule of Web design is to copy models the users are familiar with. But I can't hep but wonder if the Fog Creek site doesn't make some of the same mistakes Joel takes ETrade to task for here:

http://www.joelonsoftware.com/uibook/chapters/fog0000000060.html

Anyway, the site does look really slick, blue text and un-underlined links aside.

Cheers
r

Ryan Tate
Monday, November 3, 2003

Because apparently "cutting edge" means "less user-friendly". This is why I really like being able to specify that my stylesheets override the web site’s in my browser of choice.

MR
Monday, November 3, 2003

It appears that Joel's links are differentiated by being bold.

I like the new look, usable or not. However, it is ot very cutting-edge. Any web developer with three years experience could build it. Where's the added value in having Dave Shea build it?

Norrick
Monday, November 3, 2003

I'm using Firebird, and all the links are underlined.

Ged Byrne
Monday, November 3, 2003

Norrick, that's what I was trying to poke fun at. I agree, it looks nice but it doesn't look insanely great, at least not considering what I am guesstimating he was paid to 'create' that. A super-fantastic-great $30,000 design it aint.

MR
Monday, November 3, 2003

What I want to know is how much money did they waste on the logo/icon design? Loks like a hundred other corporate logos with some kind of two color "wavy thing".

On the link thing, it's hard to have aesthetically pleasing color schemes if you stick to the old "blue link special". I don't find it hard to navigate most pages that deviate. The content and layout usually make it fairly clear what are links.

sgf
Monday, November 3, 2003

My initial reactions were good; I liked the site.

Just a few comments though...

1. Why are links not underlined here;

http://www.fogcreek.com/

but they are here?

http://www.fogcreek.com/FogBUGZ/index.html

or at least some are...

2. On the last link mentioned, why are some bold words not links (in the main frame), but on the right side (index) they are? As well, my eyes can barely tell the difference between the used links and the fresh ones. Some more contrast would be good.

3. On this page the index is on the right...

http://www.fogcreek.com/FogBUGZ/index.html

and over here they're on the left...

http://www.fogcreek.com/FogBUGZ/HowFogBUGZWorks.html

In summary, I'm a little disappointed. It seems like too much functionality has disappeared in favour of looks. Maybe these aren't valid complaints, goodness knows my webpage doesn't have nearly as much content.

As well, I'm not a graphic artist or similar, but how about another colour to punch things up, perhaps visually separate the main frame from the surrounding information?

I guess it's easy to dismiss something, even when you don't have a better idea ;-)

NC
Monday, November 3, 2003

I really find the way that skyline image at the top fades to white at the right very distracting. The point where it fades is actually the focal point of the page for me because the contrast is so striking. Plus it throws the page off-balance a bit, because of its length; there's less symmetry.

That aside, it's usable and generally pretty.

it_ranter
Monday, November 3, 2003

I certainly didn't mean to start a bash-on-fog session, so I will say I really like the wintry New York shots. I don't know if they are meant to be seasonal (or foggy) but it will be neat if the shots change with the seasons. I think seasonal design will be trend on websites ... I have a friend at a city newspaper website, they already have three different designs for morning, noon, night.

I like the photos in part because they give FogCreek.com a sense of place. It is amazing how many corporate websites fail to even say where the HQ is located.

Also, I should note two links on the front appear underlined on my IE/Mac - "CityDesk News" and the second instance of "Joel on software." The rest are un-underlined.

Anyway, I think my gripes have to do with me personally being anti-change. Also, CSS never seems to work right on my 800 X 600 iMac, so I'm a bit of a pro-table/anti-css-positioning bigot ...

Ryan Tate
Monday, November 3, 2003

I quite like the design, the simplicity is good and makes it easier to read. The logo IS kind of boringly corporate though. And Joel's head should be in blue and grey icon form, it looks silly sitting there in full colour in the middle of the page next to the Joel On Software section.

I certainly dislike the way you can't tell what parts of the page are clickable at a glance though. I'm not going to wave my mouse over the page to find the links. Underline the damn things already, as everyone is saying. I know it doesn't look as pretty, but that's the price you sometimes pay for usability.

The web in general is horrid for usability though. The comment about links being blue and underlined in the old days is spot on. These days, you never know what you'll get. It's like having every windows app have its own colour scheme and widget set. I find it funny how people criticise Linux for having several different toolkits (not ready for the desktop they scream), when the web is 1000 times worse and yet everyone is building web apps.

Sum Dum Gai
Monday, November 3, 2003

I would like to know if anybody has actually had a problem using the new site. I didn't.

Monday, November 3, 2003

The old site was pretty ugly. The new one is pretty nice. All the links I see on it have either a dotted underline or a link-indicative location. Unless I'm not seeing some links, I think it's a pretty good site. Maybe too much blue.

Looks like all of fogcreek.com's been redesigned. How about the front page?

H. Lally Singh
Monday, November 3, 2003

I like it. The only thing I found odd about the navigation is the absence of a Home or Fog Creek link in the top and bottom navigation bars.

Ken McKinney
Monday, November 3, 2003

I moused over the headers and saw they were links because I'm used to corporate sites that sacrifice usability for look and feel. In other words, I found the links not because they looked like links, but because I'm used to having to hunt for them.

"This design is okay because it's broken like everyone else's is"

Philo

Philo
Monday, November 3, 2003

I was going to say that all this criticism over links and coloring is just nitpicking. Then, I realized I had my own nitpick.

I have a 17' monitor set at 1024 x 768 resolution. At first glance I thought that the entire page fit to screen. Then I noticed there was one mouse-wheel scrolldown more to get to the bottom. And behold, there's the footer menu! I had assumed it was just whitespace down there.

The problem is, "Shop Fogcreek" is in the footer menu but not the header menu. Since they've only got 2 products, it's easy enough to click on City Desk or Fugbugz, where links to buy are prominently displayed. So, this isn't a major issue. Still, I would put the shop link in the header since the footer isn't readily visible.

The right side menu in Fogbugz needs a little work. The Fog Creek Software link goes to /indexPreShea.html. I don't know it that's intentional or not. Also, the tool tip text is the same for all the links and adds no meaningful info.

Other than that, it's a great looking site with a simple, clean design that's easy to navigate.

Nick
Tuesday, November 4, 2003

Personally I like the new design, I find it pleasing to the eye! However, how about putting some alt text in for images?

ScottB
Tuesday, November 4, 2003

I like the redesign. Clean, modern.

The Favicon should be updated to reflect the new logo:
http://www.fogcreek.com/favicon.ico

Yoav
Tuesday, November 4, 2003

I find that the new design forces me to scroll sideways. I'm at a 1024x768 resolution, but I keep my browser window narrower than it is tall because most sites on the web seem to be oriented to those dimensions. I'd prefer that the middle section compress itself when I make the window more narrow rather than the right side "fall offscreen".

anon
Tuesday, November 4, 2003

Speaking of links, we can at least be grateful that FogCreek.com doesn't set a:link and a:visited to the exact same color, which seems to be the fashion nowadays. I see more and more sites doing it -- Netflix, for example, and even OK/Cancel, which is supposed to be a comic strip about *usability*, for Goddess' sake.

David Mullen
Tuesday, November 4, 2003

i have a 17" lcd, 1024x768 it all fits on my screen.....

apw
Tuesday, November 4, 2003

NC - what functionality disappeared? What was there before that isn't there now? Just the purple visited links?

jonstos
Tuesday, November 4, 2003

People scroll now, so making it fit the height of a given screen is of less importance.

Flamebait Sr.
Tuesday, November 4, 2003

Nobody noticed that in Firebird you can change the style sheet to something that resemble the old site? Click in the lower lefhand corner of Firebird - check the Status Bar.

Assorted comments:

1. Not all links are underlined section headers like "CityDesk 2.0" are not underlined.

2. Both "CityDesk News" and "Joel on Software" are links at the end of the paragraph, setting up the expectation that each section should have a link at the end of the paragraph. Also, you would expect this link to go to the product's homepage, not the news-about-the-product page.

3. Fog Creek News is on the left where the main navigation is usually located, but it's "meta" information which is usually placed in the right column. The same could be said for the rest of the pages where the main navigation is on the right side, and the "meta" information is on the left.

3a. This meta information is often as dense and eye catching as the center "main content" column. For example the CityDesk page has beige boxes in the left and center columns at around the same top-bottom scroll section of the page.

4. At 800 x 600 the center column is approximately the same size as the other columns.

5. The bottom blue bar is tied to the center column, and not the left or right coumns. Maximize the CityDesk page with a high enough resolution and the last beige box on the left goes PAST the blue bottom nav bar. Happens in IE and Firebird.

6. On the "What's the difference" page for CityDesk ( http://www.fogcreek.com/CityDesk/fog0000000049.html ) the left nav is... well nav instead of meta information, and the links aren't underlined. Same as the "New in 3.0" page for FogBugz ( http://www.fogcreek.com/FogBUGZ/NewIn30.html ).

7. Link titles aren't the same as the title of the page they link to. "Fifty New Features" -> "New In 3.0" "what's the difference?" -> "CityDesk Editions." IMHO this makes it more difficult for a user to find her way back to a page once they've been there.

www.MarkTAW.com
Wednesday, November 5, 2003