A cut down version for WordUp Glasgow 2012 via WPSCOTLAND.com

2. The Emperor’s New Clothes
@WordUp Glasgow
February 2012

4. Kevinjohn Gallagher

5. The Vocal Minority

6. aka:

7. I’m a bit… Roy Walker
“ Say What You See ”

15. What’s the Plan, Stan?

17. The Tonight Show: Top 10
• Responsive Design is Irresponsible
• Why Free is too Expensive
• Browse Crappy
• Why you have to be High to use HTML5?
• Justified: Why you‟re the client from Hell
• Basic != Standard
• Good developers don‟t make good Jedi Knights
• Exit stage left: How we failed the world with CSS3
• Upgrades of Mass Destruction
• Lies, damned lies, and Open Source Statistics

18. Lets get ready to Rumble…
Which depending on your age means…

19. (if you’re over 30)

20. (If you’re under 30)

21. But !
• If you search for “PJ and Duncan” on Google images
• On the 4th row you see this…

22. It’s KIMB !!!

25. Premise
• Responsive Design is the ability to apply different CSS
styles based on media queries
• e.g.

26. Why this appears awesome:
• Mobiles
– Responsive Design allows designers and front-end
developers to react to mobile devices.

32. Call a spade, a spade
• When we say “responsive”, what we mean is, “Mobile”.
• Or specifically, “same content, but with a different
design for mobiles/tablets”.
• It works on the premise that the ONLY difference
between a desktop and a mobile browser is screen size.
• Non-Desktop users:
– rarely use a Human-Computer-Interaction device
– are almost always looking for different information
– are rarely on broadband

34. Proof of Paradox
• It‟s not about Screen Size, it‟s about Context.
• We had Screen Size specific 10 years ago, so it‟s
definitely about Context and not Screen Size.
• Except, the only way to test for Context is to test for
Screen Size.
• So in order for it to not be about screen size, it needs to
be measures and identified by screen size.

37. So… Context
• The CSS2 spec DID include context variables!
– media: handheld, screen, tv, print
• But after years of research, these were dropped by
some small companies that according to our web
design community know nothing about what Mobile
Users want…

38. Who you gonna call?
• These companies, say that their users don‟t like to be
treated differently unless it‟s in their best interests.
• Not with a visual, but a data & architectural change.

39. So…
• in order to change the visual elements under the
premise of it being about Context and not Screen
Sizes, we have to map Screen Sizes to our predefined
Context, and then use Screen Sizes to decide what to
display – which was exactly what we said it wasn‟t
doing.
• It‟s also exactly what our users don‟t want.

40. Irony in Images
• Responsive Design was invented for designers/front-
end coders to not be reliant on developers for multiple
versions of websites.
• One of the major downfalls of RWD is Images.
• Inline images work best for responsive design, using
the code:
– img.className { max-width: 100%; }

41. • By this method, the same image is on all site versions.
• Do you load an image that‟s high quality, and destroys
your bandwidth on a mobile?
• Or do you load a low quality one that looks poor on a
desktop?
• Or do you attempt to load multiple images and
display/hide the correct one as needed?
• None of these work well. So you have to use a technical
solution to request the right type of image.

42. Conclusion
• Responsive Design = “same data, different display”.
• But it can‟t take into consideration:
– Bandwidth
– Platform
– Device
– Purpose
– Context
• It wants to, but all it knows is Screen Size.
• Those require decision making processes, something
that CSS simply isn‟t built for.

43. • It has to be about Information Architecture.
• It can‟t be done by CSS alone.
• CSS wasn‟t intended nor built for that purpose
• We need to stop shoe-horning shit into the CSS specs
• We‟ll end up at a place where each browser supports
only the code they want to and in the way they want to

45. • RWD is not a bad idea.
• Technical restraint and common sense are once again
being thrown out the window in the name of cool-
looking-shit on the internet. (Hello 1999?)
• RWD is irresponsible, because designers & front-end
coders have the ability to fake something regardless of
the Business Case or Return on Investment.
• Rest assured, 2-5Mb “mobile optimised” homepages
await us.

48. Premise
• I can‟t see the word “free” in “Open Source”
• There‟s a growing sense of entitlement that software
should have no cost.
• Worse, we now expect people to give support and
updates for free… forever!
• We‟ve stopped looking at the business cases around
the software we‟re hoping to use.

49. • We favour the exceptionally cheap or free option over
software with a different pricing model that aligns
better with our needs.
• “premium” and “freemium” plug-ins are decried
unless their cost is so small and their features so great
that the Return on Investment is mind blowingly large.
• That‟s not a business model that can continue to
perpetuate itself in the long run.

50. How often have you thought this?
• I can‟t believe that plug-in costs money!!
• I could do that myself 2-3 hours!
• I mean, look at the other free versions, they haven‟t
been kept up to date, but appear to do the same thing.
It’s a rip-off !

52. Listen to Bowie
• If the alternatives to the paid-for version are out of
date, then they probably won‟t work (as well).
• You can‟t code it in 2-3 hours.
• Your code may suit your needs more succinctly, but we
know that all software has quirks and you‟re not going
to find them all on the first go.

53. Do the Math !
• How much do you charge an hour?
• How long do you think it would take you to
plan, code, test and deploy your version?
• Divide the cost of your purchase by how long you think
it would take you to develop. Which is more?

54. • Open Source is not yet taken seriously as a viable
business model, and we need to make a mental shift.
• We need to accept that “Open Source Software” does
not contain the word “free”, and that my time, your
time, and other people‟s time is worth more than
“nothing”.
• Don‟t value free over not free: it‟s an oxymoron!

68. • First Draft published in 2008
• 4 years later, still no definitive spec

79. Bluntly, it’s not ready.

82. Premise
• Jargon-free isn‟t enough
• Acknowledge the lies (WYSIWYG)
• Terminology

83. Justified
• CLIENT: “I don‟t like the type.”
• ME: “What don‟t you like.”
• CLIENT: “I don‟t like how it goes all to one side.”
• ME: “You mean ranged left.”
• CLIENT: “Yes, yes, arranged left.”
• ME: “How do you want it?”
• CLIENT: “To be the same on both sides.”
• ME: “Justified?”
• CLIENT: “I don‟t have to justify anything! I own the fucking company.”

84. • Jargon free isn‟t enough
• We still treat people as if they have what WE consider
to be a base level of knowledge.

87. The biggest lie of all
• WYSIWYG

88. • WordPress WYSIWYG

89. WP Function
• add_editor_style(„editor-style.css‟);
• Added in 3.0 (officially)
• Unofficially there since 2.7
• FYI: Doesn‟t quite work thanks to the implementation
of TinyMCE (you need to include browser reset css)

107. Premise
• What makes a good developer?
• What makes a good Jedi Knight?

108. In the real world…
• What makes a good Project Manager?
• What makes a good Tester?

131. Every week on Star Trek
• Kirk: Mr. Scott, How long until X?
• Scotty: 3 weeks captain.
• Kirk: I need it in 4 minutes
• Scotty: I just cannae do it captain
• Kirk: I need it Mr.Scott
• Scott: Oh you need it? let me just flick this switch

136. Remember
• Kirk went on away missions
• Kirk talked to all departments
• Kirk talked to Starfleet Command
• Kirk talked to people on the view screen
• Kirk was from Ohio, he just worked in Outer Space
• Scotty stayed in Engineering

140. Is the good thing, the right thing?