responsive web design - internet hungary 2013

19
esponsive ? Who, me ?

Upload: akos-szabo

Post on 08-May-2015

154 views

Category:

Technology


2 download

DESCRIPTION

Brief summary of responsive web design basics, pros and cons

TRANSCRIPT

Page 1: Responsive Web Design - Internet Hungary 2013

Responsive ?

Who, me ?

Page 2: Responsive Web Design - Internet Hungary 2013

Steven Seagal

Friend or Foe?

Page 3: Responsive Web Design - Internet Hungary 2013
Page 4: Responsive Web Design - Internet Hungary 2013

Looking good?

More control, more limitations

Page 5: Responsive Web Design - Internet Hungary 2013

Year of the responsive ?

”The control which designers know in the print medium, and often desire in the web medium, is simply a function of the limitation of the printed page. We should embrace the fact that the web doesn’t have the same constraints, and design for this flexibility.”

Page 6: Responsive Web Design - Internet Hungary 2013

“The Way is shaped by use,But then the shape is lost.Do not hold fast to shapesBut let sensation flow into the world…”Tao Te Ching

”Macintosh is 72dpi, while the Windows default is 96dpi.”

”DTP for the web””WYSWYG

rituals”

”control the user’s browser”

Page 7: Responsive Web Design - Internet Hungary 2013

”Make pages which are adaptable.”

” Abandon control and seek a new relationship with the page.”

Page 8: Responsive Web Design - Internet Hungary 2013

http://roxik.com/cat/

Page 9: Responsive Web Design - Internet Hungary 2013

The end of pixel perfect• flexible layouts & fluid grids• flexible images & media• media queries (+ Java script) %

Page 10: Responsive Web Design - Internet Hungary 2013
Page 11: Responsive Web Design - Internet Hungary 2013

MOBILE FIRST

Page 12: Responsive Web Design - Internet Hungary 2013

Year of the responsive

Page 13: Responsive Web Design - Internet Hungary 2013

What have the Romans… ?

Page 14: Responsive Web Design - Internet Hungary 2013

What have the Romans… ?

Page 15: Responsive Web Design - Internet Hungary 2013

Friend or … ?• optimized and consistent user experience

(device agnostic)

• unified web team, single code base

• reduced maintenance risks

Page 16: Responsive Web Design - Internet Hungary 2013

Friend or … ?

Page 17: Responsive Web Design - Internet Hungary 2013

… or Foe ?• What if customers don’t want the same experience on all devices?• What if it’s too slow or too simple?• What if more money comes from platform- specific ads?• What if ads are a pain in the @$$?

Page 18: Responsive Web Design - Internet Hungary 2013

Checklist• Do you need it?• Do you have the resources?• Are you okay with the design limitations?• Can you handle the monetization issues?

Page 19: Responsive Web Design - Internet Hungary 2013