I’m attending the Environments for Humans online Responsive Web Design Summit 2013 – Day 1 of 3.
Great, informative talks! Today is mostly for developers, but I’m getting a lot out of it. A recurring point is that you should design/develop completely differently for different devices, including: images optimized for different screen sizes/resolutions, testing on multiple devices, clean code, and involving clients in the effort to keep image sizes and thus page load times down. I’m summarizing the talks rather than going into detail to avoid infringing on the presenters’ copyrights.
Measuring Web Performance, by Dave Olsen, Creator of Mobile in Higher Ed
- Tools for measuring web performance
- Setting up a device lab
- Responsive design and serverside solutions
- Included pictures of cats
CSS & Mobile Performance, by Estelle Weyl, Author of HTML5 and CSS3 in the Real World
- Images vs. fonts vs. iconfonts
- Media queries
- Included pictures of cats
Maximizing Performance, with SPDY & SSL, by Billy Hoffman, Founder and CEO of Zoompf. Not my area of expertise, but useful.
- Setting the Stage for SPDY
- Optimizing SPDY
- Tools to help
- Did not include pictures of cats
Image Optimization Methodology, by Tobias Baldauf, Freelance Web Performance Consultant
- Image numbers per page have remained almost static, but image sizes have risen dramatically over the past year, probably due to an increase in high-resolution displays.
- Which formats are best for which kinds of images? PNG-8, PNG-24, WebP, SVG, JPG, GIF, iconfonts
- Optimizing different formats
- Included pictures of cats
Optimizing Media Queries, by Kimberly Blessing, Director at Think Brownstone
- Does the way we write media queries impact page performance? Which technique yields the best performance?
- Conclusion: Media query syntax and code structure have an impact on performance, but writing optimized CSS overall is best. Focus on mobile users as their page load times are significantly slower.
- Did not include pictures of cats