NETWORKING

1. Compress files downloads.
   Utilize gzip encoding when making http requests and responding to those requests. Don’t do it on images! They’re already compressed.
2. Provide cache-able content.
   Set an expiration date on your responses so the server doesn’t have to pull it down again.
3. Use conditional requests.
   Only pull content if it was last modified since a certain date. Include the modification date in the response.
4. Minify your Javascript.
   Removes extra spaces and returns, replaces variables with single characters, can make your Javascript be 25% of its original size.
5. Do not scale images.
   Requires less CPU time for the browser to display the image. Sending more data than what is needed slows down the download process.
6. Use image sprites!
   Keeps network requests down.

HTML

1. Link Javascript to the bottom of your page.Inline Javascript slows down your page load in older browsers b/c older browsers need to execute that code right away.
   Don’t ever link to a script file in the head of your page. In older browsers they will go ahead and load that Javascript before the page is even done loading. Link your Javascript at the end of the file instead.
2. Add a defer tag when you must link Javascript at the top of the page.You can also use the defer tag in the script tag if you must put your Javascript in the head part of your page. This defers the loading of the Javascript until the entire HTML page has been rendered (supported since IE4, don’t know about FF).

CSS

1. Link the CSS in the head of your file, unlike the Javascript best practice.Don’t want any “flashes of unstyled content.” Avoid embedded styles; can slow down loading of webpages.
2. Avoid using the @import for CSS files as it slows down the browser.The browser tries to download all of those imported files so it can properly render the cascade and thus takes longer.

COLLECTIONS

1. He didn’t really address anything under this topic.

JAVASCRIPT

1. Minimize symbol resolution (walking up the lookup chain).To resolve a variable value there are 3 places Javascript looks:Local > Intermediate Scopes > GlobalThe higher up it must go to get the value the more performance cost.Objects work in the same way:Instance > Prototype Chain > DOMIf you don’t declare the variable using var = its scope is global and costs you performance. If you use var = you scope it to be a local variable.

   Works the same way with functions too.

2. Use native methods.To parse JSON you can use the native parse or stringify that’s native to the browser (possibly only IE8 though…?).
3. Remove duplicate script files.
4. Minimize the amount of Javascript frameworks you use on a page.

MARSHALLING

1. Minimize the amount of DOM interactions that you make from Javascript.Each time the Javascript engine has to communicate with the DOM it costs you a little bit more.
   Cache your DOM lookups in a variable, e.g. var elms = document.body.all;

DOM

1. Built in methods are always more effecient than trying to roll something yourself.Instead of nodes[i] to iterate through just use the DOM API node.nextSibling; to iterate through that collection; minimizes calls to the DOM.
2. Use the selectors API for effecient access to collections (IE8+ only).

FORMATTING

1. Only send the required styles for that page.(Doesn’t this go against the whole cacheing of your stylesheet as an advantage while surfing through your site?)
2. When possible, use class or id based selectors over element selectors.Make element selectors as simple as possible and use child or descendent selectors when able.

BLOCK BUILDING, LAYOUT, RENDERING

1. Batch visual changes.Don’t allow your user to see every change you make to the page until you’re done. Put all changes in a variable and then change the page.

At the end of Mr. Weber’s presentation he hit briefly on the new features of IE9. Below are my notes on this topic:

• Hardware accelerated HTML 5
• Compiled Javascript (into native machine code to be executed rather than interpreting non-native machine code)
• GPU powered HTML5 graphics

This was my first An Event Apart and I was particularly struck by a few things.

First, mostly all of the seminars offered directly related to my work and career. There was no picking of what classes you wanted to take, but rather, you sat in one room all day and the presenters came to you.

Second, it was a well planned event. There were 15 minute breaks between seminars, ample time to hit the restroom or schedule your dentist appointment back home (yep, I did that), and each day was just long enough. Monday’s classes ran from 9 am to 6:15 pm and Tuesday’s classes ran from 8:15 am to 5:30 pm (although many would tell you that Tuesday’s 8:15 am was optional since it was a Microsoft presentation, ). Lunches were 1.5 hours long and were great opportunities to have a leisurely lunch and get to know other conference attendees.

Thirdly, the food was fantastic! Fully catered breakfasts and lunches made me feel important and eliminated the stress of “Where is my next meal?!”.

And finally, all of the presenters were just really cool. Most of them walked around the ballroom and hallways during breaks, talking to various attendees, and shaking people’s hands. They were all really nice people and easily approachable. It was nice to know that I was amongst such down to earth people.

There were quite a few presentations that stuck out in my mind. The following is my attempt to document the knowledge I picked up at this conference.

Jeffrey Zeldman’s A Site Redesign

Once the initial shock of actually seeing Jeffrey Zeldman in front of me wore off I was eventually enthralled by his presentation. Zeldman spoke of two situations in which a site redesign may occur: the client, or, in-house approach and the homegrown when-the-client-is-you approach.

Client-based Redesign

A client-based redesign starts with the following question: “What problem are we trying to solve?”. At this point Zeldman spoke of how in-house designers are treated in various companies. He stressed that, as a designer, sometimes we are not quite treated as “grownups at the table” and that all we’re good for is “decoration” and sprinkling on some pixie dust. He emphasized that design is about creating a user experience and that in order to receive some credibility in your company you should become involved in a project as early as possible to understand the business objectives behind it. Research is one way in which you can establish yourself as a credible partner within the scope of the project.

One point that Zeldman made that I felt was particularly amusing was when he said that “designers and their bosses should not be having conversations about fonts, color, or design,” but rather, they should be “having conversations about products.” Why did I find this so amusing? Because I feel that conversing about fonts, color, and design is the bulk of what my conversations are about. Whether its at my full-time job or in my freelance, someone always has to question my color or font choice. It can drive a designer batty, especially when the client (whether in-house or freelance) thinks they know more about font X or color Y than you. But I digress… Ultimately designers need to be seen as strategic partners and not pigeon-holed as “the person that makes things pretty.”

Components of a Site Redesign

Initial components of a site redesign include: no-holds-barred brainstorming, scenarios, wireframing, and content strategy.

Brainstorming with a client or in-house can help put you in a better position later down the road. It is a proven psychological phenomenon that if you talk to someone about their needs and deliver a product that is perceived as meeting those needs then the client will be more likely to buy in to your work. As the designer, you should be engaging people from the very first meeting so that they perceive you as an ally.

Scenarios were a concept that up until An Event Apart must have been residing deep in my brain. I had never heard of them before but, once explained, I remember vaguely learning about them in a past life. It goes like this: pick a few types of users that you think will visit your site. Set up a document that outlines the specific goals that each one of these types of users may try to achieve while on your web site. Then, document the process that it would take for them to achieve these goals on your site. These users should be developed into full personas with names and life details.

To do the right design, Zeldman emphasized the importance of having a content strategy. Apparently this label “content strategy” has been a big idea this year but I feel like I’ve been trying to push it all my life. Basically, everything about a design should be based on the content that is going to be presented. Designers cannot, and should not, have to pull designs out of thin air without having content provided. Period.

Speaking with Clients

Zeldman offered many helpful tips when talking with people about design and your work.

First of all, Zeldman demonstrated his idea of breadcrumbing a conversation. When speaking with a client about your work or upcoming plans, be sure to keep repeating where you’ve been in the conversation. That way you’ll both be on the same page and will be able to recap what occurred during your conversation when it eventually comes to an end. Oftentimes, visual people think things are blindingly obvious and it is our job to make sure that others see the blindingly obvious.

Secondly, sometimes clients try to get at what they want indirectly. You must learn to read between the lines of a conversation and interpret what their actual problem is.

Finally, you as the designer definitely do not want to start any conversations about pixels, fonts, colors, and layout. If you start to talk about them then the client will want to change them. Instead, try to gear your conversations towards tactical problem solving measures. Your job is to sell ideas, not pixels. If a client questions a particular item try to relate it back to the demographic that is actually going to be using the site. Every question posed by the client should be answered with some sort of user-, research-, or problem-centric point.

Homegrown Redesign

The first thing to do when starting to work on your own web site is to do a “competitive audit,” or as we designers like to say, looking for “inspiration.” What is going on in the web world today and what are other sites in your field doing?

From this point on Zeldman began to use his own site, zeldman.com, as his example of a homegrown site.

The question you must ask yourself when starting to design is, “What problem are we trying to solve,” or, “What are we trying to achieve with this web site?”. People have many reasons for starting their own web site: portfolio sites, discussion/blogging sites, etc.

Whatever site you choose to design though, should always invite reading. And whenever reading is involved, wide pages are not the way to go.

As with the client-based redesign strategy, all design should start with the content. In the case of Zeldman, he did a pure text dump into a .html page and started to immediately style his content; he calls it “design from the content out.”

One interesting tidbit I picked up from this presentation was the use of a grid background gif. Grid-based design can be made even easier by simply applying a grid background to your entire site. This way you can see exactly where your columns are lining up and won’t have to rely as much on the accuracy of your math. Zeldman was quick to mention though that you do not need to be a slave to your grid and that introducing a little asymmetric white space never hurt anyone.

Your own site is also a perfect environment for introducing some progressive enhancement. Sure, throw all of the CSS3 you can at your site – just make sure its still functional in those oldy moldy browsers as well. Details may not matter as much to you in all browsers as they would to a client so be adventurous.

And finally, Zeldman pushed the idea that contrary to major belief, there is no fold. Studies have shown that most people do scroll on a web site so the concept of putting things above the fold is not nearly as important as it has been in the past. In particular, Zeldman was demonstrating his site’s large footer that has become particularly popular as of late.

In Conclusion

I found Jeffrey Zeldman to be a dynamic speaker with a great sense of humor. He has wonderful insights into the various problems that all designers face on a daily basis and can offer useful tips on how to handle said problems. I would recommend that anyone go and hear him speak.

I wanted to write more than this but I simply wrote so much about Zeldman and I haven’t had time to write about the other speakers. Ack! When I have time I will follow this post up with more!