70
Progressing and enhancing. Chris&an Heilmann SWDC, Stockholm, Sweden, June 2010

Progressing and enhancing

Embed Size (px)

DESCRIPTION

My talk at the Scandinavian Developer Conference 2010 about following the wrong principles and getting too excited about shiny demos rather than building things that work and proving our technologies as professional tools.

Citation preview

Page 1: Progressing and enhancing

Progressing and enhancing.

Chris&an HeilmannSWDC, Stockholm, Sweden, June 2010

Page 2: Progressing and enhancing

Our job as web developers is to create working solutions.

Page 3: Progressing and enhancing

End users should not have to care what technology we used.

Page 4: Progressing and enhancing

All they should get is an interface that works and helps them reach their goal.

Page 5: Progressing and enhancing

They need and want to fulfil a task - not marvel at our craftsmanship.

Page 6: Progressing and enhancing
Page 7: Progressing and enhancing

The main problem is that we love marvelling at our craftsmanship.

The main problem is that we love marvelling at our craftsmanship.

Page 8: Progressing and enhancing

We tend to get terribly excited about things in our little world.

Page 9: Progressing and enhancing

And play with them to push the envelope.

Page 10: Progressing and enhancing
Page 11: Progressing and enhancing

We measure our successes by how much we achieve in our own world...

Page 12: Progressing and enhancing

...rather than how many end users we made happy.

Page 13: Progressing and enhancing

This also leads to an amazing amount of truisms floating around.

Page 14: Progressing and enhancing

“Everybody has

JavaScript - only

freaks turn it off.”

Page 15: Progressing and enhancing

“People e

xpect drag and

drop in

terfaces

these d

ays!”

Page 16: Progressing and enhancing

“The iPad means the

end of web design as we

know it.”

Page 17: Progressing and enhancing

“This can be done

easily with jQuery”

Page 18: Progressing and enhancing

And also totally wrong statements.

Page 19: Progressing and enhancing

“My favourite part of HTML5 is geo location!”

Page 20: Progressing and enhancing

“The most powerful part

of CSS3 is transitions

and animations.”

Page 21: Progressing and enhancing

To console ourselves to see that we are right, we have statistics.

Page 22: Progressing and enhancing

But three out of five people know that 76.3% of statistics are made up on the spot.

Page 23: Progressing and enhancing

Let me tell you what happens when you give out truisms like that.

Page 24: Progressing and enhancing

Every time you say things like that...

This dog will disapprove... ...and these will not get fed.

Page 25: Progressing and enhancing

The biggest fallacy in our ways is to pick a pet technology...

Page 26: Progressing and enhancing

...and then do frigging everything in it!

Page 27: Progressing and enhancing

Lightbox in pure CSS!

Page 28: Progressing and enhancing

Things that look like

bad Windows 95

screensavers in Canvas

and Javascript!

Now with free 100% memory use!

Page 29: Progressing and enhancing

Even if we don’t use the technology - we call it a CSS3 or HTML5 solution.

Page 30: Progressing and enhancing

We arrived at:

DHTML5

With thanks to Scott Schiller

Page 31: Progressing and enhancing

It is ironic that we don’t plan for non-JS environments but for IE6 fallbacks!

Page 32: Progressing and enhancing

With the fallback being expression() and IE filters.

Page 33: Progressing and enhancing

Which did almost everything WebKit extensions do now.

Page 34: Progressing and enhancing

But without style and on much slower hardware.

Page 35: Progressing and enhancing

expression() and filters are evil and have to die!

Page 36: Progressing and enhancing

The main problem is our approach.

Page 37: Progressing and enhancing

We have to emancipate ourselves from the idea of the interface as the starting point.

Page 38: Progressing and enhancing

If we build the simplest solution first we can enhance it to whatever we want.

Page 39: Progressing and enhancing

Including mobile!

Page 40: Progressing and enhancing

A lot of “using newest technology” is a lame excuse for not architecting our solutions.

Page 41: Progressing and enhancing

There are real issues HTML5 and CSS3 need to solve:★ Security★ Hardware Access (Camera, Location, 3D

accelleration)★ Native rich controls★ Layout★ Internationalisation★ Accessibility★ Rich Media (video, audio)

Page 42: Progressing and enhancing

For now, your only chance to build good web apps is progressive enhancement.

Page 44: Progressing and enhancing
Page 47: Progressing and enhancing

Both these solutions started the same way.

Page 48: Progressing and enhancing
Page 49: Progressing and enhancing
Page 50: Progressing and enhancing

Getting data from a web service on the server and rendering out HTML for CSS and JS to access.

Page 51: Progressing and enhancing

If you want to build things for the web you will need to use all these technologies.

Page 52: Progressing and enhancing

Otherwise you are reliant on software vendors - and that is a bad idea.

Page 53: Progressing and enhancing

We did this for IE6 and that is why there are so many bad web applications out there.

Page 54: Progressing and enhancing

It seems to be impossible to get rid of IE6 because of that - but I have a solution!

Page 55: Progressing and enhancing

The Amelie approach to the IE6 problem.

Page 56: Progressing and enhancing

Despite of what I said earlier, there is one filter we can use to solve one of our problems.

Page 58: Progressing and enhancing

No filter

Slight filter

Page 59: Progressing and enhancing

Applied randomly every few seconds with a slight blur this can be effective.

Page 60: Progressing and enhancing

If we build the simplest solution first we can enhance it to whatever we want.

Page 62: Progressing and enhancing

We leave this in our code for a few months.

Page 63: Progressing and enhancing

Maybe persuade Google to add it to AdSense!

Page 64: Progressing and enhancing

When people complain, we say that our code is bug free - it is a mystery.

Page 65: Progressing and enhancing

Then we get some “experts” to tell the press that it might be software fatigue.

Page 66: Progressing and enhancing

=

Page 67: Progressing and enhancing

That way we turn IE6 from a technical problem to a health and safety issue!

Page 68: Progressing and enhancing

And corporate HR carries more clout than corporate IT!

Page 69: Progressing and enhancing

If we all work together, we can win this!http://icant.co.uk/ie6-amelie/

Page 70: Progressing and enhancing

Christian Heilmann http://wait-till-i.com http://developer-evangelism.com http://twitter.com/codepo8

Thanks!