Plenary talk on "Adapting to Responsive Web Design" given by David Cornforth at the IWMW 2013 event held at the University of Bath on 26-28 June 2013.

1. Adapting to
Responsive Web Design
David Cornforth
IWMW 2013
@dc86 #iwmw13

4. Computers don’t bite

11. Via Web Archive
http://bit.ly/darlington-referees

15. Same old
new medium

16. Whitespace
The fold
Canvas
Fixed-width
Page

18. Nature of the web

20. The principle of universality allows the
Web to work no matter what hardware,
software, network connection or language
you use and to handle information of all
types and qualities. This principle guides
Web technology design.
Tim Berners-Lee
Long Live the Web: A Call for Continued Open Standards and Neutrality
Scientific American, Nov 2010 http://bit.ly/tbl-scientific-american

22. It is the nature of the web to be
flexible, and it should be our role as
designers and developers to
embrace this flexibility.
John Allsopp
A Dao of Web Design
A List Apart, Jan 2000 http://alistapart.com/article/dao

23. Responsive
web design

29. Survey

30. You’ve started to embrace
responsive web design

31. You’re not quite sure about
responsive web design

34. Content
Processes
Organisations

35. Content, now
mobile

36. Content is a hairy, complicated beast.
There’s stuff to research, sift through,
create, curate, correct, schedule - and
that’s before we even think about
publishing. … No wonder we want to
hide under the bed.
Kristina Halvorson
Author, Content Strategy for the Web
Taken from the foreword to The Elements of Content Strategy, 2011

42. Source: Google 2012 - http://services.google.com/fh/files/misc/multiscreenworld_final.pdf

43. We can’t treat
mobile users
differently

45. Get your content ready to
go anywhere because it’s
going to go everywhere.
Brad Frost
For a Future-Friendly Web
Oct 2011, http://bradfrostweb.com/blog/web/for-a-future-friendly-web/

46. Web page

52. Thinking about fundamentals of
our content and at a micro-level

53. Before we start throwing around fancy
acronyms, we need to get closer to the content
itself, creating a framework for making smart
decisions about its structure. Only then can we
tackle technology in meaningful, useful ways. So
hang on—this part’s important.
Sara Wachter-Boettcher
Future-Ready Content
Feb 2012, http://alistapart.com/article/future-ready-content

61. Technology will change. Standards will evolve.
But the need for understanding our content—its
purpose, meaning, structure, relationships, and
value—will remain. When we can embrace this
thinking, we will unshackle our content—
confident it will live on, heart intact, as it travels
into the great future unknown.
Sara Wachter-Boettcher
Future-Ready Content
Feb 2012, http://alistapart.com/article/future-ready-content

62. Future-friendly
content

63. Still think it’s daunting? It is. It’s also a huge
opportunity— maybe the best we’ll see in our
careers—to change the way we create, manage,
and maintain our content. And it’s a big chance
to create a better user experience by improving
the quality of our content. Let’s not waste it.
Karen McGrane
Author of Content Strategy for Mobile
Nov 2012, http://alistapart.com/article/future-ready-content

64. Process and
organisations

65. Process and organisation

69. Design process

79. A journey

81. Constant change

82. Responsive web
design doesn’t bite

83. Thank you
David Cornforth
d.cornforth@northumbria.ac.uk
www.jiscinfonet.ac.uk
Twitter @dc86

84. Image references
Shark - http://www.flickr.com/photos/pftqg/4852669155/
Classroom - http://www.flickr.com/photos/extraketchup/748446571/
Certificate - http://www.flickr.com/photos/kjarrett/8663092646/sizes/k/in/photostream/
Books - http://www.flickr.com/photos/alanvanroemburg/4302680837/
Bath - http://www.flickr.com/photos/rnddave/7079399801/in/set-72157629456051442
RWD book - http://www.flickr.com/photos/adactio/5818096043/
Devices - http://www.flickr.com/photos/brad_frost/7387824246/
Survey - http://www.flickr.com/photos/_theo_/4760961966/
Scary - http://www.flickr.com/photos/53941041@N00/5511371073/
Hoarding - http://www.flickr.com/photos/puuikibeach/7171920487/
Assembly line - http://www.flickr.com/photos/hugo90/8233835560/
Smile - http://www.flickr.com/photos/amorphesding/3392255694/
Assembly line 2 - http://www.flickr.com/photos/24736216@N07/2994043188/
PSD - http://www.flickr.com/photos/juanpol/3205556001/