In his opening keynote at An Event Apart in Washington, DC 2011 Jeffrey Zeldman talked about the need to keep content front and center in Web sites and the Web design process. Here's my notes from his talk on Content First:
- Content is really a design problem. Yet the sites we design are often hostile to content. They don’t think about contingencies or how content creates an overall user experience.
- Content is often subservient to related links, SEO content, navigation systems, and more.
- Web pages can't look the same in every browser. Users are in charge of how they view the Web: form the browser they use, to font settings, etc. But now they have even more control.
- It’s not just the visual experience that you might not be able to control. If we don’t design to be friendly to content, our users will find a way to make the content friendly anyway. Through tools like Instapaper and Readability, people are time and design shifting to experience your content the way they want.
- This is how the Web works anyway. But we’ve all believed we had control by creating illusions of which browsers and screen sizes our users had.
- Every device does not need to have the same experience. Trying to maintain the same experience in all devices is dated. It is an obsolete approach. People understand different devices provide different experiences.
- This experience is even worse on small screen devices where there is even less space devoted to content.
- Design that does not serve people does not serve business. When you do things that are anti-user, you are designing anti-user patterns. Example: services that spam your address book without you knowing it.
- Design that is hostile to users is also hostile to business (esp. in the long term). You don’t want to be the company known for tricking users.
Content Precedes Design
- Design without content is decoration. It used to be that you worked on look and feel before you thought about content. But it’s actually very hard to do design without content.
- It’s important to have a style that is appropriate but hard to develop that style without an understanding of content.
- When the Blogger team asked for design templates, it was really difficult to create anything appropriate devoid of content. Doug Bowman made a universal template that was minimalist and ended up on 20 million blogs. It was the best solution for the problem of designing where you don’t know the content. But it’s one of the only success solutions to this problem out there, which illustrates how hard it is to design without content.
- A design that understands and supports content is always going to be better.
Mobile First, User First, Content First
- Many times when we say mobile we are often talking about small screen. Small screen design adapts by adjusting layout and media to fit on smaller viewports. If you are primarily a content site, you might need a small screen strategy not a full mobile strategy. That can be managed through responsive Web design.
- Progressive enhancement is a universal smart default. Most of agree that it’s a best practice to create an experience that can reach everyone.
- Responsive design is progressive enhancement taken to the next level for the Web we have now (many devices, many different ways to interact with content). Layouts that adapt themselves to devices can be implemented in many ways. Fluid grids, flexible media, and media queries are just one way to implement the idea.
- Great mobile thinking takes into account the special things you can do on a mobile device.
- Small screen and limited utility force us to put user needs first.
- Mobile first =user first = content first. This is the way all our Web sites should be made.
- Mobile will usher in Web standards and usability in places they never succeeded before due to the rise of mobile WebKit (and IE9) browsers.
- The way we put our Web sites together is kind of backwards. We can steer our clients and bosses to more rational ways of working.
- Before any design work happens, a committee of stakeholders usually writes up a set of feature requests for the site. Sometimes this leads to turf battles. IT department requirements and CMS capabilities also impact what can be done.
- After all these things are done, then a design team is typically brought in (after all these decisions have been made). Usually this is too late.
- Instead start with the content. Go through the exercise of understanding what content & tasks your site needs before making any templates or designs.
- Everyone should start with an experience and content strategy not a turf battle over features.
- Use mobile screen size & limited bandwidth to focus on what is essential in your site. Then build up from there.