Posts RSS Comments RSS 38 Posts and 67 Comments till now

SEO your full fledged flash websites

I am guilty of spending too much time on designing and developing websites that I hardly spend much time on making them “search engine optimised”. Search engine is so powerful these days, people are reliant on it for almost all information they are trying to find. They don’t call anymore, they don’t ask, they search - and it is probably the fastest way into getting instant information.

Almost all of my websites are designed entirely in flash, they might be friendly to the eyes, but not exactly very friendly to search engines. This post a very serious problem especially when you’re relying on a website for your business. Clients wants sites to be in HTML and minimal flash so that it is searchable via search engines. Fair enough, moreover HTML can be deployed together with AJAX to minimise refreshes and put some life into the HTML pages by employing slight animation, but if you really love Flash like I do, you might want to SEO your full flash sites with - SWF Object

Benefits of SWF Object

  1. It detects whether the flash player plugin is install on the user’s computer
  2. If no flash player is detected, the same page that holds your full flash site will display alternative HTML content (note that the page will display “alternative content” and not bringing the user to an “alternative page”
  3. The “alternative content” which you’ll design in the main page that holds your full flash site will also get picked up by the search engines making the page search engine friendly

5 Steps on using SWF Object (it’s easy)

  1. Click here to go to SWF Object download page at Google Code
  2. Download “SWF Object 2.0″ from the above mentioned site (SWF Object 2.0 is the latest available at the time of writing)
  3. Copy “swfobject.js” from the folder you’ve downloaded (you need to unzip the folder from the zip file)
  4. Paste “swfobject.js” into the same directory as your HTML page holding your full flash site
  5. Go to the SWF Object HTML & Javascript generator page to generate a HTML page to embed your flash and include the most important “alternative content” (a.k.a. HTML content in case your audience don’t have flash player installed and at the same time making your site search engine friendly). The SWF Object HTML & Javascript generator page can also be downloaded as a HTML or Adobe AIR application via the same SWF Object download page at Google Code website.

And you’re done! I’ve made my website search engine friendly by using SWF Object, you can try it too and tell me if yours works. :)

*You might need to uninstall your flash player to test the alternative content without Flash Player Plugin, here’s where you can download the Flash Player Uninstaller. For more information and documentation of SWF Object, go to here.

All about preloader - Part I: What is a preloader?

…(a preloader) consists of a quickly-loaded smaller movie, image or text with a message that tells the viewer to wait while the rest of the larger object is loaded. - Wikipedia

According to the definition, a preloader should be a small message that indicates a large object is loading. A good preloader follows the definition closely, small, quick load and informative. A simple looping animation works, pure text works and a line in the stage is pretty neat too.

A common mistake is called “preloading the preloader”, which means that the preloader makes up the majority of the file size and it is too big to be loaded quickly. It may sound silly but you do spot it from time to time. Unfortunately, there isn’t an exact figure to measure whether the preloader is too big or not. It’s up to the designer or developer’s judgment.

Fortunately, preloader is getting less and less important nowadays. One reason is because bandwidth is getting bigger so the preloading time is much shorter. But more importantly, people realized more time should be spent in developing the content rather than a stunning preloader.

The Humble CSS Saves the Day

Granted that this isn’t related to Flash at all, but I do think it’s pretty useful for anyone who had to deal with these minor, but annoying glitches. Will from Evoart shares with us a couple of useful reusable snippets of CSS and some best practices that he recommends.

Here’s a quick snatch from the article.

Firefox Image Outline Fix

This little beauty does exactly what it says it does. If you weren’t aware, Firefox has a nasty little habit of adding ‘outlines’ to images that are links. This really bugs me on items in the main navigation of a website, but thanks to this handy piece of code you can say goodbye to these outlines forever!

A:focus, A:hover, A:active /* Firefox image outline fix */
{
outline: none}

Banish your bane of the horrible IE 6 background flicker and other dooms right here.

AS3 Migration

For those of you who don’t know this yet, if you’re migrating from AS2.0 to AS3.0 or if you’re constantly using AS3.0 to develop your projects, this is a very handy ActionScript 3.0 Migration PDF reference. It clearly shows the difference between AS2.0 and AS3.0 and tells you what to import when using certain objects, it also tells you what objects has been removed in AS3.0. Certainly good to have it with you when developing AS3.0 projects or if you’re starting to learn AS3.0. There are also other cheatsheets for other platforms like AIR and Papervision which can be found here.

Link: ActionScript Physics Engines List

minidxer kindly collected all physics engines available.

Fullscreen Flash is so COOL! BUT…

There are some security restrictions. The full article can be found in Adobe’s website. Two restrictions are very important:

  1. “Users cannot enter text in text input fields while in full-screen mode. All keyboard input and key-related ActionScript is disabled while in full-screen mode, with the exception of the keyboard shortcuts that take the viewer out of full-screen mode. ”

    This restriction keeps most website/application away from fullscreen mode. Almost all websites and applications need keyboard interaction. Bringing the user out of fullscreen mode to fill up a form is not user-friendly.

    It was stated in Square Factor’s blog that the reason for disabling input is to avoid phishing activities. “…attacker could mimic the look of the operating system / browser to force user to enter sensitive data, such as passwords or serial numbers.”

  2. “The ActionScript that initiates full-screen mode can be called only in response to a mouse click or keypress. If it is called in other situations, it will be ignored (in ActionScript 2.0) or throw an exception (in ActionScript 3.0).”

Flash website tracking with Google Analytics

google analytics screengrabThe success of a website is evaluated by its traffic. Important data like pageviews and visitors are collected using web tracking technologies. The simplest form would be the old school visitor counter. There are many commercial web tracking services for big websites and there are also free services such as “Google Analytics(GA)“. It’s simple yet extremely powerful.

GA is a javascript based solution. Using GA in HTML is very simple. Paste in the scripts and the site is tracked instantly. To track a Flash based website is not hard either.
Continue Reading »

Limitations of Papervision3D

papervision3d logoPapervision3D brought 2D Flash into a 3D world. It’s exciting and there are lots of cool websites and applications developed with PV3D. But nothing is perfect in the world. It also has some limitations:

Continue Reading »

Actionscript 3 scrollbar

I created this scrollbar some time back. I did not use it in a actual project yet but I think it should be useful for those who are doing websites in AS3. It is customizable with Tweener effects selection. It scrolls mainly movieclips, so as long as you convert your text or images to movieclips, you can scroll them. Here is the scrollbar source.

This movie requires Flash Player 9

XFL new Flash file format coming in Flash 10

Flash CS4 will be able to export *and* import a new source format called XFL. An XFL file is a .zip file that contains the source material for a Flash document. Within the .zip file resides an XML file describing the structure of the document and a folder with the document’s assets (graphics, sounds, etc). - From Colin Moock

« Previous PageNext Page »