Sonar Studios

Back in the late 90s and early 2000s websites were littered with buttons and links stating “Best if Viewed With…” Most of the time, that would end with “Internet Explorer.” However, there would be the rare instance where it would read “Netscape Navigator.”

These labels were necessary because even though IE and Netscape were the browser powerhouses of the day, they did not share standards when it came to development. What worked in IE didn’t always work in Netscape and vice versa. Developers would usually cringe when a project manager or exec said the new website or webapp had to work in both browsers. It meant a lot of extra work, and in some cases, even building two separate sites and using javascript to direct traffic to the appropriate site based on the browser being used.

Now we’ve reached a level of evolution where we have CSS standards and HTML standards giving us a plethora of great options when it comes to designing. You’d think after being nearly a decade removed from the Netscape/IE wars we wouldn’t have to worry about a “Best if Viewed With” tag, right?

Believe it or not though, you can’t always assume that what you design will look the same in all browsers. What looks right in Firefox may not appear the same in IE or Chrome even when you are using strict HTML and CSS standards and guides. While you don’t necessarily see the “Best if View With” tags nowadays, you can see in the source of the file links to stylesheets and often see a special link to an IE stylesheet to make the page look right (or similar) in one or more versions of IE.

I guess the good news is that Firefox and Safari are very similar in how they display. Chrome, while it does have some quirks, isn’t too drastically different from them. However IE, with it’s many versions that linger on the internet (6, 7, 8, 9, and soon to be 10) is the exception, and an exception within itself since different versions have different standards and compatibility issues.

Now that HTML5 with CSS3 is beginning to make it’s mark on the world, those issues become even more apparent. Firefox and Chrome shot out of the gate in recent releases with great HTML5 support, and even have earlier versions supporting great CSS3 features. IE, on the other hand, has very limited CSS3 compatibility, if at all in previous versions, and IE9, while ‘more modern’ still doesn’t hit the mark when compared to other browsers, with a caniuse.com test ranking IE9 with only 61% of all web standards compatibility (compared to Firefox for at 87%).

It’d be nice to simply say “forget about it” and design for the other browsers. Add in that html5test.com shows IE9 passing only 130 tests (out of 400) as compared to Firefox passing over 250! Considering HTML5 has a big “coolness” factor closing the gap between standard web pages and the interactiveness that Flash brought to us – that’s a big deal!

So why does any of this matter? Can’t we just design and build what looks good and leave the browsers to battle out a Darwinian competition so only the strong survive? That’d be nice and it worked between Netscape and IE – with IE being the victor. However, now, it’s not so simple. So many choices, and IE comes installed automatically with Windows… In fact, according to a March 2011 survey (w3counter.com), IE still holds nearly 40% of the overall market (counting IE 7 and 8), but Firefox is closing in at about 30% and Chrome is gaining ground as well. Safari and Opera round out the top 5 browsers.

Rumor is that IE10 may fix much of the issues currently faced by IE9, but we all know how rumors can pan out. So the real dilemma for any web designer and developer now is how do you take advantage of the advancements at your fingertips without alienating nearly 40% of the potential market? Do you continue to create custom files for those browsers that don’t quite cut it at the moment? Do we go back to adding “Best if Viewed With?” Or maybe, we need a “Best when not viewed in _______” (you fill in the blank).

I guess the good news is, until there exists a single set of standards that all browsers adhere to, there will be plenty of custom tweaking work for us designers and developers to do. Oh, and don’t forget to test your work in all browsers… because even if you don’t, it’s highly likely your client will – intentionally or not!  browsershots.org might be able to help you out.

<!–end of line–>

This is a hands-on whirlwind tour of what it takes to make a video commercial. It is not a step by step guide, but a summary that will give you an outline, list of practicals and a few tips that are necessary for making your vision become reality.

When making a commercial, you first have to decide on the marketing objectives.  Once those have been firmed up, the script must be written, the cast chosen, and you are on to the production of a commercial.

Permits & Permissions
On shoot day, the first thing that can interfere with the process is a forgotten permit or permission. Long shoots, especially in or near residential areas or public locations, can draw unwanted attention, which can cause authorities to shut it down. Then there are issues of continuity which sometimes cannot be fixed, and the entire commercial must be reshot. Because of this, the production company must take the time to review the bureaucracy of the shoot on shoot day.

Make-up
Make-up is usually done while the lights are being set up, but long takes can require reapplication because lights on a shoot are especially bright and hot. Sweat causes nasty reflections on camera, so many times the process must be interrupted to reapply make-up. This time is often not taken into account at the beginning of many shoots.

Coordination
Coordinating the many pieces of production, from keeping the boom mics out of the shot to working the correct angles for the shot, requires many more takes than you might think. The slightest error by any one person in the chain can ruin a take, and perfection from many people requires a combined effort that takes hours to synthesize.

Post Production
After all takes have been shot and run by the client and up the chain of command to make sure that all objectives and issues of company branding have been resolved, the video goes to the editing department. The best takes are spliced into a recognizable coherent plot-line, the fat is cut, and music, voice overs, and digital effects are added. Mistakes can be fixed in this stage, although it is not preferred.

Approval
Once a commercial is put together in final form, it is usually run past the marketing department again and through a round of research and focus groups. Once approved, your commercial is ready for general consumption!