adapting to responsive web design

Post on 18-Sep-2014

3 Views

Category:

Education

0 Downloads

Preview:

Click to see full reader

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/

top related