Why do we keep trying to make the web back into print? This talk mines the philosophical shift from Modernism to Post-Modernism, with stops along the way at the Chicago World's Fair of 1893, for clues to understanding the digital sands shifting under our own feet

1. John Eckman | @jeckman | #wcnyc2014
“These fragments I have shored against my ruins”:
Modernism,
Post-Modernism,
and Responsive Web Design

2. John Eckman | @jeckman | #wcnyc2014
About Me

3. John Eckman | @jeckman | #wcnyc2014
About Me
• 1998: PhD in American
Literature

4. John Eckman | @jeckman | #wcnyc2014
About Me
• 1998: PhD in American
Literature
• Diss: “Confronting
Modernity: Urbanization
and American Literature
1880-1930”

5. John Eckman | @jeckman | #wcnyc2014
About Me
• 1998: PhD in American
Literature
• Diss: “Confronting
Modernity: Urbanization
and American Literature
1880-1930”
• 1999-Present: Web
developer, CMS
consultant, UX director,
Project Manager, Agency
Director

6. John Eckman | @jeckman | #wcnyc2014
About Me
• 1998: PhD in American
Literature
• Diss: “Confronting
Modernity: Urbanization
and American Literature
1880-1930”
• 1999-Present: Web
developer, CMS
consultant, UX director,
Project Manager, Agency
Director
• Current: CEO at 10up

7. John Eckman | @jeckman | #wcnyc2014
About Me
• 1998: PhD in American
Literature
• Diss: “Confronting
Modernity: Urbanization
and American Literature
1880-1930”
• 1999-Present: Web
developer, CMS
consultant, UX director,
Project Manager, Agency
Director
• Current: CEO at 10up
• (Yes, we are hiring)

8. John Eckman | @jeckman | #wcnyc2014
“Now is the time for the medium of the web to outgrow its
origins in the printed page. . . . It is the nature of the web to
be flexible, and it should be our role as designers and
developers to embrace this flexibility . . . The journey begins
by letting go of control, and becoming flexible.”

9. John Eckman | @jeckman | #wcnyc2014

10. John Eckman | @jeckman | #wcnyc2014

11. John Eckman | @jeckman | #wcnyc2014
What happened in
between these two
publications?

12. John Eckman | @jeckman | #wcnyc2014
“Creating Killer Web Sites was
the first true design book for
the Web. It became the best-
selling book on the Internet in
1996 and has been translated
into ten languages. It has
taught an entire generation of
site designers how to get
control over their pages”

13. John Eckman | @jeckman | #wcnyc2014

14. John Eckman | @jeckman | #wcnyc2014

15. John Eckman | @jeckman | #wcnyc2014
Why do we so resist the
digital nature of the web?

16. John Eckman | @jeckman | #wcnyc2014
Walter Benjamin
!
!
!
!
!
!
“The Work of Art in the Age of
Mechanical Reproduction
(Reproducibility)” 1936
“that which withers in
the age of mechanical
reproduction is the aura
of the work of art . . . the
technique of reproduction
detaches the reproduced
object from the domain of
tradition”

17. John Eckman | @jeckman | #wcnyc2014
What is the work of
design, in the age of
digital reproduction?

18. John Eckman | @jeckman | #wcnyc2014
Prologue

19. John Eckman | @jeckman | #wcnyc2014
The White City
Chicago World’s Fair 1893

20. John Eckman | @jeckman | #wcnyc2014
The White City
Chicago World’s Fair 1893

21. John Eckman | @jeckman | #wcnyc2014
The White City
Chicago World’s Fair 1893

22. John Eckman | @jeckman | #wcnyc2014
The White City
Chicago World’s Fair 1893

23. John Eckman | @jeckman | #wcnyc2014
- Daniel Burnham, Master of Works for the Chicago World’s Fair
“Make no Little Plans . . . Make big plans . . .
remembering that a noble, logical diagram once
recorded will never die . . . Let your watchword be order
and your beacon beauty”

24. John Eckman | @jeckman | #wcnyc2014
Modernism

25. John Eckman | @jeckman | #wcnyc2014
Modernism
“All fixed, fast-frozen relations, with
their train of ancient and venerable
prejudices and opinions, are swept
away, all new-formed ones become
antiquated before they can ossify.
All that is solid melts into air, all
that is holy is profaned, and man is
at last compelled to face with sober
senses his real conditions of life, and
his relations with his kind”
Marx & Engels, Communist
Manifesto (1848)

26. John Eckman | @jeckman | #wcnyc2014
Modernism
Turning and turning in the widening gyre
The falcon cannot hear the falconer;
Things fall apart; the centre cannot hold;
Mere anarchy is loosed upon the world, . . .
The best lack all conviction, while the worst
Are full of passionate intensity.
. . .
And what rough beast, its hour come round at last,
Slouches towards Bethlehem to be born?
- Yeats, “The Second Coming” 1919

27. John Eckman | @jeckman | #wcnyc2014
- T. S. Eliot, The Waste Land 1922
I sat upon the shore
Fishing, with the arid plain behind me
Shall I at least set my lands in order?
London Bridge is falling down falling down falling down
Poi s'ascose nel foco che gli affina
Quando fiam ceu chelidon - O swallow swallow
Le Prince d'Aquitaine a la tour abolie
These fragments I have shored against my ruins
Why then Ile fit you. Hieronymo's mad againe.
Datta. Dayadhvam. Damyata.
Shantih shantih shantih

28. John Eckman | @jeckman | #wcnyc2014
Modernism
“To be modern is to find ourselves
in an environment that promises
us adventure, power, joy, growth,
transformation of ourselves and
the world - and at the same time
that threatens to destroy
everything we have, everything
we know, everything we are.”
Marshall Berman, All That Is
Solid Melts Into Air (1982)

29. John Eckman | @jeckman | #wcnyc2014
Post-Modernism

30. John Eckman | @jeckman | #wcnyc2014

31. John Eckman | @jeckman | #wcnyc2014

32. John Eckman | @jeckman | #wcnyc2014

33. John Eckman | @jeckman | #wcnyc2014
Tryin’ to keep it real (compared to what)
1969: Gene McDaniels
composition, recorded by Les
McCann & Eddie Harris, protests
Nixon and the war in Vietnam.
!
!
2003: “Real Compared to What”
stars Mya and Common selling
Coca Cola, “The Real Thing”

34. John Eckman | @jeckman | #wcnyc2014
Mo vs Po-mo
• Things Fall Apart / All that is
solid melts into air
• Mourning lost authenticity
• If only we could reassert a
master narrative
• Clear distinction between
“high” and “low” culture
• Aesthetic formalism
• It’s the end of the world as we
know it, and I feel fine
• Authenticity is a lie, a trap
• Distrust of master narratives
• Blurring of lines between
“high” and “low” / “art” and
“commerce”
• Pastiche, collage, parody, irony,
self-referentiality, simulacra

35. John Eckman | @jeckman | #wcnyc2014

36. John Eckman | @jeckman | #wcnyc2014
Responsive Web Design
is more than a set of
techniques: it is a push,
to force us out of the
collective hallucination
of fixed-web design

37. John Eckman | @jeckman | #wcnyc2014
Responsive Web Design
• RWD can’t just mean
producing three comps where
we used to do one (mobile,
tablet, desktop)
• We need to balance the clients’
desire for control with a
realistic sense of device
proliferation and the
appropriate ebb and flow
• Stop trying to make the web
back into a new print

38. John Eckman | @jeckman | #wcnyc2014

39. John Eckman | @jeckman | #wcnyc2014

40. John Eckman | @jeckman | #wcnyc2014
Stop controlling, start designing

41. John Eckman | @jeckman | #wcnyc2014
Stop controlling, start designing
• Design from content out

42. John Eckman | @jeckman | #wcnyc2014
Stop controlling, start designing
• Design from content out
• Design for fluidity & device independence - grid
systems, percentages, responsive typography and
imagery

43. John Eckman | @jeckman | #wcnyc2014
Stop controlling, start designing
• Design from content out
• Design for fluidity & device independence - grid
systems, percentages, responsive typography and
imagery
• Move to real interactions (html,css,js) as early as
possible / practical (but not before that)

44. John Eckman | @jeckman | #wcnyc2014
Stop controlling, start designing
• Design from content out
• Design for fluidity & device independence - grid
systems, percentages, responsive typography and
imagery
• Move to real interactions (html,css,js) as early as
possible / practical (but not before that)
• Semantic markup and progressive enhancement
FTW!

45. John Eckman | @jeckman | #wcnyc2014
Epilogue: Control is an
Expensive and Dangerous
Illusion

46. John Eckman | @jeckman | #wcnyc2014

47. John Eckman | @jeckman | #wcnyc2014

48. John Eckman | @jeckman | #wcnyc2014
The White City
• Henry Howard Holmes,
“America’s first serial killer,”
designed and built a hotel to
prey upon primarily young
women who came to visit or
work at the fair
• See Erik Larsen, The Devil in
the White City, 2003

49. John Eckman | @jeckman | #wcnyc2014
The White City
• Henry Howard Holmes,
“America’s first serial killer,”
designed and built a hotel to
prey upon primarily young
women who came to visit or
work at the fair
• See Erik Larsen, The Devil in
the White City, 2003

50. John Eckman | @jeckman | #wcnyc2014

51. John Eckman | @jeckman | #wcnyc2014
Questions?