-
Featured Columnists
- Faruk Ateş
- Andy Clarke
-
Kris Hadlock
- Designing with Code: Providing Feedback
- Designing With Code: Creating a Resizable Interface
- Designing With Code: CSS Tips and Tricks to Speed Your Workflow
- Designing with Code: Handling PNG Transparency on the Web
- Designing With Code: Collaboration
- Designing With Code: Improving CraigsList
- Designing With Code: How to Create a Tag Cloud
- Designing with Code: RSS
- Designing With Code: Tumblelogging
- Designing With Code: Create a DropIn JavaScript Component
- Designing with Code: Leveraging Your Existing Content
- Designing With Code: Leveraging RSS
- Designing With Code: Converting Forms to Ajax
- Designing with Code: Converting Forms to Ajax, Part 2
- Designing With Code: Monster Mash
- How to Create Dynamic Script Tags for Ajax Components
- Creating a Winning Proposal for Web Projects
- Creating a Web Design Questionnaire
- Using Stylesheets in Flash CS3
- Animating with XML in Flash CS3
- Creating a Full-Screen Web Site with Flash CS3
- Robert Hoekman, Jr.
- Molly Holzschlag
- Sarah Horton
- Miraz Jordan
- Jonathan and Lisa Price
- Catherine Seda
- Dave Shea
- Dave Taylor
-
Table of Contents
- Welcome
- Web Basics
- Publishing on the Web: Putting Files on the Server
- Web Design Process and Workflow
- Project Management
- Mark My WWWord: HTML and XHTML
- Standards Compliance
- Layouts
- Forms
- Meta Tags and Search
- Usability
- Accessibility
- Enhancing Web Page Interaction
- Web Graphics
- Web Page Optimization
- Multimedia
- Content
- Overview of Servers
- Server Programming Basics
- Careers in Web Design
- Tools
- Tutorials
- Intellectual Property for Web Designers
Designing With Code: Improving CraigsList
Last updated Oct 17, 2003.
By Kris Hadlock
CraigsList is an extremely popular web application used by tons of people in many different countries. People often wonder about the lack of design, but just about everyone I have come in contact with knows about the site, has used it more than once, and has good things to say about it. This week, I’m going to discuss the current CraigsList design, ways it could be improved, and how to better leverage its data so that it’s more accessible and approachable by everyone who uses it.
My friend Robert Hoekman recently wrote a new column about CraigsList and how it measures up against the principles of application design mentioned in his new book, Designing the Obvious. This column is a follow-up to his.
Experimental Redesign
Last March, a group calling itself the Design Fab Five added CraigsList to its list of experimental redesigns. The Design Fab Five featured the redesign at SXSW 2006 and took questions about it a panel discussion that also included CraigsList founder Craig Newmark. The redesign, which is much cleaner and uncluttered, leaves room for the eye to flow from one area to the next. I commend the group, however, for sticking with the same simplicity as the current design.
That said, it still leaves me wondering whether the site would have the same appeal if the redesign was implemented. Would this new design throw existing users off, would it intimidate them? This is very possible, especially since the site’s appeal lies in its content. Let's take a look at the real reason the site is so popular and get a better understanding of how to leverage the content.
Leveraging the Content
When approaching this column, I knew that I wanted to leave the simplicity of CraigsList intact and not attempt a redesign. Let's face it—the site doesn't look very nice, but it works. Plus, the Design Fab Five did a great job attempting this already. Maybe the site is still usable despite its lack of design because every option is in your face on one page with each section only a click away. Or, maybe it’s because the site is so barebones that people feel a personal connection to it (as if they could have created it themselves). Or, maybe it’s because the data is the only thing that anyone cares about. I’m going to simply suggest ways to improve some of the existing interactions and leverage the possibilities of sharing the site’s content.
CraigsList is not popular because of how it looks. People love the site because the content is really good and because it’s a fun place to browse. Plus, since all of the site’s content is also available as RSS, a site redesign is really unnecessary. Because of its nature, the content is better suited for an aggregator. Take a look at how easy—and more visually appealing—it is to access content as a feed in bloglines.
)
Figure 1 Bloglines provides an easier way to access content on CraigsList.
With an aggregator, you’re able to look at new job postings, apartments for rent, or garage sales in your area simply by checking your latest feeds. Go to any page on the web site and you’ll either get an RSS icon in your browser or you can click the RSS link in the bottom right corner. As an RSS feed, the site’s content fits your life and eliminates the need to visit the site at all.
)
)
Print List
Aside from leveraging the content via the existing RSS feeds, another great way to view content on CraigsList is in full text mode. Full text mode is a print-friendly view that’s much easier on the eyes and displays the full text of each post rather than the big blue hyperlinked titles that you’re probably used to seeing. Find what you want, click the full text mode link at the top of the page, hit the print the button, and you have a neat list to carry with you.
)
Figure 4 Full text mode in CraigsList offers another way to view the site’s content.
Full text mode could also benefit the overall site design if it were leveraged in an interaction model that helped keep context in the application.
Keeping Context
Keeping context is important from a usability perspective, but CraigsList doesn't always do a good job of this. The pages look different from section to section and yet, for some reason, the lack of design still keeps it cohesive. Although the visual appearance works in its own unique way, the interactions could be improved a bit. Single-screen navigation is a great way to keep context and would work well in many areas of CraigsList.
CraigsList designers could greatly improve the site’s usability by simply using full text mode as the primary design. Posts could stick with the hyperlinked titles, but rather than opening new pages, they could expand to reveal the content.
)
Figure 5 Using full text mode as the default viewing mode would greatly improve CraigsList’s usability.
This model is becoming more popular in application design because it allows the user to make many interactions without having to wait for a new page to load. This technique also prevents attention from straying and keeps users focused on the content at hand.
Wrapping Up
Overall, CraigsList may not be the nicest looking site, but ultimately it works and fulfills a purpose. Rather than changing the visual design of something that tons of people are already using, the focus should be on helping these people access the data more easily.
