Adobe Flash is a “multimedia platform used to add animation, video, and interactivity to web pages.” – Wikipedia.

It’s been very useful to developers for many years. At Wood Street, we’ve used it to develop all sorts of things… animations, video, eCommerce apps, presentations, Interactive CD Roms, etc.

Flash was an effective tool and we used it a great deal. But, it did come with its own set of issues…

1. It requires an additional skill set and therefore is more expensive to develop properly
2. It can be a barrier to effective SEO (Search Engine Optimization)
3. It is much more expensive to update and maintain
4. And more recently, it is not supported on Apple products like the iPhone or iPad

This last point has been fodder for a very public battle between Adobe and Apple. Apple has flat out refused to support Adobe Flash and Adobe has been anything but quiet about their disappointment in this. Don’t cry for Adobe though. They will be just fine. If you’ve ever purchased their Creative Suite, you know that they make money. And pretty much every web design and graphic design professional has a version of it.

Flash has served its purpose but I am to the point where I rarely see the need for it because of  emerging technologies like html5 and JavaScript like HTML5 or JavaScript. Don’t get me wrong, I think Flash can be very powerful. But you really need to convince me that Flash is going to do what these other platforms simply cannot before I am on board with it.

One strategy I will very rarely get behind is building an entire web site or any of the navigational elements in Flash. This is bad form and just plain unnecessary. You can do so much now with CSS, HTML5 and JavaScript, that there simply isn’t a reason to use Flash in the construction of any of the user driven elements of your site other than longer animation sequences.

So the next time someone in your organization starts leaning toward developing any part of your website in Flash, ask them these questions…

1. Is it necessary? What purpose does Flash serve the user? If none, don’t use it.
2. How will the use of Flash impact accessibility? If you are concerned about users with disabilities, Flash could be a hindrance. Readers for the blind cannot read Flash files for example.
3. Can you accomplish the project goals with another technology? Can you use CSS, HTML5, JavaScript or something else to achieve the desired outcome? Even if you can do 75% of what you want with something else, strongly consider it.
4. Is SEO important? It used to be that Flash was not indexable by Search Engines. Nowadays you can develop Flash so that keywords are visible but it takes time and therefore will be more expensive. Of course, if the developer does not know how to do this or simply does not do it, then your Flash piece will be invisible to search engines.
5. Are your users going to be viewing your site on an iPhone or iPad? If even a portion of them are, consider something else. You can do some neat things with animation and HTML5 and it will be supported by these devices.

Flash still has its place. It is currently the most widely used plugin for service video. YouTube, Vimeo and Hulu are good examples of this.

Remember to consider the user and your desired outcome before you use Flash. You can have the most amazingly animated site with all kinds of swooshes and sound effects and video, but if no one sees it, no one sees it.

Unless you have millions to spend on promotion, you need your site to attract visitors on its own. Flash will hinder this way more than it helps.

Am I missing something? Is Flash more useful than I give it credit? Let me know in the comments below…

Even Microsoft, which has been criticized in the past for lack of standards support, has touted a desire for full HTML5 support, starting with the future release of Internet Explorer 9, which will feature a sizable amount of HTML5 support .

If there is any doubt about its adoption in the application or consumer market, take these recent headlines as examples:

• YouTube Launches New HTML5 Mobile Site

• AOL Rolls Out HTML5 Mobile Site And New Android Apps Store

• Sencha Touch: The HTML5 Mobile App Framework

• Google Launches Web Site Promoting HTML5

• Apple launches HTML5 Showcase page

• Google Counters Apple’s HTML5 Showcase With HTML5Rocks

• Yahoo brings HTML5 based Yahoo! Mail Web App for iPhone and iPod Touch

Why are the industry leaders and large corporations forging the way and pushing for widespread HTML5 adoption?  My personal opinion is the mobile market. With about ½ of all internet access based from mobile devices and all of the major smartphone developers supporting HTML5, we can see where this is heading and it’s time to get on board.

Pro’s of HTML5:

New HTML5 Features

HTML5 is packed with new features that allow us to extend our web development services beyond their current levels. Not the least among these new features is a beautifully simple Doctype and HTML declaration:

<!DOCTYPE html>

<html lang=”en”>

This is in stark contrast to the overly complicated current doctype for XHTML Transitional:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

<html xmlns=”http://www.w3.org/1999/xhtml”>

Highlights

Here are some HTML5 highlights for developers and users:

• DOM (document object model this is already used for previous versions of HTML)
• The canvas element (for immediate mode 2D drawing)
• Timed media playback (for displaying captions, etc.)
• Client-side storage database (Session Storage, Local Storage and Database Storage)
• Document editing (editable content areas using local storage)
• Native drag-and-drop
• Cross-document messaging
• Browser history management (window.history.back())
• New form element features and built in browser validation (search, email, tel, number, required, placeholder, autofocus + placeholder=”Default Text in Search Field”)
• Block level links

New Tags

Taking semantic markup to the next level, HTML5 has introduced semantic tags. Instead of using IDs and classes in your markup to provide structural elements (<div>) you can now use a tag instead (<header>). Although IDs and classes will still be needed and important, we will see fewer instances of them.  Here are some additional samples of new HTML5 tags:

• <article> - Defines parts of the content that are independent, such as blog posts, articles etc.
• <embed> – Defines external interactive content or plug-ins
• <figure> – Defines a group of media content, and their caption
• <footer> – The counter-part to <header>, used for any footer section per context.
• <header>  – Used for headers per context. Note: not just for the header of a page, but also for each header part in section, article and similar.
• <hgroup> – Used for grouping several headers, such as a main heading and a sub-heading.
• <nav> – Defines the main navigation.
• <video> – Used for natively including video in a web page – lots of interesting work is coming along here in terms of web browser support.

Mobile Friendly

Just as HTML5 is the future of markup for front-end web sites and applications, mobile is the future of electronic, web-based communication. And the very, very good news is that just about all of the smart phone platforms fully support HTML5 (Google Android, Apple OS4, Nokia, Palm WebOS, RIM’s new OS6, etc.) and encourage development of online applications and web sites that use it.

As an example, the iPhone OS is built to recognize HTML5 features and take advantage of them. For online forms, we can code an email field to use <input  type=”email”>. For Apple OS4, bringing focus to a field with this type will open the keyboard catered to entering email addresses. In contrast, coding <input  type=”number”> automatically opens the numbers keypad, which allows users to type numbers without needing to switch to the needed keypad.

Backwards Compatibility

There are limitations when it comes to the current support of HTML5, but with a little extra effort, most elements are backwards compatible and degrade gracefully. Using our form example from above, if <input  type=”number”> was not supported by your browser, it would default back to <input  type=”text”>, which is just a normal text field. Of course, not all elements are backwards compatible, so using most elements on web sites requires a few workarounds and extra thought to make them function properly for everyone.

Con’s of HTML5:

As with all new technologies or new techniques on the web, there will be growing pains when implementing them. The good news is that the web developer/designer world has gotten a little impatient with supporting the dinosaur browsers.

So, if a visitor comes to our web site with an IE6 browser, we’ll fall back on our semantic markup and let the visitor have full access to the information on our site.  It may not look as pretty and they will not have the full user experience visitors with more modern browsers will have, but all of the information is still accessible. That’s fair, right?

I’m a recent convert and believer in this approach. Should you spend the extra time and money developing for the smallest percentage of users? After all, we are just talking about user experience. Those visitors will still be able to access the information they are looking for, which is the most important consideration.

The rule is simple: Make it accessible to everyone, make it perfect for those with modern browsers and leave it at that.

Notable Cons

Cross-Browser support is very weak for all elements of HTML5, but more and more features are getting supported with each browser release.

October 2009 was the official “last call” for elements related to the working draft of HTML5.  However, there are a few rumors and rumblings out there saying that because HTML5 is not 100% final, things may change. Don’t count on too much change, though.

Summing Everything Up

If you want to see into the future of our industry, you only need to study what the major web service companies and browser manufacturers are focusing their development efforts on…

Large industry players (Google, Apple, Yahoo, Mobile Device Manufacturers, etc.) have the infrastructure to respond almost immediately to user demand and are constantly pushing, perfecting and developing the technologies we use on the web every day. They have also devoted a lot time and money into developing services and web sites that leverage HTML5 and, therefore, have a huge stake in its success.

Your web site is the front line for your marketing and communications efforts.  You update them with useful information in order to be a current source of answers and solutions to your clients, members, etc.

And every so often (some more often than others) you completely overhaul your web site with a new design, new features and better information.

If you are doing this, good for you!  It is generally an arduous yet beneficial endeavor.  Unfortunately, for many it is also a time when many mistakes are made.  We put together this checklist of the 5 MUSTS when launching a new web site to help you make sure you have everything covered for your launch…

1. Proofing

   Yes, I know, seems like an obvious one.  But inevitably something always gets missed.  This usually occurs when the person who crafted the content is the same one proofing it.  If you can, find someone who has spent no time on the new site and have them go through every page.  Look for spelling mistakes, bad grammar, inaccurate info, etc.  You might be surprised what they find.

2. SEO

   Whether or not you have done any search engine optimization in the past, this is a good time to perform at least some of the SEO basics – do you have the proper page titles, correct HTML markup and keyword rich content?

   See our post on SEO for more specifics about Search Engine Optimization best practices.

3. 301 Redirects

   Often when you relaunch a site you’ve done some restructuring of the site content and organization.  When this happens some of the linking and link naming will have changed. Google and other search engines – assuming you’ve been indexed – will have these old pages in their database for future search listings.

   A 301 redirect tells the search engine that the old page has been replaced and lets them know how to get to the new one.  Your web developer or SEO specialist should be able to help you with this.  If not, we can.

4. Old Content and Bad Web Links

   Another usual suspect… a lot of existing content will be reused.  This content will include images, links, references to articles, links to other sites, etc.  Some of this information is probably no longer valid.  The last thing you want to do is launch a site with broken images or bad links/information.  Spend some time and make sure these issues are accounted for.

   With the links, make sure what you are linking to still makes sense.  Sometimes the link may still be active but the content on that page may not be relevant to the content from where it is linked.  It may also be something that just doesn’t matter anymore or is full of outdated/incorrect information.  Either way, take the time to look into this because this is something a proofreader may not catch.

5. Test and Retest Your Web Site

   Before going live with your new site, it is good practice to post it in a testing area on the live web server.  If you just test it locally or on a testing server separate from your web server you may miss some potential technical snafus.

   This is especially important with web sites containing forms, surveys, database functionality, etc.  Make sure it all works the way you want it to.

I hope this helps you avoid some potential pitfalls so you can re-launch with confidence and pride!  If you have any questions or need any help with any of these, please let us know.

If you have any other MUSTS you would like to suggest please comment below…

According to Wikipedia.com, Open Source is “set of principles and practices on how to write software, the most important of which is that the source code is openly available.”

The best source of materials about Open Source is the Open Source Initiative, a non-profit corporation formed to educate about and advocate for the benefits of open source.

On their site you can read articles about Open Source as well as the 10 principles which clearly define what is and what IS NOT Open Source.

How can Open Source technology improve the outcome of your web project?

Open Source Solutions

Open Source Solutions are products built and constantly improved by mostly volunteer coders.  Open Source Solutions can be broken into three main categories:

1. Scripting Languages such as…

   1. Perl
   2. PHP
   3. JavaScript

2. Software such as…

   1. The Linux Operating System (used most famously by Google)
   2. Mozilla Firefox

3. Web Applications such as…

   1. The ModSecurity Open Source Firewall
   2. Joomla – an Open Source Content Management System

During the development or even the pre-development of your web site or web application, you may be faced with the choice of Open Source vs. Proprietary Solutions such as .NET, the Microsoft scripting language.

With Open Source applications, you are allowed to modify the source code of the application as the need arises.

With Proprietary applications, it is illegal to modify the source code of the application. In some cases it is illegal to even look at the source code. (It’s a phrase in that license you never read.)

Whether or not you understand the technical aspects of either choice, it is important to understand the business decision you are about to make.

To be fair, we develop on both platforms. Sometimes using Open Source options is not in the best interest of our clients for various reasons.  However, we tend to be strong proponents of Open Source based solutions for our clients.

Here’s why we like open source for our clients…

1. The base source code for all applications and solutions is free and supported by a large community of developers.
   1. This means you have a large group of developers going under the hood and testing the solution from many angles
   2. The bugs are found, tested and talked about in an open forum… a lot
   3. Documentation, whether formal or informal is usually there and generally plentiful
2. You can find an Open Source Solution based on a language like PHP or JavaScript that will compete feature for feature with a proprietary software product.
   1. The difference is that this solution is free
   2. The other main difference is that you have access to the source code and can modify the product to work for your specific purposes
   3. Developers will usually charge you less if they can develop your web site in PHP instead of .NET because of the access to Open Source Solutions.
3. Why re-invent the wheel?  If you have an application need, chances are someone has either developed it or something like it that your web developers can modify to suit your needs.

Now don’t think that because it’s Open Source and Free that you will be able to go out and get a great web site for free.  Open Source simply makes finding more effective tools to build your site much easier.

I should also explain how “free” works… Nobody does anything for nothing, however the benefits here are the fact that you are not limited to one piece of software of the list of things it can do for you.  We prefer Open Source not so much for the fact that it is free, but because as we develop an application we have more readily available resources at our fingertips.

Think of it this way – just because someone hands you a free car engine, that doesn’t mean you can just drop it in your car and start driving. You still need a good mechanic to install and configure it to work in your car. You’ll also need a good mechanic to keep the engine running smoothly.

Also, when people hear free they tend to get nervous… “Who supports this at 3am when my system won’t boot?”  The reality of Open Source is that since the source code is “free” and readily available, the pool of talented developers in both the application development and support roles are plentiful.

One of the biggest benefits of open source is that nobody writes a single line of code designed to “lock in the customer.”  The economic term is “Barrier to Exit.” Remember the pain involved in leaving AOL or the trapped feeling you get with any Microsoft product.

Overall, using Open Source will save you money in development costs.  It also puts you in a much better position for future development opportunities because you are not locked into a proprietary product with proprietary support.

It’s been a buzzword for a while, but what is Web 2.0?

“Web 2.0” originated at a brainstorming session with the O’Reilly Network and MediaLive International.  Web 2.0 is basically a series of concepts and ideas that redefine the web as a platform where the individual users control their own data.  It is the use of new technology to enhance the user’s online experience.

In other words, rather than the old model where the publishers of the data were in control, this is a new paradigm where the information seekers control how the internet grows and improves through their consumption of and interaction with information.

You can see examples of this in some very obvious places, like Google.  Google relies heavily on popularity to be successful.  In order to be popular Google needs to provide useful information quickly and easily to as many different people as possible.  Google does this quite well.

Google is a platform where vast quantities of useful information are exchanged.  Since Google is such an important platform on the web, they are able to produce revenues through ad-words and PPC placement.

Common Web 2.0 Applications

Web 2.0 applications are comprised of a wide variety of software and server solutions.  They do have some common features including:

• Allows users to provide reliable content, e.g. http://www.wikipedia.com/
• Gives the users the ability to manipulate and enhance that content
• Focus on participation rather than publishing

Recognized Web 2.0 applications can include the following:

• Blogs and RSS Feeds
• Wikis
• Web Site Mashups
• SEO (Search Engine Optimization)
• Social Media Marketing (AKA Social Networking)

Let’s take a look at these individually…

Blogs and RSS Feeds

A blog is simply an online journal. The content can vary from “My Summer Vacation” to RightWingJournalistBlog.com or anything you want. Common characteristics include:

• Latest entry first
• Archives
• Comments Capability
• Timely
• Generates a Feed (more on this later)
• Web design expertise generally not needed for creating entries and comments

There’s really nothing mysterious except the name. It’s just a collection of HTML pages, usually mostly text. Anybody can do it. Even with pictures and graphics.

RSS (Really Simple Syndication or Rich Site Summary) is a format for delivering regularly changing web content. Many news-related sites, blogs and other online publishers syndicate their content as an RSS Feed to whoever may want to subscribe to it.

Some examples of popular RSS feed subscriptions that you might have seen are:

• New York Times
• The Washington Post
• USA Today

Both of Blogs and RSS Feeds are easy ways to enhance the content richness of your site.  They are also proactive ways to stay connected with your visitors and engage them in interactivity with your site by offering them the content they want on their terms.

Wikis

Wiki is an adaptation of a Hawaii word meaning “fast”.  On the internet a wiki is the next wave of Content Management technology.  It is a software application that allows users (usually the general public) the ability to create, link and edit pages easily.

Wikis can be used by many types of organizations for lots of different applications.  For example, Wikipedia.com is a public information wiki where users can add and edit information on just about any topic.

It is also in the top ten listings of just about any search on Google where some sort of source material or definition is desired.

Some businesses have used wikis as an inexpensive Intranet solution for their employees.  Others may use wikis as a place for clients to post information about a product or software package.  They can be accessed by the general public or they can be password protected.

Wikis have vastly improved the speed to which information is exchanged and updated on the web.

Mashups

The term mashup originated in the music world referring to the mashing of two or more songs together to make one new song.

On the web a mashup refers to a web application that combines content and functionality from a variety of different sites.  Mashups are mainly built using RSS (Really Simple Syndication or Rich Site Summary) and AJAX (Asynchronous JavaScript and XML).

You can recognize a mashup site by the use of many recognizable sources of content and functionality.  These sources are generally referred to as APIs.  An API is an interface that allows for external requests to be made for whatever content the site is offering.

For example, you may use APIs from sites such as these:

• Google Maps
• YouTube
• Weather.com
• eBay
• Yahoo
• Amazon

Like any other Web 2.0 apps, mashups are just another way to enhance the users experience by offering enhanced functionality and content from multiple sources.

SEO or Search Engine Optimization

We talk, write, eat, sleep and dream about SEO.  Unlike the past where all you had to do to get listed on a search engine or directory was register your site, the name of the game now is SEO.

Based on the Web 2.0 parameters, SEO is more about the user’s experience.  In order for a site to be optimized for search engine visibility it must contain well organized code and keyword rich content.

An optimized site is one that is not only optimized for search engine visibility but also optimized for an enhanced user experience.

Optimization generally consists of the following:

• Removal of bad code or any other roadblocks that will block a search engine from finding content
• Adding new keyword rich content as well as enhancing existing content
• Adding ALT attributes, proper file naming conventions and keyword rich page titles
• Adding Blogs and RSS which contain more keyword rich content
• And any other efforts to improve the amount and quality of keyword rich content

Again, the point I am trying to make here is that Web 2.0 is all about improving the user’s experience.

Social Media Marketing

If you have a computer and are hooked up to the Internet, chances are probably pretty good that you have some sort of social networking account.

Social Networking is a term referring to sites where a group of people (sometimes a very large group), usually through an account or profile, interact with one another based on their commons interests.

You may have heard of a few of these…

• www.Facebook.com
• www.Twitter.com
• www.YouTube.com
• www.linkedin.com/

In business these sites are great ways to make quick connections to contacts in an effort to promote a message, make further connections, etc.  LinkedIn.com is probably the best example of a business-centric Social Networking site.

So, what does Web 2.0 mean to you?

• It means that businesses can interact better with their clients and employees.
• It means that information is more readily available and of better quality on the web.
• It means that the old model of the publisher controlling the flow of information is dying and the new model of participation is taking over.
• It means that with look and feel less is more – no longer can you be effective with graphically heavy sites, you need to design with content and messaging in mind.

We are excited about the things to come and what it means for our clients and their online success.