Lara Swanson

I'm the Engineering Manager of Mobile Web at Etsy. Follow me on Twitter.

I co-founded So You're EnGAYged, a wedding resource for same-sex and allied couples. I think everyone should write stellar HTML and CSS and have fast page load time.

I curate (and contribute to) CSS3 Geometry.

Recent Work

ShopTalkShow Interview

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.

CSS3 Geometry

I wanted to learn more about CSS3 shapes and I've always loved the Geometry Daily tumblr, so I decided to start recreating the images using only CSS3. It's been an awesome way to learn, and I hope my process notes and JSFiddle code on each can help others as well.

Level Up Your Presentation

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.

Page Speed

Improving UX Through Front-End Performance (A List Apart)

In this front-end performance 101, I walk through designing and coding for performance, focusing on optimizing requests and how to measure the results.

Case studies at WebPerfDays

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.

Front End Performance at Capital Camp

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

How to improve your page load time

I wrote this step-by-step walkthrough to help front end developers clean their HTML, CSS and images to improve their sites' page load time. I also discussed how important it is to plan for a clean site when designing or redesigning to save you time.

Write Good Code

This experiment's goal was to demonstrate the business value of coding well. I benchmarked incrementally worse versions of a basic HTML page using WebPageTest to demonstrate which bad coding habits had the largest impact on page load time.

A/B Testing

A/B Testing at edUi

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

A Primer on A/B Testing (A List Apart)

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.

UX

UX Practical Techniques (Smashing Magazine)

This Smashing Mag eBook features six articles (including my article on tracking errors) that will help improve your website's user experience. Learn about designing drop-down menus, log-in and sign-up forms, navigation menus, tracking errors as well as common usability mistakes in Web design.

Navigation in Responsive Design (Dyn.com)

One of the most important parts of a responsive design is navigation but it can be tricky to figure out what navigation should be removed, where it should live and how it should look among the rest of the content. I want to dig in to Dyn's process for deciding how the navigation would change at different screen sizes.

Complex table responsive design (Dyn.com)

I used nth-of-type:before and colspan*=x in media queries to creatively display table headers and context on smaller screen sizes in this responsive web design technique.

Improve UX By Tracking Errors (Smashing Magazine)

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.