An Event Apart - Chicago 2007 - Day 1
I had the opportunity to attend An Event Apart – Chicago ’07 conference where I got to spend two days in the windy city getting educated from folks like Eric Meyer, Jeffrey Zeldman, and Dan Cederholm to name a few. During the conference I took notes with the intention of blogging my thoughts on the presentations. I have gone through these notes and tried to clean them up a bit, use proper grammar and frame them in a meaningful context to share.
For the benefit of providing a background, An Event Apart is a conference put on by the same folks that publish A List Apart. Quite simply, An Event Apart is a conference “for people who make websites” as well as one of the few places on Earth where Eric Meyer has rock star status.
Blog notes – AnEventApart, Day 1
I arrived in Chicago yesterday (Sunday morning) with the intent of wandering around the city, which I did for quite a while. I even ventured back out onto the “Magnificent Mile” that night to take some more pictures of cloud gate and the Frank Gehry-designed Jay Pritzker Pavilion at Millennium Park. I am staying at the Marriott where the conference is taking place so it was nice to roll out of my hotel room down to the conference floor where breakfast was waiting for me.
It is now minutes before "go time" and we are all in the grand ballroom waiting for Eric Meyer to take the stage. Jeffrey Zeldman has been lurking around the stage intermittently overseeing the A/V guy. Eric Meyer was just out, looks like he was possibly prepping his slides, getting ready for presentation. This place is packed. There are a lot of people standing against the back wall. The music just got louder, people are scrambling for the few remaining seats. Zeldman is on stage now, he’s taking a picture of the crowd, here comes Eric Meyer…
Eric Meyer – Secrets of the CSS Jedi
Mr. Meyer informs the crowd that his dad is in the audience so would we all please act like we are all really into what he is talking about. That earned some applause. Yoda on the screen now and I note that it’s Genndy Tartakovsky’s Yoda from Star Wars: Clone Wars animated mini-series (how’s that for establishing some geek cred???).
CSS - Padding not just for text, using background, padding, borders, :hover with img…
He made a pretty sweet looking bar graph with a table and some CSS (see example here). The bulk of this presentation is walking through how Eric managed to accomplish this feat. Interesting trick, display a table as “block.” By default a table is set to display as “table” (go figure). The end result is an accessible bar graph.
“This is the most accessible form for this data” -Eric Meyer
Easier for reader browsers, also data can be indexed by server for search easier than image.
“You cannot completely divorce your presentation from your style.” -Straight from Eric Meyer
That kind of thinking leads to ‘reset styles’ which are style sheets that override the default style sheets of a given browser (yeah! Love those!) giving you a clean slate to begin with.
Jeffrey Zeldman – Writing the User Interface
Jeffrey Zeldman implores us not to blog the slides from any of the conference presentations. Someone always does this anyway, nothing bad will happen but they prefer that you don’t blog them. The reason being that the slides are not as meaningful outside of the context of the conference. I won’t be the one to blog the slides so you will just have to go off my notes. Poor you.
Good content can overcome poor Information Architecture (IA), poor navigation, poor design, etc. Content is the key to a good site. Zeldman sums it up with this:
Get a writing budget and hire a copy czar. – Thank you.
Nice! That was about 5 minutes into the presentation. In a perfect world, that’s the end of this story. Side note: Zeldman has a smooth presentation style with simple, elegant slides. Good colors and a nice looking font. He is a pretty funny guy.
Here’s a nice tidbit – All copy is a brand opportunity. Copy affords the ability to reinforce the brand by setting the proper tone with language used.
Let's have a moment of respect for the Project Managers, PM is a horrible job! Moving on, regarding copy writing, take out the legal jargon, the filler stuff and just write it naturally. This not only helps set the tone to reinforce your brand but also helps with search engine rankings (this argument can help you gain buy in from those who resist such language). Use mostly 8th grade level vocabulary (education and vocabulary levels vary), chunk text, use lots of sub headers, and keep it brief and simple. Wonderful presentation!
Jason Santa Maria – Design Your Way Out Of A Paperbag
Any good design starts out with a Discovery Phase. Get to know the client and the community that will be using their web site. He talks about hanging out with some of the folk musicians for the Comhaltas site redesign, getting a taste of their passion (and beer) first hand.
Creative people need to foster a creative work environment by surrounding themselves with inspiring artifacts. Jason has a “morgue file” of analog materials that inspire him. I like the hand typography from the old sheet music and the classic book covers that he shares. He also keeps a sketchbook to quickly capture ideas, sketch things out before moving into the digital realm.
He usually starts with a gray box comp – a comp that does not take typography, color or images into account, simply establishes the layout grid and visual hierarchy. Color, typography and style are applied to the comp later.
Logo and Brand
The logo is not the brand and the brand is more than just the logo.
“A brand is a person’s gut feeling about a product, service, or company.” –Marty Neumeier, The Brand Gap
He has an animation around the “make it bigger” mentality for logos. We all laugh on the outside but on the inside we all weep knowing that the “make it bigger” phenomenon is so pervasive.
“A logo derives its meaning from the quality of the thing it symbolizes, not the other way around.” -Paul Rand
This emboldens my spirit (paraphrasing):
Understand that we are the professionals, we know what we are doing. We should be giving compulsive evidence about why things are the way they are, falling back on research, principals, personas when necessary. Stop thinking about what the CIO wants and start thinking about what “Mary” (a persona example) wants.
Lou Rosenfeld – Search Analytics for Fun and Profit
Search Analytics (SA) are a highly under-utilized tool for User Experience (UE or UX). They can tell you a lot about what your users are looking for. According to Jakob Nielson 50% of website users are searchers (they navigate with the search rather than drill through links).
The Zipf curve
Zipf was an economist, curve showed distribution of wealth in society. Origin of the term “the long tail” but we’re more concerned with “the short head.”
If you want to figure out what’s going on for your site, look at the top ‘x’ percent (the “short head” or sweet spot in Zipf curve from your site’s SA). This can help you prioritize what you should be doing. I keep thinking about the Unicon.net website. What are our site visitors hoping to find from our site? Probably a better recap of this conference than what I am giving out.
If you don’t know what the top 5 searches are on your site, then why do you have that site? Use the top searches for things like “best bet” links, feature prominently on your homepage, etc. Looking for ‘spikes’ in searches, see if spikes match up with your content. Spikes can be seasonal. I think that is especially true in the higher education market.
Liz Danzico – The Seven Lies of Information Architecture
Liz is an editor, writer, teacher, Information Architect (IA), usability analyst. She turned to writing and found herself on the opposite side of editing first time. The editor put a red line through a sentence that ended in a preposition. This caused her to realize that the editor fell back on a convention learned in grammar school. Are we conforming to basic guidelines unnecessarily?
Ah, props to Joe and Josephine, created by Henry Dreyfuss. Now there’s a name I know and admire. Joe, Josephine, and Joe Jr. were essentially the first personas. Dreyfuss used them to account for human factors in his industrial design career. Also, there are some props to Strunk & White The Elements of Style. This is the book I have been trying to finish for two years.
So the seven lies are
- Navigation must be consistent
- There is a magic number (plus or minus two).
- Users must get to all parts of the site all the time.
- Users must know where they are at all times.
- The user experience must be seamless.
- Shorter is better.
- Information Architects must do information architecture.
Here are her revisions
- Navigation must always be predictable and familiar.
- There is a magic number but it always just ‘depends.’
- Users must get to everywhere from everywhere.
- Users must know what’s next.
- The designer must design beautiful seams.
- Short is better and sometimes long is too.
- Information Architects do information architecture and so should developers, designers, writers, clients, and users.
Dan Cederholm – Interface Design Juggling
Dan has created a site called Toupee Pal purely for illustrating design principals. That’s serious dedication. Some simple color info is divulged. I am almost surprised he does not shill for Adobe’s Kuler given that Adobe is a sponsor of the event. I would not have minded so much, I like Kuler.
Some great advice on Typography – great typography is invisible. Concerning typography on the web, he had these quotes:
“During the Italian renaissance the typographer had one font to work with, and yet this period produced some of the most beautiful typographical work.”
-Oliver Reichenstein“Information design is not about the use of good typefaces, it is about the use of good typography… Anyone can use typefaces, some can choose good typefaces, but only few master typography.”
-Oliver Reichenstein
So we do the best with what we have.
Microformats
I will handle explaining this one with a quote:
"Designed for humans first and machines second, microformats are a set of simple, open data formats built upon existing and widely adopted standards. Instead of throwing away what works today, microformats intend to solve simpler problems first by adapting to current behaviors and usage patterns (e.g. XHTML, blogging).”
-http://microformats.org/about
Essentially, microformats are an attempt to standardize markup structures. Someone says “hey I am going to mark up a contact like this…” and then others say “cool, I will do it that way too.” Your website becomes your API. Interesting…
Bulletproofing your designs.
Try turning your images off. When your images are disabled, is the site still readable? Apply style to your alt text. Try turning your CSS off. This helps illustrate separation of structure and presentation. Hopefully you still have a visible hierarchy in the content.
End of Day 1
Day 2 to follow in another blog post on another day.
Your Blogmaster:
