responsive web design: a future friendly web strategy
DESCRIPTION
Presentation for Online Northwest 2014. Christine Tawatao Systems Librarian: Web Development/Support University of Washington Libraries In just a few short years, the range of web-enabled devices on our campuses has exploded. The University of Washington Libraries has adopted responsive web design (RWD) as a way to provide our content on whatever device comes our way. Learn why this is a good strategy for us, what tradeoffs are involved, why concise content is more important than ever, and strategies for conducting user research/testing to inform every step in the design process.TRANSCRIPT
![Page 1: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/1.jpg)
Responsive Web DesignA Future-Friendly Web Strategy
Christine TawataoSystems Librarian: Web Development/Support
![Page 2: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/2.jpg)
Mobile Web: State of the Union
@lukew
![Page 3: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/3.jpg)
University of WashingtonMobile/Tablet - Fall 2013
@cronncc
UW – 17.2%
Libraries – 5.2%
iOS – 73%
Android – 21%
![Page 4: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/4.jpg)
Responsive Web Design
@pinksherbet
![Page 5: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/5.jpg)
@visualpunch
![Page 7: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/7.jpg)
UW Libraries Personas
PAULTHE PROFESSIONAL31 year old online student
I feel like there is information in all these drawers, and I don’t know which drawer to open.
![Page 8: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/8.jpg)
Rapid Iterative Testing & Evaluation
![Page 9: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/9.jpg)
Mobile First
![Page 10: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/10.jpg)
Mobile Usability Testing
@cinteractionlab
![Page 11: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/11.jpg)
Implementation
@ogimogi
Plone CMS + Bootstrap 2.3.2 + LESS CSS
![Page 12: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/12.jpg)
![Page 13: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/13.jpg)
Testing, Testing… 6, 7, 8…
@ieteam
![Page 14: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/14.jpg)
@alancleaver
![Page 15: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/15.jpg)
Learning to be Flexible
@a4gpa
![Page 16: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/16.jpg)
What Will the Future Bring?
@samsungtomorrow
![Page 17: Responsive Web Design: A Future Friendly Web Strategy](https://reader036.vdocuments.site/reader036/viewer/2022062511/54b783354a7959db528b4653/html5/thumbnails/17.jpg)
Questions? Thanks!Christine [email protected] | @tawataoc
Images: Flickr Creative Commons and University of Washington