Still on the subject of the dark side of the web: I found a contest for the ugliest website held last June. The winner, which turned out to be mytastynuts.com, won a free redesign package worth $1800. Now this could have been a little more buzzworthy if the contest and company site itself looked like there had been thought put into the design. Heck, if you ask me, the current mytastynuts.com looks better, and don’t really have the right to be doing redesigns.
Of course, there’s really no harm in entering a contest where a free redesign is up for grabs—even if it ends up being not much of an upgrade at all—but that’s the problem with web design: the threshold’s too easy to cross.
The ugliest website contest would also have gone viral if the site were designed in the ugliest manner possible. Something that looks like this (without looking like they’re ripping you off). But that’s the other problem with web design: not everybody “gets” good design.
Many have high tolerance for badly designed sites and bad design in general. Put bluntly, they wouldn’t know if something looks ugly even if it hit them in the face. Sometimes design can depend on a person’s instinct and taste, but it can also suck
Combine that with “it’s just a lowly website”, not something cooler like architecture, fashion, or an ad campaign, and it’s a steep, uphill battle.
And to top it all off, there’s the thin line between design and decoration, which is the absence of purpose and real content. A website, more than any other designed entity, is nothing without content and function.
Don’t be such a downer
Okay enough with the pessimism. How do we get rid of said problems? Eliminate ignorance, for starters. Buckets of inspiration from CSS galleries and image bookmarking sites are always good to have, but it’s also important to know exactly what we should avoid.
I recommend grabbing some eyedrops before clicking any of the links below:
So we know there’s a backlash of the list article format going on. And we know that the general cure to the “disease” is to go for quality, not quanity. Discussions instead of a bombardment of links and screen grabs. Though of course, that’s debatable since if I’m a designer looking for these resources in the first place, I’d find them indispensable anyway.
The thing is though, if I am looking for that perfectly tiled background pattern or that brilliant CSS3 button tutorial, how do I scour through oodles of these lists to find exactly what I need? How would I know from my list of bookmarks or starred Google Reader items that the blog post titled “50+ Fresh CSS Techniques, Tutorials and Resources” is the one I need, and not “5 Useful Coding Solutions For Designers And Developers”? These titles are super vague and because the posts are super long, it’s now finding a needle in a haystack.
List article authors need to raise the stakes and add more useful features. A table of contents, for example, that summarizes all the items in the list. Tags too, that should describe the article with keywords as specific as possible.
Perhaps someone can even create an aggregator of these lists, with proper categorization and search. It could even be—gasp—the next “CSS gallery”.
Why fan the flames and tolerate list articles? Again, I know what they’re useful for. They’re a convenient way to check up on what’s new in the design blogosphere, and you can never have too many resources. They’re certainly taking up space for thought-provoking discussions, but the demand is high and we need them too. We might as well rally to improve the format instead of banish it.
The same goes for CSS galleries and image bookmarking sites. I welcome the large amount of sites because sometimes you can never have enough. But how I browse through and experience their content can definitely be improved.
I’m not just talking about aesthetics or readability here. I’m talking about what can be considered new forms of content with sub-content that can describe and classify them:
the list article as a type of resource list that contains different downloadable files (e.g., brushes, vectors, photos), tutorials, screenshots, etc.
the CSS gallery as a type of website list that contains different websites classified according to style, site type, color, CMS, topic, number of pages, designer, etc.
the image bookmarking site as a type of image list that contains different images classified according to style, image type, color, resolution, designer, etc.
Is it possible to create new content formats for these? People have managed to do so many things with Twitter tweets, and Microformats are moving forward at a steady pace, so why not see if we can remix and mashup larger types of content, like ones contained in blog posts?
One of the biggest problems on the Web is that we’re marking things up on such a low level, while tapping into XML structures isn’t as easy to do yet. But imagine if we can make all these resources so much more organized and findable. Maybe people wouldn’t need to complain about list articles and CSS galleries as cliches then.
A gallery that only cares about what your site looks like when it’s printed? Ironic, but that’s what printFancy is all about. Remember those niche design inspiration galleries? This site is obviously another example of that. But that’s not all.
Unfortunately, the fact remains that people still print webpages so they can read them in a more comfortable manner; it’s not very environment-friendly, and frankly, weird behavior to people who are in front of the computer 24/7. (Weirder than using IE6.) But it’s a web designer’s responsibility to accommodate that need. No excuses. Even if sometimes, it does feel like creating a whole other website (except if you’re a minimalist, I guess).
And when you manage to create an effective print version of a site, then printFancy is another opportunity to show it off, another incentive to excel in design. Which is not just about creating something looks pretty, but something that fills a need. In this case, the need to print sites out.
(Then maybe the gallery can have a section like this, and one wouldn’t have to hold a laptop the way Jason Santa Maria did.)
In celebration of the iPad retail launch, Apple has created a gallery of iPad-ready websites that are said to embrace “the latest web standards—including HTML5, CSS3, and JavaScript”. That is, no Flash. You can even add your site to the gallery (scroll to the bottom).
Is Apple really opening up?
Let’s get the snark out of the way: a gallery, really? How novel. Right now there’s a vertical list (no Cover Flow?) of 20 top-tier websites. Will Apple really painstakingly update this list and add every possible HTML5/CSS3/JS-ready site submitted?
It’s a rare thing for Apple to lead a user-generated campaign like this but its best intentions are a thin veil over their real agenda—eliminating the competition and expanding further in the multimedia business. Does it really care about anything other than the big fish? What are the odds that the most humble of websites will even get into the gallery? Apple markets its products by partnering with the largest corporations that fit into its plans; I can’t imagine caring for the little guy in all of this.
This isn’t even in the same league as the iTunes app store—whose contents number in the hundreds of thousands—but could easily apply the profit-based and biased policies anyway. Not what I would call open or little guy friendly.
Is Apple a true web standards crusader?
Speaking of the app store: you can also develop specifically for the iPhone/iPod/iPad family using the SDK, but those apps don’t work in other devices. The mobile web is booming because of both the “web standards way” and the “mobile app” way, but how are device-specific apps any better than Flash apps (which happen to be cross-platform outside of Apple’s products)? Flipping off Flash when HTML5 and CSS3 aren’t ready isn’t a very responsible thing to do.
If Apple really wants to promote web standards, it should be doing a lot more with its resources to convert and educate people. The gallery is one thing, this documentation is another good step, but where are the resources for developing in HTML5, CSS3, and JavaScript? Partnerships with web standards groups like WaSP? Zeldman or one of the Super Friends speaking at the keynote?
If Apple really wants to promote web standards, see how it practically equates HTML5 with Flash-free media and nothing more. No oohs and ahs over CSS3′s text shadows and rounded corners or HTML5′s geolocation and <canvas>. This is the perfect opportunity to introduce the mainstream crowd to the wonders of these new technologies, yet all it’s pushing is anti-Flash propaganda.
One more thing…
Dear Apple, you’ve done a lot of groundbreaking things, but if you’re going to use web standards as a selling point for your most adjective-ridden product ever, you can do a hell of a lot better than an an anti-Flash gallery.
Unmatched Style, which is one of the better CSS galleries out there, has posted its first video podcast discussing several notable websites featured in their showcase within 10 minutes. You can watch the episode below:
Let’s see what is happening here. The video podcast is a good solution to explaining why a certain website made it into the UMS gallery. Gene and Jay discuss what they like—and don’t like—about it as the site is being displayed, which seems more convenient than having to visit the site and then switch over to an article pointing out the nice design bits here and there.
I say seems because of course, actually visiting and interacting with the site trumps watching videos and viewing thumbnails any day.
Still, I think it’s a solid way to innovate and add value in this already saturated market of CSS galleries. This is almost the opposite of going niche, because what UMS has been doing is being more than just a trend-imitating, money-making gallery but a definitive resource. Something that isn’t just a CSS gallery anymore.
I think we need both, any, and all sources of inspiration, though. CSS galleries are usually just a collection of screencaps that become attractive depending on their content, but we need as much inspiration as we can get our hands on. Sometimes we’re looking for that specific site type; that’s where niche galleries come in. And then we need opinions from other people to help point out what we may have missed.
I’m looking forward to another ten minutes of UMS’s next video podcast, and curious as to how else one can improve the quality of these “inspirational” sites.
I’ve written about emerging gallery-style websites like image bookmarking and information design. Here’s yet another trend: niche web design inspiration galleries. Here are examples of those classifications:
Most of these sites aren’t really new, except that enterprising webmasters are coming up with new categories more often—seemingly every week!
Do we really need new sites for all these categories? I would say yes. Despite the presence of categories and tags, custom search engines powered by Google, gallery aggregators like Most Inspired, you can never have an excessive supply of inspiration.
Plus, visual search using mere keywords is still ineffective. Usually because there isn’t enough care given into describing images. You can never really tell how many tags you can add to properly describe the look and feel of a website.
In fact, since websites are basically interfaces and not just 2-dimensional designs slapped onscreen, showcases and galleries should also focus on their interactive elements. That’s probably where pattern galleries like Pattern Tap comes in.
Update (June 14, 2008): Victor says his project, vi.sualize.us, has been around longer than the sites I’ve mentioned here. So, again, this is another image bookmarking site worth checking out.
I smell a web trend. In the last few weeks I’ve discovered two new image bookmarking sites in addition to the insanely famous but still exclusive FFFFOUND!—We heart it and typeish.
To those who are asking “but why?”, normal bookmarking services aren’t visual in nature. Whether it’s social bookmarking like del.icio.us, or social voting like Digg, or serendipitous discovery like StumbleUpon, users decide if a website is worth visiting by looking at its name, description, tags, and popularity.
Granted, those sites are getting smarter by taking snapshots of what the sites look like, or by isolating thumbnails for if it’s an image or video being bookmarked. But it’s nice to have a dedicated tool that satiates your hunger for all things eye candy. The question is, are these image bookmarking sites effective?
*/
