event notes, events, technology & web

Notes from An Event Apart Austin: Yesenia Perez-Cruz

Next in line at An Event Apart Austin (October 5) came Yesenia Perez-Cruz, a Philadelphia-based designer, with: Design Decisions Through the Lens of Performance.

Notes I took/tweeted and some of my favorite live-tweets by others during her presentation follow.

On starting a new project:

She says don’t forget to focus on performance. Twitter Bird Icon 16x16

Slide from Yesenia Perez-Cruz's Design Decisions Through the Lens of Performance at An Event Apart Austin

One example of why it’s important: Amazon observed a 1% decrease in revenue for every 100ms added to page load.

Always set a performance budget right from the start:

“A performance budget (for web design) is like your spending budget.” Spend more in one column, reduce in another. Twitter Bird Icon 16x16

“Quality is stability, performance, and reliability.” She reminds us that performance is a design feature, not a technical concern. Pages should weigh no more than 400-600kb, and make no more than 15 requests. Consider limiting fonts to 100kb. Twitter Bird Icon 16x16

Evaluate typography on performance + personality. Find a balance that works for both. Twitter Bird Icon 16x16

“Don’t add a style you don’t need.” Twitter Bird Icon 16x16

On comparison & keeping things in check: 

She says check your sites on webpagetest.org. Also check your competitors so you make sure your site is competitive with theirs. (Make it faster!)

On working with clients: 

Her advice when a client wants to add something large/not in the performance budget: “Remind. Educate. Find a balance.” Twitter Bird Icon 16x16

On style guides & testing:

Communicate & document decisions throughout a project. Recommends creating a style guide & being purposeful. Twitter Bird Icon 16x16

She mentions Trulia created a style guide, and now their site loads 21% faster now and they reduced unused CSS by 135kb. (Read more.)

Recommendation: “Get designs into a browser ASAP & test on real devices.” Twitter Bird Icon 16x16

Remember: 

“The important point is to look at every design decision, right through the design/build process, as something that has consequence…” -Mark Perkins


Yesenia shared lots of examples, comparisons, and details, so if you get a chance to see her speak or if she shares her slides online, check them out to get the full effect. (Looks like she’ll be speaking in SF in November.)

Note: The Twitter bird icons link to the corresponding tweet for each piece. Thanks to @mor10 & @RainbowliciousD for live-tweeting the talk along with me on #aeaaus. 🙂 

Notes on @zeldman‘s talk previously published here. More notes on other sessions coming soon. I’ll link them all in a list on this page.