I'm also currently writing a book called Designing for Performance. This practical book helps you approach a new project with page speed in mind, and shows you know how to test and benchmark which design choices are most important. I cover:
- The basics of page speed: requests and how browsers render content
- Optimizing images, HTML and CSS for performance
- Implementing responsive web design with an eye on performance
- Tools for measuring and iterating on performance
If you have Adobe Photoshop experience and basic HTML and CSS skills, this book will help you learn how to design for performance. The first three chapters are available for early release here, as well as pre-order of the print book.
This talk focused on performance from a designer's and front end developer's perspective, including the basics of page speed, optimizing HTML, CSS and images, and implementing responsive design with an eye on performance. Iterations of this talk have been given at the NY Web Performance Meetup, Fluent Conference and the Fluent Online Conference.
Front End Performance series (O'Reilly Programming Blog)
In this front-end performance 101, I walk through designing and coding for performance, focusing on optimizing requests and how to measure the results.
I shared my case study on how cleaning HTML, CSS and images improved page load time on Dyn.com. I discussed code reviews, how we benchmark and front-end techniques to improve page speed.
Learn how to improve your site's page load time (and UX!) by designing for performance, optimizing your markup and images, and convincing your clients or organization that improving page load time is important. Slides and more
I spoke about the growing importance of building for mobile web as users may be on any device, platform or connection. I shared Etsy's approach, lessons learned and tips for growing a mobile web focus at your organization. Slides and more
I share how we built Etsy's mobile device testing lab, complete with communication techniques, challenges like power supply, what we learned about how to make it intuitive for developers and designers to use, and pictures!
I had a blast talking with Chris Coyier and Dave Rupert on their podcast about front end web design, development and UX. We chatted about performance, conferences and good skill sets front end devs should have to get hired.
colspan*=x in media queries to creatively display table headers and context on smaller screen sizes in this responsive web design technique.
A/B testing is vital for website designers and developers to help them learn more about their user base. In this presentation, I discussed how to analyze user interactions with your website and how to design and give sample tests. I also shared valuable tips, including how to determine the differences in behavior between audience segments. View slides and resources or watch the presentation
Data is an invaluable tool for web designers who are making decisions about the user experience. A/B tests, or split tests, are one of the easiest ways to measure the effect of different design, content, or functionality. A/B tests allow you to create high-performing user experience elements that you can implement across your site. This article details techniques and examples to help get you started.
No matter what happens on your presentation day, you can be prepared, stress-free and engaging. Your talk may resonate with others not in attendance on gameday, enabling a broader resource with a long tail. Quantitatively measure which parts of your presentation resonated the most with your audience.
Tracking and optimizing error messages will help you measurably improve your website's UX. I detail implementation, data gathering and analysis to help you figure out how to improve your error message drop rates. This article was also included in the book UX Practical Techniques.