A List Apart Redesigns, Makes Me Weep

A List Apart, the venerable online periodical for web people, has quite possibly just pulled off the perfect redesign.

Everything is great. Nothing is bad. Click here to see the wickedness.

Favorite design touch: The hover underlines which disappear in the middle of the center-stacked text.

Favorite new feature: Adjustable color palettes for different issues.

Congratulations to Jeffrey Zeldman, Jason Santa Maria, Eric Meyer, Dan Benjamin, Kevin Cornell, Erin Kissane, and team on a great piece of work.

Meatspace Stan has more here.

*Prediction: A center-stacked headline mini-boom begins today.

Like this entry? You can follow me on Twitter here, subscribe via email here, or get the RSS feed if that's how you roll.

33 Responses:

  1. Mike says:

    A new content management system that uses Ruby on Rails? I thought they were still using the Alvey-designed Blogsmith software?

    *Political murmurs rumble off in the distance*

  2. The headings are a nice touch, but I really have to get used to them…

    It’s nice, though. Good to see a more usable ALA

  3. “*Prediction: A center-stacked headline mini-boom begins today.”

    That’s one of the first things I thought, too.

  4. Christian says:

    I have to disagree, Mike; I was [am] underwhelmed. Months of no content updates, and now a redesign of the site? There really ought to be a joke (perhaps there already is) that the only thing web designers seem to be able to do is constantly redesign their own sites. Don’t get me wrong, I’m not knocking the new design – it’s quite nice. But aren’t you kind of getting to the point where you go, “Oh, [big name web designer] just redid their site … again. Ho hum.”

    Having said that, I will now return to working on my own website, which I am currently in the process of redesigning. *sigh*

  5. Jonathan says:

    I’ve gotta say… I’m just happy for some activity on A List Apart. I was just wondering yesterday when they were going to update the site.

    I had heard somewhere (possibly from alistapart.com) that they were going to do a redesign, so I’m not overly surprised by it, but I think it looks great!

    Hopefully the new redesign sparts more interest in the content of the site and we start seeing new updates soon.

  6. Though I would echo the sentiments above in hoping that ALA once again posts new content, I think the biggest reason why ALA hasn’t been updated is due to the rediculous schedule of Zeldman – His web superstardom has caught up with him. I wonder how he finds time to sleep…?

  7. Chris K says:

    I like the redesign. To have a complete overhaul with everything on it after months of no activity is a bit overwhelming. Right now, its a shock to the system. I predict we’ll continue to rave over it as everyone gets more acclimated to all the new features and layout.

  8. Adrian L. says:

    I dunno… I’m not really impressed.

    Does anyone else thing it looks like ever second “design” blog out there?

    I can see the wheels turning there guys. Of course it looks better than my site, but my site’s not about design.

    I think I agree with Christian. I’m Underwhelmed.

  9. Christian: I totally understand what you mean. I can tell you first hand, the site was originally only suppose to take 1-2 months. Then it snowballed as we got more and more into it. It was a situation where we wanted to wait to publish the new content in the new site.

  10. Jared L. says:

    Favorite design touch: creating a design that has a left-right scroll bar in 800×600 display mode.

    Yes, that was being sarcastic.

    When over a quarter of Internet users still use this resolution (sad but true), wouldn’t one consider this a bit of an accessibility issue? Granted, I’d assume that their audience has a much lower percentage of people at that resolution.

  11. Jared -

    Consider the audience, though. It’s not my mom reading ALA. It’s aimed at web designers who either are on, or wish to be on the forefront of Web 2.0.

    I would venture to guess that a very small percentage of ALA readers have 800×600 setups. I bet the percentage is higher for 1280 or more.

  12. I like the design, the fact that it was rebuilt on Rails (Web 2.0 shows it head again). I agree that most of the visitors of ALA will have a 1028×768 screen size, so the scrolling on an 800×600 doesn’t bother me, but no print.css?? I’m hoping this is just a slight oversight.

  13. Thomas says:

    With the assumption that ALA is a web magazine geared towards the web-designer/web-programmer/project-manager/anyone-else-on-the-web-development-team so they might learn more about XHTML/CSS/Accessability/web-standards-developing-script, I see a clean, open, easily read layout.

    Much like a magazine is geared to be, I don’t see ALA as a “design” sight – one that focuses on being the wicked-worn/rounded-corner/pastel/aqua/over-used-flash-looking-eye-candy. So, I’m not “underwhelmed” by the design. Their form matches their function very well with this re-design and I’m looking forward to reading the new issues. Also, ALA is a “contribution” site, so the look, I’m not surprised, matches the individuals who are involved.

    Finally, the touch of illustration is a fantastic addition – although I have a tendency to being partial to illustrators. I’m also looking forward to wearing the t-shirt designed by Jason.

  14. Stephen says:

    I have two screens, one is 1400×1050 and the other 1680×1050 but consistently browse with a window smaller then 1024.

  15. Adrian L. says:

    Much like a magazine is geared to be, I don’t see ALA as a “design” sight – one that focuses on being the wicked-worn/rounded-corner/pastel/aqua/over-used-flash-looking-eye-candy.

    I don’t consider any of that design either Thomas, I consider it styling – much of it overdone and tired.

    Yes, it’s a “contribution” site. But it long ago established itself as a bastion of xhtml/css technique goodness, promoting the idea that well built sites don’t need to look like poo.

    And the big “innovation” in terms of the site visual? Centered headlines with some admittedly nifty underscoring. The rest looks like every other standards compliant minimalist blog out there.

    Looks like there’s some room to dethrone the reigning lords and ladies of webcraft, if this is their finest.

    Me? I’m just a painter. Ask anyone. They’ll tell you painters never get anything done.

  16. EAW says:

    Re 800×600:
    Jared, you’re missing the fact that they DID design it to work on 800×600, but in a way that makes use of more screen real estate for us with bigger screens.

    On the home page, 800px wide cuts off exactly after the middle column. Yes, you have a horizontal scroll bar, but you could read most of the content without worrying about it. Similarly, on an article page, the article content is exactly wide enough to fit in an 800px wide screen.

    I personally think this is a great solution to this problem (Stylegala does something similar – http://www.stylegala.com). It’s a trade off, of course, but I think it’s a good one (especially considering ALA’s target audience).

  17. I’ve seen so many repeated comments about the design not fitting in 800×600. The word “underwhelmed” has been tossed about like a hot potato, and people are complaining that there’s no print stylesheets (yet). In the words of Mr. T, “Quit yo’ Jibba-Jabba!

    Get down off your high horse and step back for a second. Take a look at the subtle rollover affects. Marvel at the simple and elegant framework these guys have built for a site that is a hallmark of the XHTML revolution. I say Great Job! Bravo!

  18. Joe Clark says:

    Christian, the new site was held up while the CMS was being built. And I’ll thank you not to discount the three new articles published today, one of them mine.

  19. Collin says:

    It doesn’t matter that they didn’t design their site to look perfect at 800×600. Consider their target audience and the percentage of higher resolutions is much greater then that of other web sites. How many people here have 800×600 screens?

    With that said, some people don’t like to have their browsers maximized all the time. For instance, I have my monitor sectioned off into 3 areas. The main area being about 800 pixels wide for browsing while the top right of my screen is playing a video. (Currently Pinky & The Brain) – But, alas, I have the option to maximize across my entire screen to solve the issue so I can live with it.

    Resolution aside, this is a great design. Very clean and subtle colors that won’t be getting in the way of your reading. With so many overpowering designs it is nice to see sites like this keep content as the center of attention.

  20. Adrian L. says:

    Aside from resolution issues, and my opinions on the design, there are technical deficiencies with this redesign. The main navigation options (Articles, Topics, About, etc.) are lost at larger type sizes (two steps up from “normal”) in both Safari and Firefox.

    I haven’t even looked at it using Internet Explorer, because I’d never judge someone’s site by the way IE rendered it.

    Why do those with font sizes set larger than normal lose the main navigation?

  21. Su says:

    Really nice. The subtle details are particularly pleasing, as usual. There are some elements that honestly don’t make sense to me, though. I can’t figure out what the logo tab/box thing is supposed to be, and especially why only the thin black line of the header bar overlaps it. I don’t get the logo, but have to admit that it’s always seemed more of an exercise in styling than particularly representative of anything. (I’m going to get crucified for that, aren’t I?)

    The XHTML t-shirt is…disturbing.

  22. @Adrian L: What are you talking about? I could bump up the text size a dozen times and the main navigation works fine.

  23. Adrian L. says:

    @ Matthew Pennel: Tried that on a 12-inch Apple laptop? The main nav keeps expanding to the right, sans horizontal scrollbars, leaving anyone using “non-standard” type sizes in Safari or Firefox on a 1024×768 screen with incomplete nav.

    That’s what I’m talking about.

  24. I’m very undecided about the re-design. The top navigation bugs me for some reason, I still can’t work out why. And using Opera 8.02 with a resolution of 1680 x 1050 the « Previous page | Next page » links at the bottom overlap the footer. And on page /articles?page=2 I cant use the menu unless I hover over the top of the words, where the colour bar appears. It seems to work OK on the other pages though.

    *shrug* I think I spend too much of my days testing…

  25. Ian says:

    Anyone else find the code too hard to read? Just seems far to small to me.

  26. Nathan says:

    Wow, I must be a dummy cause I thought the new design “shat” all over the old one…

    I can understand people have expectations when it comes to such a high profile redesign, but honestly I think some people are being a little over critical… Is that perhaps because they don’t like seeing people design something that they can’t?

    From ALA:

    We are still working out some bugs. (And yes, darlings, that may even include one or two XHTML validation bugs.) A few things that we will soon do suavely, we currently do a bit crudely. Nevertheless, here we are. (Love it? Hate it? Let us know.)

    I say good on them, they have created something very nice and I for one won’t frown on them for trying!

    Cheers.

  27. Mark says:

    @ Nathan

    “honestly I think some people are being a little over critical”

    Amen.

  28. Adrian L. says:

    “honestly I think some people are being a little over critical”

    No more critical than I expect people to be about my work. I imagine the parties responsible for the redesign are more than happy to hear people’s concerns.

  29. Design-wise I like the look a lot but most of all I’m glad to see new content. The contributors are all definitely web superstars with very busy schedules I’m sure but I’ve been visiting a lot lately wondering when I’d see something new. Mission accomplished…and then some.

  30. Regarding the adjustable color pallette for every issue feature…

    That ‘s actually one of the subtle changes that I discovered works well with presenting issue changes, etc.

    On this site that I worked on, we took hints from the print magazine and used the magazine’s colored border to change the site (the color changes according to the issue). That way when a regular viewer goes to the site, they immediately know if a new issue was released.

    Examples of the changes:
    Issue #62 – Dark blue
    Issue #63 – Burgundy
    Issue #67 – Purple love

  31. @ Adrian:
    No more critical than I expect people to be about my work. I imagine the parties responsible for the redesign are more than happy to hear people’s concerns.

    Exactly. If nobody was being critical about the errors and such, they might not get fixed.

    I don’t believe there’s ever a way of being over critical in design.

  32. Steven says:

    I so wish I could invest more time and energy into your ongoing discussion of the finer points of contemporary design. Unfortunately, other, more mundane/ practical, matters bekon for my attention. I will agree, however, with those who simply appreciate the work for what it is, and abhore the endless criticisms it has drawn.

    And, I believe there is, by the way, a thing called being “overly critical” in design — it’s when you’ve fallen into a relativity paradigm so deeply and may have forgotten that the only way out is through commitment.

    That’s when/ where the designer exhibits intellectual maturity; this is in acknowledging the importance of relativity (or of criticism, in general), though realizing that for all practical purposes (and design is, for many out there, a practical endeavor) there’s no need to settle for it’s repetitious, circular, inconclusiveness.

    Anyway, that’s what I think. What do you got?

  33. Ralph Spoilsport says:

    If you separate the design from the markup, there is really not much to talk about here. There are some elements I would question, and others are very nice, but nothing terrible and nothing great.

    The only reason we are talking about this design, is because it is ALA.

Shared
How to travel around the world for a year:

Great advice for when you finally find the time.

LiveSurface:

A fantastic app for prototyping your design work onto real world objects like billboards, book covers, and coffee cups. This seems like just as great of a tool for people learning design as it does for experts.

50 problems in 50 days:

One man’s attempt to solve 50 problems in 50 days using only great design. Some good startup ideas in here…

How to Do Philosophy:

If you’ve ever suspected that most classical philosophy is a colossal waste of time, Paul Graham tells you why you’re probably right.

TIME: Why Medical Bills Are Killing Us:

Stephen Brill follows the money to uncover the pinnacle of corruption that is the U.S. Health Care system. A must-read article if there ever was one.

DIY Dot Org:

A beautifully designed site full of fun and challenging DIY projects. I could spend months on here.

The Steve Jobs Video Archive:

A collection of over 250 Steve Jobs videos in biographical order

Self-portraits from an artist under the influence of 48 different psychoactive drug combos.

Water Wigs are pretty amazing.

David Pogue proposes to his girlfriend by creating a fake movie trailer about them and then getting a theater to play it before a real movie. Beautiful and totally awesome.

Jonah Peretti's letter to BuzzFeed’s employees:

If you’re wondering what a excellent blueprint for a modern media company looks like, look no further than Buzzfeed CEO Jonah Peretti’s latest email to his employees. In it, Peretti explains a lot of his company’s virtues, the most important being a relentless focus on always providing what’s best for the user. Vox Media (operators of The Verge) is the only other company I can think of which approaches this level of reform and execution.

The Covers Project:

I love this so much: a cross-referenceable database of cover songs, searchable by song or artist. Slowed down, acoustic covers — no matter the song — are so enjoyable to me that I wish it was a requirement to play one at every show. If you like them as much as I do, make sure to check out M. Ward’s Let’s Dance or Sun Kil Moon’s entire album of Modest Mouse covers.

“More and more people in this country no longer make or do anything tangible; if your job wasn’t performed by a cat or a boa constrictor in a Richard Scarry book I’m not sure I believe it’s necessary. I can’t help but wonder whether all this histrionic exhaustion isn’t a way of covering up the fact that most of what we do doesn’t matter.”
- Tim Kreider’s denunciation of the cult of busyness is excellent. (via jimray)
The iPhone and Disruption: Five Years In:

Take your pick of about 20 great quotes from this Daring Fireball article. My personal favorite:

The iPhone is not and never was a phone. It is a pocket-sized computer that obviates the phone. The iPhone is to cell phones what the Mac was to typewriters.

sirmitchell:

Challenges of Getting to Mars: Curiosity’s Seven Minutes of Terror

The precision and innovation that is required for space exploration just blows my mind. I did not realize that Curiosity will have to basically land on Mars completely unaided by man, but it’s so much more complicated than that.