adapting to responsive web design
Post on 18-Sep-2014
7 views
DESCRIPTION
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.TRANSCRIPT
Adapting toResponsive Web DesignDavid CornforthIWMW 2013@dc86 #iwmw13
Computers don’t bite
Via Web Archivehttp://bit.ly/darlington-referees
Same old new medium
Whitespace
The fold
Canvas
Fixed-width
Page
Nature of the web
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-LeeLong Live the Web: A Call for Continued Open Standards and Neutrality
Scientific American, Nov 2010 http://bit.ly/tbl-scientific-american
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 AllsoppA Dao of Web DesignA List Apart, Jan 2000 http://alistapart.com/article/dao
Responsive web design
Survey
You’ve started to embrace responsive web design
You’re not quite sure about responsive web design
Content
Processes
Organisations
Content, now mobile
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 HalvorsonAuthor, Content Strategy for the WebTaken from the foreword to The Elements of Content Strategy, 2011
Source: Google 2012 - http://services.google.com/fh/files/misc/multiscreenworld_final.pdf
We can’t treat mobile users differently
Get your content ready to go anywhere because it’s going to go everywhere.
Brad FrostFor a Future-Friendly WebOct 2011, http://bradfrostweb.com/blog/web/for-a-future-friendly-web/
Web page
Thinking about fundamentals of our content and at a micro-level
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-BoettcherFuture-Ready ContentFeb 2012, http://alistapart.com/article/future-ready-content
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-BoettcherFuture-Ready ContentFeb 2012, http://alistapart.com/article/future-ready-content
Future-friendly content
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 McGraneAuthor of Content Strategy for Mobile
Nov 2012, http://alistapart.com/article/future-ready-content
Process and organisations
Process and organisation
Design process
A journey
Constant change
Responsive web design doesn’t bite
Thank you
David Cornforthd.cornforth@northumbria.ac.ukwww.jiscinfonet.ac.ukTwitter @dc86
Image referencesShark - 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-72157629456051442RWD 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/