Site icon Treehouse Blog

Progressive Enhancement with Responsive Web Design and Flash

I know, I know. Responsive web design is the messiah and Flash is pure evil. So why would you ever want to combine them? Is such a thing even possible?

Living in a Flash Fantasyland

In December of 2012, the New Fantasyland at Walt Disney World’s Magic Kingdom park had its grand opening (the Treehouse office in Orlando is about 30 minutes away by car). At first glance, the New Fantasyland marketing website is pretty Flashy. However, there’s more technological magic here than what meets the eye (responsive design in disguise). Here’s what the site looks like in a Flash enabled browser:

Go to in a Flash enabled browser to get the full experience seen here.

Many advocates of open web standards, myself included, will preach about the follies of Flash technology. For starters, it is known for its bumpy history of poor performance and accessibility. Even Steve Jobs felt compelled to outline the numerous disadvantages of Flash in April, 2010. With the rise of increasingly advanced HTML, CSS, JavaScript, and Responsive Web Design, most appraisals of Flash would leave you with the impression that there is no upside. Some time ago, I personally decided that Flash no longer had a place on the web, with the exception of browsers that did not yet support HTML5 video. However, the Fantasyland site has made me back down a bit from that opinion.

If you visit the Fantasyland website on a desktop browser with Flash enabled, you’ll get a colorful and rich experience. The site is built around exploration: as you discover different parts of the site, you’ll find lots of interactivity and animation. At every turn, there’s Disney quality animation of swirling smoke and flags waving in the wind. One look at the site and it’s clear how impractical it would be to attempt with open web standards. In other words, yes they are using Flash, but they obviously had a very specific experience in mind. Duplicating this without Flash would be difficult.

Yes, but, will it blend?

At this point, I discounted the design by thinking: “It’s really cool, but it’s built on Flash so it doesn’t matter. It’s probably not accessible to people using assistive devices or to mobile browsers.”

I immediately loaded up the Fantasyland website in Mobile Safari on my iPhone, thinking I was going to “stump” them. To my surprise, there was a really nicely designed mobile experience with all the same content (sans cool animations) in the form of HTML5 videos, photo galleries I could swipe through, and more. Nice!

The Breakpoint

Now I’m thinking: “Alright, so they made a really cool Flash website and a separate mobile site. But what if I don’t have Flash on my computer?”

Back on the desktop browser I loaded up the Fantasyland site again, but this time with Flash disabled (Obviously, I enjoy exploring websites by attempting to break them). Without Flash, the site loads up as a nice looking HTML experience, very similar to what’s on mobile.

At the top of the page, they did recommend Flash to get the best experience possible, but the vanilla HTML site worked just fine. When I resized the browser down to a mobile width, the layout responded and looked the same as the experience that I saw on my phone and the Flash recommendation disappeared. Then it hit me: They didn’t build a Flash site and a mobile site. Rather, they built a responsive design with Flash added as an enhancement. Typically when you visit a Flash site, one of several ugly things happens:


Maybe I missed the memo, but I’ve never seen Flash used in combination with Responsive Web Design. The transition between the two experiences is seamless and doesn’t require the user to make a choice they don’t understand or install software. I still don’t like Flash as a technology, but this made two things clear to me:

I’d love to hear your thoughts in the comments. Does Flash still have a place on the web?

Exit mobile version