Web International Awards

payday loan

1

SEP 2009 3

Graceful flash degradation

flash player logo on artwork

It has been quite some time since I last wrote an article here, and I hope you all enjoyed the summer and summer holiday. I read a lot of blogs each day and I must say that there's a decent amount of articles about javascript, content, and how to properly code a site when using javascript. You have to be careful because of those people who disable javascript or use old browsers that don't have such features. However, I haven't seen any articles describing some short guidelines as to what you should do when developing a site in flash.

Issues with flash developing

The first issue that has to be taken into consideration here is that while many people have flash player installed, its version may be an older one, and the site or web app you are building with flash 10 may not work correctly, or at all on some people's computers. Moreover, there are individuals that don't have flash player installed, just like the ones without javascript.

How to handle flash generated problems

The easiest option would be to develop a html version of the site. Though this is ok, the costs of such a solution grow as the site grows. This is ok for small sites or sites that are not updated frequently. What happens when you have a big site, with content updated on a daily basis?

eufa.com screenshot

One interesting solution, which I definitely like is the one adopted by UEFA (Union of European Football Associations). Their website is not entirely flash, but has many flash sections. One of them is a content slider, which could have been built using javascript. They used flash and that is ok too, but how they fix search engine issue that come by using flash. How can people using mobile devices like the iPhone - which doesn't have flash - browse their website and read valuable content?

The solution is quite simple. UEFA's website displays all content headlines as plain text. Those headlines were previously bundled with images in the flash content slider. Moreover, the headlines appear in the same area of the site, leaving the layout uncrippled. Another important feature is that they also display a small button telling their visitors that if they want to fully enjoy the site they should install flash player. They also link to Adobe's download page.

uefa.com screenshot

UEFA does a great job making a well developed website, but they have their own pitfalls. During the UEFA Champions League and UEFA Europa League draws, which took place last week, their live coverage of the event had only flash versions, rendering blank pages for users without flash player. Mobile users had to make phone calls in order to find out the group of their favorite team.

A website that does a bad job about non flash user experience is vinuldenunta.ro . Such users do see something other than a blank page. They are presented with a small paragraph which unfortunately isn't formatted in any way, leaving the impression the site is under construction. No information is provided regarding the cool flash version of the site that is hidden to them.

vinuldenunta.ro screenshot

Pointers for better flash developing

  • 1. If possible, provide a non flash version of the site
  • 2. If important content is displayed within flash, make sure it is available for users that do not have flash player
  • 3. Don't use flash for navigation, and if you do, provide a secondary navigation menu using html
  • 4. If you only have flash version, make sure you let non flash users know about that

The above are just some basic pointers, but sticking to them will insure a high quality website. If you have any other examples or pointers please leave them in the comments section bellow. If you liked this article you can subscribe to the full content rss feed and stay updated as we post new information.

Published on Tuesday, September 1st, 2009 at 4:18 pm in code, design, flash, techniques, usability.

About Bogdan Pop

Bogdan Pop is a young Romanian entrepreneur who runs WebRaptor. He is a web developer with awesome design skills, who enjoys writing about everyday's work and usability. He relaxes by taking photos every once in a while and by mixing french electronic music. Connect with him via Twitter.
 
  1. CSS Brigit | Graceful flash degradation says: September 2nd, 2009 at 3:12 pm

    Graceful flash degradation…


    Article containing pointers to improve flash websites, accessibility and usability of websites that contain flash elements.

  2. Related article says: September 21st, 2009 at 1:07 pm

    […] Graceful flash degradation, reloaded! […]

  3. Javascript DOs and DONTs. Complete with 17 examples from real web says: October 19th, 2009 at 2:17 pm

    […] of times, especially when the main technology used to build a site was flash. You can check the first and the second flash degradation articles before reading this one. In this article I will cover […]





Save time next time! You won't have to fill out all these fields again. Register in just a few clicks and then login.


If you do not have a username, you can register in just a few clicks.