3 ms·

How to Destroy the Web 2.0 Look.

23 points by pius 19y ago

boucher 19y ago
I think one of the reasons the "web 2.0 look" is popular is that it is fairly easy to design. Basic photoshop skills and a little bit of aesthetics go a long way. retro-vintage, custom fonts, crazy edges and textures. These are all pretty difficult for a novice. I tend to think most startups don't have a lot of time or money to become or hire photoshop/design experts, and probably the majority of hackers aren't experts either.
- izak30 19y ago
  Excellent point. This is something that I'm very passionate about. Great developers are most often horrific designers; but they say things like "I like minimalistic designs", which, while true for us developer types (when we're looking for high-volume content), doesn't scale. If Web 2.0 is about the experience, a great design is just as important as a good idea. (that is not to say that one type of design IS web 2.0) I've written more extensively on it here: http://issackelly.com/blog/2007/10/new-way-of-managing-content-for-web.html http://issackelly.com/blog/2007/10/new-way-of-managing-conte... And I'm basing my startup around that exact idea. If you're a startup, get a co-founder with some serious design skills, it's more important than most of us want to admit.
- timr 19y ago
  Yeah...but the "geeks are bad with Photoshop" excuse doesn't explain the proliferation of cliche design elements. For example: it takes more work to generate a glossy bubble button than to not generate a glossy bubble button...but that doesn't seem to stop people from overusing them.
  - boucher 19y ago
    Well, there are two contributors to this. One, there are online tutorials on how to generate glossy bubble buttons, and similar effects (mainly, anything Apple has ever done). And two, now there is a ____ generator for pretty much ever element.
    - tlrobinson 19y ago
      http://www.ajaxflakes.com/web-20/top-100-online-generators-web-20/ http://www.ajaxflakes.com/web-20/top-100-online-generators-w... I challenge someone to create a "web 2.0 generator generator". Or a generator that uses these generators to generate a "web 2.0" site without any interaction from the developer. Not unlike the CS research paper generator that these guys wrote: http://pdos.csail.mit.edu/scigen/ http://pdos.csail.mit.edu/scigen/ Some of the papers were actually accepted into conferences.
      - omouse 19y ago
        I challenge someone to create a "web 2.0 generator generator". Psh easy. Just use some Lisp macros.
- jkush 19y ago
  So follow the current trend and provide tools that make those styles easy to produce.
jraines 19y ago
The design elements he wants to see replace the web 2.0 look: * Retro-Vintage * Warm Dark Color Palette * Rich Textures * Grunge-Retro Fonts * Rough Edges * Ornaments * Stains * Rich Full Layered Headers I can't stand most of these. And boucher is right, they're a lot harder to do anyway. I think the designs that appeal to me are minimally dressed up stuff, like Hacker News and Socialmoth. And the appeal is not just the high data-ink percentage, but the fact that it doesn't take that much coding to achieve, and so is elegant conceptually as well as visually. It does take some thought and skill though, as my own forays into web-design have shown me.
- oditogre 19y ago
  >Grunge-Retro Fonts I was actually thinking a lot of the examples had an almost steampunk vibe to them. Others remind me of some of the music videos that came out in 2002 - 2005, when emo bands started playing with goth themes. I can't say I'm a fan of the cluttered clip art look or the 'stains' / Rorschach inkblots, but a lot of the other stuff I could really get behind. Reading dense text on bright backgrounds really sucks after a while, and having a few rough edges or variations in texture and colors keeps the eyes awake. I'd even be happy if more sites went to having a slightly darker background in the areas where text is like news.yc does (instead of solid white like Reddit).
marcus 19y ago
I don't know about you but I like the minimalistic look. And then again I thought that ncurses is a great UI :)
joshwa 19y ago
I dunno, these designs feel very "2001 ad agency microsite" to me. Nothing post-web-2.0 about them, more like pre-web-2.0. This is what happened when you take your best print designers and set them loose on the web. How do you suppose those sites render once you much with text size? Usability/web standards did not suddenly go out of vogue, did they? Ooo, the original presentation has much more actual content: http://elliotjaystocks.com/blog/archive/2007/destroy-the-web-20-look-future-of-web-design-new-york/ http://elliotjaystocks.com/blog/archive/2007/destroy-the-web...
- oditogre 19y ago
  Looking at a couple of the examples and screwing with the text size a bit, everything seems to work fine except extremely big text (which makes any page look bad).
edw519 19y ago
"Mr Stocks also noted that what makes a site part of the web 2.0 is not its looks, is the way it works." The article should have ended here.
- jsmcgd 19y ago
  Yeah, the rest of the article seems to contradict the beginning.
snorkel 19y ago
Yes, these vanity web sites are pretty but don't get carried away with splattering the page with design. Remember that the average web surfer has the attention span of a caffeinated squirrel and if you carpet bomb their visual cortex with too much stuff, no matter how pretty it all may be, if a web surfer doesn't immediately understand what they are looking at, they get confused and turn away.
jkush 19y ago
This is interesting but not really accurate. If "A trend always appears as the result of the opposition with another." was true, we'd be caught in a loop between one extreme and the next. It's partially right though. When it comes to "taste" there often seems to be a severe reversal in a short amount of time. I like to think of it as a correction. We're getting to the point now, where the web 2.0 look has reached the extreme. It's time for a correction in "taste". The leading edge of "taste" will snap back to something far from what's currently fashionable (I say far because anything else wouldn't seem fresh) and the rest of us will eventually follow. Then it will happen all over again. I think it's partially correct to say a new trend is "opposite" but more accurate to say it's a reaction to how stale the current trend is. In short, the Web 2.0 will certainly change (isn't that a given anyway?), but I don't know that "grunge" is where we're headed.
Goladus 19y ago
The web was not crowded "in the beginning" as the author says. Most of the sites I visited used a lot of text with minimal markup and few images. Here's a page I stumbled across that was obviously from the mid-90s (I was searching for the URL in one of the links on this guy's site) http://www.rett.org/about/oldsites/rettsitev2/pages/links.html http://www.rett.org/about/oldsites/rettsitev2/pages/links.ht... Good page design has always been clean and focused. It doesn't have to look like Web 2.0. http://www.homestarrunner.com http://www.homestarrunner.com is clean and focused. But it doesn't look like Web 2.0 at all. Penny-Arcade looks cluttered at first glance, except it's a gaming fansite and the flashy advertisements are part of its style. Once that is considered, the site appears very clean and focused. It's also not typical "Web 2.0" style. (http://www.penny-arcade.com/2007/11/21 http://www.penny-arcade.com/2007/11/21 "Facebookery") Avoiding gratuitous decoration is just good design. Feel free to add as much complexity as you can, just don't let it detract from the purpose of the site.
- joshwa 19y ago
  That first page you linked to is from the "export bookmarks" function of (I think?) Netscape 4...
  - Goladus 19y ago
    I'm not surprised. The point is that the web wasn't all cluttered like the author implied. Most of it was just text. http://www.debian.org/doc/manuals/debian-faq/index.en.html http://www.debian.org/doc/manuals/debian-faq/index.en.html Much of the content I looked for were actual text files, maybe with some ASCII art: http://www.rpgamer.com/games/ff/ff4/info/ff4_monster.txt http://www.rpgamer.com/games/ff/ff4/info/ff4_monster.txt (incidentally, the original version of that ff4 file was not double-spaced.)
abstractbill 19y ago
I'm not going to get behind any design trend that seem to want to replace more and more text with images of text.
alaskamiller 19y ago
sounds like someone got a hold of this book: http://www.amazon.com/Web-Standards-Creativity-Innovations-Scripting/dp/1590598032 http://www.amazon.com/Web-Standards-Creativity-Innovations-S.... It details how to develop websites he's referring to, particularly DirtyPrettyThings.com done by Sam Collision. A lot of the elements are all pre-Web 2.0. Go to any Border's or B&N and find a web design book printed in 99 and you'll find the very same styles he so loves. The point of this article should have been: "How to determine if you have taste?"
jsmcgd 19y ago
I agree that the sites shown are prettier but I'd argue that they are much more of a visual work out. I think content is paramount, everything else is secondary. Anything that gets between you and the content begins to grate and should be removed.
cmars232 19y ago
All of this and more would be feasible if there were better cross-browser support for vector graphics. These whimsical designs might be ok for niche markets, but they require tedious Photoshop skills and they don't scale.
kn0thing 19y ago
Fools. I think that blogger ought to watch this... http://youtube.com/watch?v=Isk88nT0sRY http://youtube.com/watch?v=Isk88nT0sRY

23 points by pius 19y ago

I think one of the reasons the "web 2.0 look" is popular is that it is fairly easy to design. Basic photoshop skills and a little bit of aesthetics go a long way. retro-vintage, custom fonts, crazy edges and textures. These are all pretty difficult for a novice. I tend to think most startups don't have a lot of time or money to become or hire photoshop/design experts, and probably the majority of hackers aren't experts either.

izak30 19y ago
Excellent point. This is something that I'm very passionate about. Great developers are most often horrific designers; but they say things like "I like minimalistic designs", which, while true for us developer types (when we're looking for high-volume content), doesn't scale. If Web 2.0 is about the experience, a great design is just as important as a good idea. (that is not to say that one type of design IS web 2.0) I've written more extensively on it here: http://issackelly.com/blog/2007/10/new-way-of-managing-content-for-web.html http://issackelly.com/blog/2007/10/new-way-of-managing-conte... And I'm basing my startup around that exact idea. If you're a startup, get a co-founder with some serious design skills, it's more important than most of us want to admit.
timr 19y ago
Yeah...but the "geeks are bad with Photoshop" excuse doesn't explain the proliferation of cliche design elements. For example: it takes more work to generate a glossy bubble button than to not generate a glossy bubble button...but that doesn't seem to stop people from overusing them.
- boucher 19y ago
  Well, there are two contributors to this. One, there are online tutorials on how to generate glossy bubble buttons, and similar effects (mainly, anything Apple has ever done). And two, now there is a ____ generator for pretty much ever element.
  - tlrobinson 19y ago
    http://www.ajaxflakes.com/web-20/top-100-online-generators-web-20/ http://www.ajaxflakes.com/web-20/top-100-online-generators-w... I challenge someone to create a "web 2.0 generator generator". Or a generator that uses these generators to generate a "web 2.0" site without any interaction from the developer. Not unlike the CS research paper generator that these guys wrote: http://pdos.csail.mit.edu/scigen/ http://pdos.csail.mit.edu/scigen/ Some of the papers were actually accepted into conferences.
    - omouse 19y ago
      I challenge someone to create a "web 2.0 generator generator". Psh easy. Just use some Lisp macros.
jkush 19y ago
So follow the current trend and provide tools that make those styles easy to produce.

jraines 19y ago

The design elements he wants to see replace the web 2.0 look: * Retro-Vintage * Warm Dark Color Palette * Rich Textures * Grunge-Retro Fonts * Rough Edges * Ornaments * Stains * Rich Full Layered Headers I can't stand most of these. And boucher is right, they're a lot harder to do anyway. I think the designs that appeal to me are minimally dressed up stuff, like Hacker News and Socialmoth. And the appeal is not just the high data-ink percentage, but the fact that it doesn't take that much coding to achieve, and so is elegant conceptually as well as visually. It does take some thought and skill though, as my own forays into web-design have shown me.

oditogre 19y ago
>Grunge-Retro Fonts I was actually thinking a lot of the examples had an almost steampunk vibe to them. Others remind me of some of the music videos that came out in 2002 - 2005, when emo bands started playing with goth themes. I can't say I'm a fan of the cluttered clip art look or the 'stains' / Rorschach inkblots, but a lot of the other stuff I could really get behind. Reading dense text on bright backgrounds really sucks after a while, and having a few rough edges or variations in texture and colors keeps the eyes awake. I'd even be happy if more sites went to having a slightly darker background in the areas where text is like news.yc does (instead of solid white like Reddit).

marcus 19y ago

I don't know about you but I like the minimalistic look. And then again I thought that ncurses is a great UI :)

joshwa 19y ago

I dunno, these designs feel very "2001 ad agency microsite" to me. Nothing post-web-2.0 about them, more like pre-web-2.0. This is what happened when you take your best print designers and set them loose on the web. How do you suppose those sites render once you much with text size? Usability/web standards did not suddenly go out of vogue, did they? Ooo, the original presentation has much more actual content: http://elliotjaystocks.com/blog/archive/2007/destroy-the-web-20-look-future-of-web-design-new-york/ http://elliotjaystocks.com/blog/archive/2007/destroy-the-web...

oditogre 19y ago
Looking at a couple of the examples and screwing with the text size a bit, everything seems to work fine except extremely big text (which makes any page look bad).

edw519 19y ago

"Mr Stocks also noted that what makes a site part of the web 2.0 is not its looks, is the way it works." The article should have ended here.

jsmcgd 19y ago
Yeah, the rest of the article seems to contradict the beginning.

snorkel 19y ago

Yes, these vanity web sites are pretty but don't get carried away with splattering the page with design. Remember that the average web surfer has the attention span of a caffeinated squirrel and if you carpet bomb their visual cortex with too much stuff, no matter how pretty it all may be, if a web surfer doesn't immediately understand what they are looking at, they get confused and turn away.

jkush 19y ago

This is interesting but not really accurate. If "A trend always appears as the result of the opposition with another." was true, we'd be caught in a loop between one extreme and the next. It's partially right though. When it comes to "taste" there often seems to be a severe reversal in a short amount of time. I like to think of it as a correction. We're getting to the point now, where the web 2.0 look has reached the extreme. It's time for a correction in "taste". The leading edge of "taste" will snap back to something far from what's currently fashionable (I say far because anything else wouldn't seem fresh) and the rest of us will eventually follow. Then it will happen all over again. I think it's partially correct to say a new trend is "opposite" but more accurate to say it's a reaction to how stale the current trend is. In short, the Web 2.0 will certainly change (isn't that a given anyway?), but I don't know that "grunge" is where we're headed.

Goladus 19y ago

The web was not crowded "in the beginning" as the author says. Most of the sites I visited used a lot of text with minimal markup and few images. Here's a page I stumbled across that was obviously from the mid-90s (I was searching for the URL in one of the links on this guy's site) http://www.rett.org/about/oldsites/rettsitev2/pages/links.html http://www.rett.org/about/oldsites/rettsitev2/pages/links.ht... Good page design has always been clean and focused. It doesn't have to look like Web 2.0. http://www.homestarrunner.com http://www.homestarrunner.com is clean and focused. But it doesn't look like Web 2.0 at all. Penny-Arcade looks cluttered at first glance, except it's a gaming fansite and the flashy advertisements are part of its style. Once that is considered, the site appears very clean and focused. It's also not typical "Web 2.0" style. (http://www.penny-arcade.com/2007/11/21 http://www.penny-arcade.com/2007/11/21 "Facebookery") Avoiding gratuitous decoration is just good design. Feel free to add as much complexity as you can, just don't let it detract from the purpose of the site.

joshwa 19y ago
That first page you linked to is from the "export bookmarks" function of (I think?) Netscape 4...
- Goladus 19y ago
  I'm not surprised. The point is that the web wasn't all cluttered like the author implied. Most of it was just text. http://www.debian.org/doc/manuals/debian-faq/index.en.html http://www.debian.org/doc/manuals/debian-faq/index.en.html Much of the content I looked for were actual text files, maybe with some ASCII art: http://www.rpgamer.com/games/ff/ff4/info/ff4_monster.txt http://www.rpgamer.com/games/ff/ff4/info/ff4_monster.txt (incidentally, the original version of that ff4 file was not double-spaced.)

abstractbill 19y ago

I'm not going to get behind any design trend that seem to want to replace more and more text with images of text.

alaskamiller 19y ago

sounds like someone got a hold of this book: http://www.amazon.com/Web-Standards-Creativity-Innovations-Scripting/dp/1590598032 http://www.amazon.com/Web-Standards-Creativity-Innovations-S.... It details how to develop websites he's referring to, particularly DirtyPrettyThings.com done by Sam Collision. A lot of the elements are all pre-Web 2.0. Go to any Border's or B&N and find a web design book printed in 99 and you'll find the very same styles he so loves. The point of this article should have been: "How to determine if you have taste?"

jsmcgd 19y ago

I agree that the sites shown are prettier but I'd argue that they are much more of a visual work out. I think content is paramount, everything else is secondary. Anything that gets between you and the content begins to grate and should be removed.

cmars232 19y ago

All of this and more would be feasible if there were better cross-browser support for vector graphics. These whimsical designs might be ok for niche markets, but they require tedious Photoshop skills and they don't scale.

kn0thing 19y ago

Fools. I think that blogger ought to watch this... http://youtube.com/watch?v=Isk88nT0sRY http://youtube.com/watch?v=Isk88nT0sRY