5 reasons why Adobe Flash will slowly but surely go extinct

As trends go through their natural cycle, the general public’s definition of ‘attractive’ websites alters. There’s no doubt that websites built in flash can be breath-taking. Wonderwall, AgencyNet 2.0 and Waterlife are a sweet reminder of the creativity and innovation that designers and multimedia developers are capable of.

However, while Adobe Flash provides what many ambiguously call the ‘wow factor’, it inevitably comes accompanied with unwanted baggage. The following are the main reasons why your website should not be built with Adobe Flash:

1. Lack of content management
   Websites nowadays are almost all CMS-driven. This means that the client or administrator can manage and maintain the content of the website instantly and without any technical knowledge. With the spread of Content Management Systems like WordPress and Drupal (both free and open-source), a website will never be considered of real value if its not constantly updated with fresh content (see my post on what makes a good website). With Flash, it’s almost impossible to have a proper CMS and therefore leaves you relying on a Flash developer to make any changes, and that within itself, is a tedious, time-consuming process. We’re at an age where sharing information has become as easy as tapping a button on your phone while on the road, the last thing we need is wasted (and costly) time on changes and updates
2. Search indexing and SEO
   There’s no real way for Google search to completely grasp the content of a Flash file. There are methods to give a general definition to the content, and therefore show up in some results, but for the most part, a Flash website’s left in the dark. Imagine putting so much effort in adding fresh, valuable content to your website as a social media tool to attract users, only for search engines to remain oblivious to it and therefore not bring you the interested crowd
3. Loading time and performance issues
   The main attraction in Flash is the reason behind its poor performance. Very rarely will you come across a website built in Flash that does not require significant time to load. And if it doesn’t, then it’s usually a lame, boring website that couldn’t been perfectly implemented with HTML and CSS instead. It is challenging to tolerate many seconds, and sometimes minutes, for a website to load
4. Lack of support across the different platforms
   When the iPhone first came out, users were too distracted with the eye candy to realize the lack of support for Flash. Now, with the overwhelming spread of the iPad, the inability to view flash websites in a number of devices has become a major issue of concern. In an open letter written in May, CEO Steve Jobs wanted to prove to the few doubters that Apple’s sole interest is to close all of their products, make them proprietary, and enforce its own way. The announcement also served as an indication that we might never see Flash playing on any of Apple’s gadgets again. If your website is not showing up on iPhones, iPods and iPads, then you’re losing grip on your audience
5. Instability of Flash player
   Flash player has been known to crash across the different browsers. Firstly, there was the famous bug that caused issues with Flash player 10 on Firefox that many blamed the open-source browser for, but later, many using Internet Explorer and Windows 7 shared similar complaints. The fact that this happened after Flash has been around for years is worrying for the future

Moreover, the arrival of HTML5 and CSS3 (along with the usual jQuery plugins) facilitates the switch
It’s far from an identical replacement, but the combination of HTML5 and CSS3 is extremely promising. Amongst other features, together they provide simple ways of embedding video and audio into websites. You also get full control of the appearance and can make all sorts of movements, transitions and animations. In fact, there is an entire cartoon built using only HTML5, CSS3 and jQuery called the CSS3 Man. Here’s a presentation of how HTML5 and CSS3 will shape on the new Firefox:

Therefore, save yourself the hassle, be reachable, be light-wight and fast, appear correctly on all platforms, and avoid technical issues. It’s best to leave Flash behind and embrace the full potential of the alternatives while it’s a choice, before you’re forced to do so.

Embed Videos With Flowplayer

For anyone developing or maintaining a website, embedding videos used to always be an issue. That was until YouTube became the undisputed leader for sharing videos, and embedding them in websites. Normally, using a free service with a recognizable appearance and a visible watermark, like YouTube, is unprofessional. However, YouTube has become so popular, that even the large corporations and professional entities display their clips using it.

YouTube is easy but limited

The reasons to YouTube’s success as a “video distributer” are due to the simplicity of the process, the familiarity with it by the regular users, and the relative flexibility in terms of size and appearance. Anyone can simply create a free YouTube account, upload a video, customize the interface by choosing the border color and display size, and then embed it into any website using the generated code. Seems like the ideal solution.

However, there are a number of disadvantages to the YouTube way of life:

1. The video is on Google’s server, and not yours: Even if their servers are rarely down, it’s always comforting to be in possession of your own content
2. Customization is limited: You have eight colors to choose from, and no say over the appearance of the border or controls
3. Somewhat rigid: In order to make any changes, you need to go back to YouTube, and re-copy and paste the code
4. Watermark and standard look: Nothing’s worse than having everything look the same. With YouTube, the watermark is very visible, and all of the players are virtually identical

Flowplayer: Open Source Flash Video Player

This is where Flowplayer comes to the rescue. Flowplayer is an open-source JavaScript library that allows you to embed videos in your website via a full customizable player. It is as easy as calling on the JavaScript file, inserting an <a> tag, and then indicating the properties that you want to define. This basically means that instead of uploading a video to YouTube and embedding the player, you can upload the .flv to your web server and the markup will look like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<!-- flowplayer scripts should be loaded from your servers NOT from static.flowplayer.org  -->
<script type="text/javascript" src="/js/flowplayer-3.1.2.min.js"></script>
</head>

<!-- some styling for the standalone page. this line can (or must) be removed -->
<link rel="stylesheet" type="text/css" href="/demos/standalone.css"/>

<!-- player container-->
<a href="http://flowplayer.org/video/flowplayer-700.flv" style="display:block;width:425px;height:300px;" id="player"></a>

<!-- this script block will install Flowplayer inside previous A tag -->
<script language="JavaScript">
flowplayer("player", "/swf/flowplayer-3.1.2.swf");
</script>

You can see the result here.

Notice that you call on the JS file in the <head>, and then you use the <a> to embed the player (you can also use <div>), and finally, some JavaScript to specify any attributes that you want to use.

Some of the features include:

• Embedding several videos in the same page without effecting performance
• Choosing the splash image that, when clicked on, starts the video
• Placing an image in the background, with a layer on top (ideal for a single “play” sign to be placed on any image)
• Embedding a playlist of videos
• A growing list of plugins to be used with the player
• Control such details as the fade in/fade out speed, cue points, and much more

Just by open-sourcing it (there’s also a commercial version), and allowing for the community to contribute with plugins on different levels means that the sky is the limit as far as embedding videos in websites is concerned. It might take a bit of time before it catches on with the regular users (who are very rarely willing to dig into the code), but for designers and developers, it should definitely be a tool to replace old-school video incorporation.

The website is very well designed and laid out, and the documentation is quite extensive, but it does seem to lack some usability. That is why when you first visit the Flowplayer website, you become confused as to what it is exactly, and how to works. After looking deeper, however, it has become clear that it is a very powerful tool with endless possibilities.

jsAnim: Beginning of the End for Flash?

As I was stumbling upon the web, I came across the jsAnim website. The first impression that comes to mind when you open the website is that of vector-based, colorful Flash animation. Interestingly enough, though, it is yet another example of animation and cool effects achieved through pure JavaScript – no plugins required. Just like jQuery has introduced a wide range of animation effects and interactive content, JsAnim looks to rid the users of Flash, especially if all they’re going to do is relatively basic vector animation.

In an earlier post I made about the Solidays festival website, I talked about an example of impressive and intuitive Flash use. Unfortunately, many websites seem to be using Flash for the wrong reasons, and quite a number of developers have opted to fully rely on CMS-driven websites at the cost of some of those cool effects that can give you the edge in a website or online application. Nowadays, with the rise of JavaScript libraries such as jQuery and JsAnim, you can get the best of both worlds by integrating the JS files and calling upon them when needed. The result would be simple, professional and extremely easy to manage/maintain websites, that boast special effects and animation. This is not to say that Flash, as we now it, will cease to exist. Rather, this allows for developers to make a clear-cut choice: either develop the entire website in Flash, and take advantage of the unique features it gives you, or stick to XHTML and CSS using a CMS with JavaScript libraries integrated. The latter of which is by far the most popular choice.

One of the most impressive features of JsAnim is the small file size of just under 25KB. And unlike jQuery, you’re not going to be installing plugins that may increase the file size and require more time to load, at least not for the time-being. At version 0.2, this is only the beginning, and it can only get better.

My observation is that the difference between a multimedia developer and a web designer is growing bigger and bigger. Future generations of designers will have to make a choice earlier on, as it is going to be almost impossible to specialize in both areas. But who knows? Maybe ActionScript can go back to its JavaScript roots, and we get a Flash that integrates seemlessly into a website without requiring a plugin or any kind of special treatment.

Solidays Festival Website

Every year, a massive music festival is organized in Paris in solidarity against AIDS. Solidays boasts some of the big names, such as Manu Chao, as well as many up and coming groups and artists. The build up to the big event has enjoyed a lot of success, thanks in particular to their inspirational website.

The Solidays annual music festival has an impressive website

With the rise of Content Management Systems, fewer web designers are choosing to work with Flash. While this topic is too big to be briefly brought up here, for the time-being, it is suffice to say that many developers chose to stick with XHTML and CSS as it is much easier to maintain, and much more flexible overall. Especially now with jQuery on the rise, there is a movement away from Rich Internet Applications, towards CMS-driven websites.

However, a website like Solidays.com reminds us all of the unprecedented beauty of Flash. We have forgotten that there is much more to Flash then actionscripted animation and vector graphics. The entire website feels like a short movie that has you glued to the screen (not to mention your ears’ full attention to the catchy tunes), and is truly a pleasant experience. Their use of colors is rejuvenating, and the animation techniques implemented are just glorious. The best part of it is that it’s not all looks and no brains, as you’d expect. In fact, the Solidays website is packed with information about every artist performing, plus general information the visitors would need.

On the one hand, the internet needs CMS-driven websites, giving power to the regular user to manage and maintain his or her website with minimal technical knowledge. But on the other hand, it is always refreshing to surf interactive and creative websites such as that of Solidays.