1. The world’s libraries. Connected. Put Content First Responsive Web Design Is Not Enough #acplcampRWD Bob Robertson-Boyd Product Analyst, End User Services OCLC @bobrobboy

2. The world’s libraries. Connected. What is responsive Web design? Why do you care? Why is responsive Web design not enough? How do you put content first? What does it look like in the end? What will you learn?

3. The world’s libraries. Connected. A way to design a Web page so that it fits in any screen. What is responsive Web design?

4. The world’s libraries. Connected. What is responsive Web design? 2 2 3 3 4 4 5 5 6 6 1 1 1 1 2 2 4 4 5 5 6 6 1 1 2 2 4 4 5 5 6 6 The page flows to the browser window size

5. The world’s libraries. Connected. You want your content to be available to everyone all the time. Why do you care?

6. The world’s libraries. Connected. Why do you care? http://www.flickr.com/photos/hcplebranch/6795686692/ These devices are everywhere

7. The world’s libraries. Connected. Why do you care? http://www.flickr.com/photos/hcplebranch/6795686692/ And your patrons are …

8. The world’s libraries. Connected. Content should always come before design or technology. Why is responsive Web design not enough?

9. The world’s libraries. Connected. Why is responsive Web design not enough? Not to say that these excellent people are wrong They are approaching it more from the technology side not from the content side

10. The world’s libraries. Connected. Why is responsive Web design not enough? We value content over technology http://www.flickr.com/photos/paultraf/2664020734/

11. The world’s libraries. Connected. Define the information every patron needs and be certain every patron can get it. How do you put content first?

12. The world’s libraries. Connected. How do you put content first? Start with your Web page 1 1 2 2 3 3 4 4 5 5 6 6 7 7 8 8 9 9 10

13. The world’s libraries. Connected. How do you put content first? Involve lots of people UI Developer UI Developer UI Developer UX Researcher UX Designer Librarian (Product Analyst) Librarian (Product Analyst)

14. The world’s libraries. Connected. How do you put content first? Keep it simple, make it fun

15. The world’s libraries. Connected. How do you put content first? Label the content pieces Use Microdata Standards Open Graph Schema.org SKOS Use Microdata Standards Open Graph Schema.org SKOS Geek Alert!

16. The world’s libraries. Connected. When you’re done you get an accessible page that can be viewed on anything and anywhere! What does it look like in the end?

17. The world’s libraries. Connected. What does it look like in the end? Build the page using responsive design methods

18. The world’s libraries. Connected. What does it look like in the end? Facebook & GoodReads and Twitter & Jellybooks use Open Graph Karen Coyle’s mock up on http://kcoyle.blogspot.com http://kcoyle.blogspot.com

19. The world’s libraries. Connected. What does it look like in the end? Facebook and Twitter use Open Graph so if you do to …

20. The world’s libraries. Connected. Questions? Bob Robertson-Boyd robertsb@oclc.org