How SpringerLink Went Responsive

One of the Lighting Talks given during Springer IT's Event - Madrid, Spain - May 2013

**Links in the slide deck**
Continue Reading: http://bit.ly/10G8usQ
Connect with me: http://linkd.in/12LMVKs

Transcript

1. How SpringerLink Went Responsive Concepts & How we did it
2. Whose face is that? Todd Carter Front End Developer @ Springer London Kiwi living in London Working on SpringerLink
3. Concepts: Mobile First Mobile First is about growing with the market Mobile First is about creating a more focused product Mobile First is about using device innovations to create unique user experiences
4. Rather than tailoring disconnected designs to each of an ever-increasing number of web devices, we can treat them as facets of the same experience… In short, we need to practice responsive web design. Ethan Marcotte
5. Concepts: Responsive Web Design + Flexible Grid Flexible Media Media Queries +
6. This is Responsive
7. Sounds great! But how did you actually do it?
8. How We Did It: What Worked Well Research & (Re)design
9. How We Did It: What Worked Well Design Principles
10. How We Did It: What Worked Well Sketch Wireframes
11. How We Did It: What Worked Well Breakpoints
12. How We Did It: What Worked Well Device Support
13. Retro fitted CSS/JS Unnecessary overwrites in CSS Code can be confusing to read Code bloat! How We Did It: What Worked Not So Well
14. But worst of all…
15. Mobile users still have to download everything!
16. Doubled our e orts on the UX // Front End Mobile First is great as a guiding principle Get something on a device asap! (For science context) Use real content, not lipsum RWD isn’t necessary for every project How We Did It: Some considerations
17. We’ve made a good start…
18. But there’s still lots to be done!
19. Better performance (CSS, JS, Actual Speed) Support for Hi-DPI media Ongoing refactoring/tweaking Device ranges and Content breakpoints Looking Towards The Future
20. Springer, Everywhere
21. Springer, Everywhere
22. Thanks! Continue reading: bit.ly/10G8usQ Slides available here: bit.ly/16LurPR Questions // Comments: todd.carter@springer.com Connect with me: linkd.in/12LMVKs Creative Commons Licensed Attribution, Non-Commercial, Share Alike