RKNet Blog… thing

Hot:

Day one was fraught with challenges, up to and including having trouble finding the venue. It took a lot of wandering around, a phone call, and I think two concierge desk stops to finally figure out that the Copley Plaza Marriott was in fact through the Copley Plaza Westin and the attached mall. That said, on with the notes.

Session 1: Understanding Web Design – Jeffrey Zeldman

• Missed this session entirely. :(

Session 2: Lessons of CSS Frameworks – Eric Meyer

• Missed over half of this session. :( I blame Mass traffic.
• Hits on server vs. File size. The more hits to the server, the slower the load times. File size isn’t nearly as much of an issue.
• IE(6) does not cache 2nd tier stylesheets. (stylesheets linked from within other stylesheets)
• IE6 wants nothing to do with your fancy link styling. Don’t rely on it to convey critical information if you think you’ll have a significant amount of IE6 visitors. (Know your audience!)
• Mobile phones probably can’t handle your stylesheet (iPhone notably excepted from this guideline).
• create a grid or layout background to use for debugging.
• Create a debugging stylesheet that replaces more subtle elements with large, bold colors to see exactly how your major elements line up.
• Set default colors in the body of the document to override any CSS weirdness or absence.
• Try to avoid measurements in pixels. Percentage or EM will provide better usability and cross-browser support.
• Create a framework file. This is a totally empty stylesheet, containing only elements, classes and ids, as well as comments explaining the general purpose of each. This provides the framework for others to understand your work, and gives you a blank to start from in future work.
• Maintain clean, logical naming conventions. Don’t use .RedBigText use .Header or .CallToAction. This way if you have to make this class perform a function other than red, big text you can make those changes while maintaining your markup.

Session 3: Good Design Ain’t Easy – Jason Santa Maria (turned 30! Happy Birthday!)

• Look to be different. Be familiar with popular box models & learn what you can do to separate yourself from them.
• Print != the web. (!= is does not equal for those who aren’t familiar) Therefore, instead of innovating based on standards of print, we must look to usability standards and concepts to build a better (mousetrap) website.
• Design reinforces your message.
• Design fills in where content leaves off to create impressions.
• Referenced the storytelling power of a mostly visual chart of Napoleon’s progress.
• Pacing must be capable of including all pertinent info. Editor’s Note: I don’t remember what I meant by this note.
• Design must account for flexibility, changes, functions
• Design must be able to demonstrate depth, or give the visitor confidence that they can navigate comfortably.
• Design for your audience, not just to fit your box model.
• Take advantage of the medium, learn to apply the tech to its fullest.
• Plan before you do, and make stylesheets accordingly flexible
• Level of design intricacy hinges largely on the type of content it is meant to showcase and support.
• “Design can’t not communicate.” – David Carson, Helvetica
• The Golden Rule or other ratio is a handy reference for balancing a box model.
• Links:
• A Brief Message
• Fray
• Principles of Beautiful Web Design
• No One Belongs Here More Than You
• We Tell Stories
• “You can have it in any color you want, as long as it’s black.” – Henry Ford regarding the Model T
• Art direction should apply to the web also.
• Evaluate the saclability of unique content art direction (i.e. serious differences between pages, breaking from one standard template between pages).
• Marry your design to your code.

Session 4: Web Application Hierarchy – Luke Wroblewski

• You have approximately 1.6 seconds to make an impression on a first time visitor.
• References Steve Krug’s excellent book Don’t Make Me Think in regards to illustrating how we use the web. We don’t read. We track around the web looking for the next thing to get us to our intended informational goal.
• Great presentation on the web is comprised of a balance between information and emotion, or Visual Organization and Personality.
• Organize things in ways people can relate to. For example, organizing information in a customer lookup system like a rolodex.
• What’s front and center is critical
• Presentation should follow desired function
• Downplay non-critical information
• Create context by applying contrast, placement and seperation
• Consider the color scheme. Contrasting colors attract attention.
• Make uniquely important items distinct from the remainder of the page.
• Focus on your use of labels, whitespace, and the scanability of your page.
• Proximity of items, similarity of items, and pattern of items dictate how noticable they are.
• The more differences between neighboring items, the higher the contrast and the more likely a visitor is to focus on it.
• Orchestrate the distribution of visual weight (what’s most noticable to what’s least noticable) to influence user experience.
• Avoid too many “look at me!” items as it creates confusion.
• Avoid too few “look at me!” items as it leads to disinterest
• Information should not be distributed via firehose
• Be aware of how people access and use your site. Or how it is intended to be used at least. These factors inform how the hierarchy of information should be structured.
• Consider how people find you and what you want them to do when they get there.
• People come to your site for some kind of content. Don’t let the overhead (structural elements of your website, other navigation, etc) overwhelm that content. Give the people what they want.
• Visually prioritize the actions you want or need people to take
• Strive for a clear, logical flow of information using visual cues and standardization of content. (Hint: Centering text is very unhelpful when trying to achieve this logical flow.
• Consider your overall signal to noise ratio when displaying lots of information. Too much contrast and the data gets overwhelmed. Too little and the data itself is overwhelming.
• Luke’s site: Lukew.com

And then it was lunchtime! Will talk more about that when I get around to my travel log post. I’ll have the rest of day one in a seperate post, so keep your eyes open, and if you aren’t already subscribed to the RSS feed, by all means hit the GIANT PURPLE BOX at the top of the site to do so. :)

Potentially Related posts

• Octopi dreams – late in recording (0)
• LOL Meme! (0)
• Cross-posted rant from MySpace (0)
• No Other Explanation Necessary 9: Totally Ripping Off My Style (0)
• A Vinyl Toy Project I Can Totally Get Into: My Little Pony (0)