We recently conducted a pilot study on the usability of automotive mobile websites.  This evaluation is patterned after our Manufacturer Website Evaluation Study (MWES) which looks at the usability of desktop automotive websites.

Kia, Mazda, and Volkswagen were the top performers among the manufacturer mobile sites, balancing the sometimes competing elements of navigation, information/content, appearance, and speed.  We can look to these industry leaders for guidance on how to provide a good experience for today’s mobile shoppers.

Navigation
Mazda’s mobile site scored highest in navigation, primarily because they have their homepage set up to access all the same things you can access on their traditional site: shopping tools and direct access to their models.  It only takes two clicks to get to detailed, comprehensive information for the specifications of any individual model.  They also make good use of color and icons to help visitors find the shopping tools.

Vehicle Images
Kia and Volkswagen did a good job of providing a variety of large, high-quality photos on the mobile site, both in the galleries and the performance details for VW.

Acura and Lincoln, on the other hand, didn’t score as well in the vehicle images attribute.  Acura provides one image in the model overview and has a limited gallery, while Lincoln’s feature images are so small that it is difficult to see the vehicle details.

Appearance
Both Honda and Hyundai score well in appearance.  In addition to providing nice images that attract the shopper, they each establish visual focal areas around the navigation elements.  Honda uses colored bars to focus the eye, while Hyundai uses distinct frames to organize its content.

Options/Features/Specs
Volkswagen’s information is well-organized, making it easy to access a large amount of information quickly.  The site has four distinct tabs available to get to features details.  And, they are able to provide extensive, yet concise, details using either bullets or short paragraphs accompanied by images.  Shoppers can quickly research related information in categories, balancing fewer clicks and reduced scrolling with the availability of comprehensive information

Infiniti’s and Mercury’s mobile sites also score well on options, features, and specifications.  Infiniti translates its high-scoring trim information from the traditional site to the mobile site.  It also reduces the length of its trim lists by not repeating equipment information from a previous trim level.  Mercury provides its features in a grid to help with comparing across multiple trims at a time.

While only a small percentage of shoppers use the mobile Internet in the vehicle shopping process, it is not enough to simply have a mobile site — you need to have a good mobile site.  When designing mobile sites, keep the same basic principles (navigation, appearance, information/content, speed) in mind as when designing traditional sites.

Disclaimers and fine print are an expected part of product information in any industry.  These additional details are used to clarify claims about features or services that may be restricted, limited, or otherwise requiring additional clarification.

Though this information might not be the main point of research or interest on a website, the requisite “fine print” should not be forgotten content when it comes to site layout and usability.  Across automotive manufacturer websites, there are a variety of strategies used to help shoppers get to these details.

There are three main categories that most OEM disclaimers fall under:

• Listing footnotes at the bottom of the page;
• Linking to specific disclaimer information in a fly-out or pop-up;
• Linking to a separate list of all disclaimers.

From the J.D. Power and Associates Manufacturer Web Site Evaluation Study (MWES), we have learned many lessons about Navigation on OEM websites.  Overuse of clicking, scrolling, or jumping between pages or long blocks of text can quickly confuse shoppers and distract them from the main goal at hand: researching vehicle information.

With these lessons about usability in mind, below are my observations on the different strategies for displaying disclaimers on OEM websites.

Listing footnotes at the bottom of the page
The majority of OEM websites list footnotes at the bottom of the page.  There are a few different ways of implementing this strategy.

BMW has numbered footnotes that are referenced at the bottom of the page.  The advantage is that this keeps related content close together.  However, shoppers are required to scroll up and down to view both features content and the disclaimers.

On the Dodge website, numbered footnotes are referenced behind an additional link at the bottom of the page labeled “Legal, safety and trademark information concerning the numbered items above.”  Shoppers must then click on the link to reveal the list, creating an extra step for shoppers to access the disclaimer information for items listed on the page.  This link reduces clutter that could be caused by lengthy text on the bottom of the page, but it also makes more work for the shopper who is looking for this information.

Lexus has hyperlinked footnotes that take shoppers to the bottom of the page where all disclaimers are listed.  The advantage of having the disclaimer information at the bottom of the same page may be outweighed by the amount of scrolling required for this strategy.  Shoppers have to jump back and forth to view a disclaimer at the bottom of the page and then scroll back up to find their place again to continue researching information.

In these examples of listing footnotes at the bottom of the page, information is available in a location where the details are relevant without competing with features information.  However, the amount of scrolling to connect footnotes with the disclaimer can interfere with the goal of an uninterrupted research process.

Linking to specific disclaimer information in a fly-out or pop-up
The next most commonly used strategy is to link to specific information from a fly-out which only references a particular disclaimer.  This links the shopper to relevant information at the point of interest without taking them away from their research path.  A word of caution would be to make sure these footnotes for disclaimer links are not confused with links to additional features information.

Nissan and Mercedes-Benz incorporate this additional information into their sites without distracting shoppers from the research process.  In my opinion, this is a good strategy for providing disclaimer information even though it is not the most commonly used.

Linking to a separate list of all disclaimers
A handful of sites provide a separate link to all disclaimers for information found across the site.  Ford provides shoppers with a link to “View Additional Disclosures” and then provides all disclosures in one comprehensive list.  The advantage is that shoppers can quickly access this content from any point on the site.  However, they must also scroll to the relevant information each time they are interested in additional disclaimer details.

Though there are a few other strategies, the majority of OEM sites fall into one of these three categories for displaying disclaimers on their website.  After looking across the industry to come up with these groups, I think that the approach that has the least amount of clutter and potential confusion is the link to specific disclaimer information in a fly-out or pop-up.  That is, as long as there is not too much competition with other research links.  As in most cases, these decisions should be related to the functionality of the site as a whole and what works for one site might not be the best solution for another.

However the strategy for incorporating disclaimers is implemented, best practices of design cannot be ignored.  There are advantages and disadvantages to each strategy, so OEM sites—and their legal departments—must weigh how to best give their shoppers quick access to disclaimer details without interrupting the research and shopping process.

This spring, Steve Jobs reignited a long-standing debate between Flash advocates and the technology’s detractors.  Jobs posted a long letter on Apple’s site explaining, point by point, why Apple chooses not to support Flash on the iPhone, iPod, or iPad.  Since the resurgence of this Flash debate (but really, since the debut of the iPhone), major brands have been grappling with the most efficient way to provide a mobile Web experience for their iPhone and iPad users.  Some brands provide a separate mobile site for mobile users.  Others choose to make their primary site mobile-friendly.

Over the last 18 months, we have begun to see automotive manufacturers quietly scaling back their Flash implementation.  In some cases, brands are dropping their Flash sites entirely and launching HTML-based sites.  For example, for Wave 2 of the 2009 Manufacturer Web Site Evaluation Study (MWES), which was fielded in April 2009, Acura converted its all-Flash site to all-HTML while maintaining many of the same navigation features.

Initially, Acura’s MWES scores declined a bit (-7 pts overall, -17 for speed, -1 for navigation), but still ranked #9 overall.  The very next iteration, Acura jumped back up to #3 (+22 overall, +20 speed, +19 navigation).  Not only has their site usability excelled with the HTML implementation, but Acura is likely deriving great benefits in terms of cross-platform usage.  It was the first OEM brand site that functioned as-is on the iPhone, and despite some increased page weights, it seems to load quickly for MWES users.

OEMs Scaling Back on Flash Usage

Acura’s transition from an all-Flash site to an almost-entirely HTML site seemed like a rather bold move 1½ years ago.  However, such transformations are becoming more common in the iPhone/iPad era.  In March of this year (even before Steve Jobs published his Flash manifesto), Virgin America dropped Flash in favor of HTML.  The company’s goal in choosing HTML was to provide a seamless experience for customers, including those who choose to check in for flights with their boarding pass on their phone.  Virgin’s CIO Ravi Simhambhatla commented to The Register website that, “Flash is really, really good, but as long as you can keep the hardware controlled…If the hardware you are trying to put your product on isn’t [controlled] then Flash is questionable.”

We have seen evidence of this phenomenon in the MWES study.  The performance of Flash sites can vary wildly among different computers, a flaw which often negatively impacts an OEM site’s usability.  Perhaps OEMs and their agencies have recognized this as well.  In the last year I’ve noticed that more OEM sites are moving away from pure Flash usage, particularly in their menus and primary navigation.  Instead, Flash is more often being reserved to enable true interactivity.

Out of the 33 OEM brand sites measured by MWES:

• All flash: 4 (Jaguar, Kia, MINI, Scion)
• Mostly Flash: 10
• Mostly HTML: 18
• Entirely HTML: 1 (Acura)

Many of the mostly-Flash sites utilize HTML in their configurators (e.g. Infiniti, which is a strong performer across the board).  The mostly-HTML sites tend to utilize Flash in their homepage and/or model page splash areas (e.g. Jeep, Lincoln).

As a category, the all-Flash sites performed worst for navigation, speed, and overall score.  Among the other categories, there’s no clear pattern of which combination of Flash and HTML works best.  In other words, it’s not necessarily the Flash – it’s how you use it.

For instance, Cadillac’s completely non-standard navigation of moving pieces requires Flash’s interactivity, but the result is a nearly un-usable interface.  And Cadillac suffers, finishing last in MWES.  Similarly, Scion uses Flash to enable its microsite masquerading as an OEM brand site and finishes at #32, beating out only Cadillac.  On the other hand, MINI’s all-Flash site features some quirky activity while maintaining a high level of usability, giving the site a ninth-place finish overall.

Comparing Lincoln vs. Mercury also shows how prioritizing navigation supersedes the choice of technology.  Each site used to have the exact same navigation scheme, but Lincoln recently gave its navigation a minor overhaul.  Lincoln has also shifted to become more HTML-based over the past year.

• Lincoln is currently ranked 6th for speed, 8th for navigation
• Mercury is currently ranked 10th for speed, 16th for navigation

It’s unlikely that Lincoln’s score improvement is due in any great part to the switch to HTML.  Rather, Lincoln’s efforts to simplify its navigation are probably responsible for the improvement in score.  For example, navigating Lincoln’s Features section is dead simple, and the images are large and appear above the fold.  Mercury, in contrast, requires users to look below the fold, awkwardly select different rectangular images, and then view a small image with text.  In general, Lincoln has gone the same route as Hyundai and dramatically cut down the number of links offered per-page.

What’s Next in the Flash vs. HTML Battle?

HTML5 is the long-in-coming alternative to Flash that has been anointed by Steve Jobs.  Some features of HTML5 are expected to be ready for use by the end of 2010, but based on what we’ve observed of OEM Web development behavior, OEMs are traditionally not early adopters when it comes to new Web technologies.  However, it is possible that the pressure for cross-platform usage may accelerate HTML5’s adoption.

Flash will likely continue to face some of the same pressures it always has – among them cost, variable performance on different systems, and the closed nature of its system.  Virgin America’s CIO cited all of these reasons for its decision to switch to HTML.  He commented to The Register that Virgin’s site wasn’t using enough of Flash’s capabilities to justify the continued use of the technology.  Rather, he felt that HTML’s free, open system was “good enough” for delivering the site’s animation and overall user experience.

Mercedes-Benz is the latest OEM to enter the debate, having recently abandoned Flash in favor of HTML.  The new site looks and feels almost exactly the same despite a completely re-engineered user interface.  The next wave of MWES (to be released in early 2011) should reveal whether the brand can achieve some of the same improvements we saw this wave with Acura.

Marketers and their Web development teams are very aware that the initial launch of a Web site will never go perfectly.  Flaws and inconsistencies, previously hidden, will suddenly become glaring problems.  As we’ve seen over many waves of the Manufacturer Web Site Evaluation Study (MWES), continuous improvement is the way that most sites improve their user experience; few are as lucky as Honda to debut a new site near the top of the MWES rankings.  In the 2010 MWES – Wave 2, which was released two weeks ago, we found that three of the four brands that redesigned this wave performed worse than the prior wave.  Let’s take a quick look at where these brands fell short, and then highlight how Hyundai’s redesign bucked the trend.

Land Rover – Awkward navigation; reduced emphasis on imagery

This wave, Land Rover dropped 36 points overall, 59 points in navigation and 43 points in appearance.  In the overall MWES ranking, Land Rover now ranks #28 out of 33, down from #12 last wave.  The primary problem with this redesign is that there is no dominant navigation scheme.  Shoppers can probably figure out where to start, but there is no clear path for methodically browsing the site’s content.  Examples of areas that may be creating headaches for shoppers:

• Many links do not look like links, creating the illusion of fewer navigation options
• Features and Specs page navigation is completely different from model page navigation, even though the same content links are offered
• Shoppers have to make a decision among 30 links on the homepage – an overwhelming task
• Gallery images are relatively small and the slideshow is excruciatingly slow

Volvo – Cluttered navigation and non-standard terminology are confusing shoppers

Volvo’s redesigned site fell by 19 points, with the vehicle configuration process falling by 32 points.  The site is now ranked #26 overall out of 33 sites, down from #21.  This is a good example of a site that may benefit noticeably from continuous tweaking.  Currently, however, navigation once again hampers the site experience.  Specific examples:

• Way too many navigation areas (links, menus) create a sense of clutter
• Shoppers may not immediately know where to find the information they are seeking.  For instance, the model level links contain non-standard terminology such as “5 Things to Know” and “The Details.”
• Duplicative-sounding links (e.g., “Style Your XC90” vs. “Build Your XC90”) create confusion
• The configurator actually contains too much information – the entire bar of information below the configurator navigation is redundant and adds clutter

Cadillac – User experience sacrificed in favor of branding

Cadillac fell almost 30 points overall this wave, with their biggest drops in Appearance (-68) and Navigation (-40), placing them last in the MWES overall ranking this wave.  The best way to describe the result of Cadillac’s redesign is to say that the new site is a microsite masquerading as an OEM brand site.  This is not a good thing.  Overall, the site’s poor usability makes it tough to get excited about the vehicles.  A few reasons why:

• The collage-style navigation on the home and model pages is unique, but difficult to use and does not emphasize the aesthetic beauty of the vehicles
• Menus and content move around as different items are selected – extremely confusing for shoppers
• The layout makes it difficult to distinguish primary content from secondary links and information, particularly in 1280×1024 resolution
• The site’s appearance was very dark this wave, making it difficult to read text, find links, and see the images

Non-intuitive navigation is the common factor contributing to the poor debuts of these three sites.  The new navigation schemes, regardless of the planning and testing behind them, need time to improve from a series of fine-tuning tweaks and revisions.  Compounding the issue is the fact that designers often seem compelled to start from scratch and/or try something completely new in an effort to stand out.  Unfortunately, this methodology can backfire, requiring years of tweaks to reach or exceed the level of usability of their predecessors.

Hyundai – Simplicity triumphs

Although reduced usability following redesigns is the norm, it’s not the rule.  Hyundai’s redesigned site showed substantial improvement across the board – particularly in navigation and speed – and finished at #7 overall, up from #28 last wave.  Hyundai’s success clearly stems from a focus on delivering a quick, simple, and informative site experience.  A few examples of this focus on usability:

• Rather than cluttering the site up with more links and content, Hyundai actually simplified the site – going from 19 links in the top navigation down to eight, focusing shoppers’ attention and establishing a clear navigation flow
• The site’s resolution changed to 1024×768 (from 800×600), giving designers room to add more content as well as the breathing room to avoid clutter and the need for small fonts
• The drop-down menu is easier to read – especially the links in the model-level flyouts
• The model-level navigation flow is straightforward

Usability, particularly through intuitive navigation, must be kept in mind as sites are redesigned.  That isn’t to say that all manufacturer websites have to look the same.  Websites can and should have a brand identity much like the vehicles they are showcasing.  The danger is that in striving to be different, it can be painful to stray too far from what shoppers expect from your sites – making it difficult for them to find the information they seek.

Five years ago, it seemed as though every other OEM was using hot spots.  Hot spots allow site designers to graft detailed information onto a high quality vehicle image, often right on the model landing page.  The example below is from Chevrolet, circa late 2007.  Each plus sign reveals its content when moused over – clicking links to a full feature description with text and an image.

I’ve never liked hot spots, mostly because they force the user to hunt for information.  In this Chevy example, that means mousing over twelve distinct hot spots!  It’s also impossible to quickly scan.  The interface may be appropriate for a microsite or experience section, but the primary vehicle research page should not require so much effort to use.  In the past, hot spots have contributed to problems with site navigation (for Chevy and others) as measured by our Manufacturer Website Evaluation Study (MWES).

Although hot spots have faded in popularity, they haven’t disappeared completely – for instance, Mercedes-Benz delivers its vehicle feature descriptions via hot spots.  I do like the way the site includes the category name for each hot spot rather than the uninformative plus signs.  But despite Mercedes-Benz’s improvement in its navigation score during the most recent wave of MWES, I believe it could do even better with a more intuitive interface for model-level information.

Mitsubishi recently redesigned its entire brand website and actually brought the hot spots back!  The overall navigation performed well in MWES (ranked 11 for navigation) but I would still prefer to access vehicle detail without all the clicking!

The top sites for navigation present feature information in a straightforward manner – text and links.  It’s not flashy, but it is effective.

I’ll probably have to suffer through hot spots for years to come, but at least I have other options.

Websites that maintain a focus on usability along with branding and design features successfully satisfy shoppers, according to the J.D. Power and Associates 2010 Manufacturer Website Evaluation Study (MWES)—Wave 2 released today. However, the semi-annual study, now in its 11th year, finds websites that focus primarily on brand image and interesting design features can actually hinder shoppers in their search for information when usability takes a back seat.

The Cadillac and Scion websites are designed with an edgy, branding feel; however, both sites score lowest in the study’s appearance measure, in addition to ranking significantly below the industry average in every other measure: information/content, speed, and navigation. In the left-hand navigation of Scion’s home page, links to things such as a boom box and options for choosing the website background distract shoppers from vehicle shopping. Rather than a traditional pull-down menu, Cadillac’s menus appear inside an outline of the Cadillac badge that flips around forcing shoppers to learn an entirely new navigation scheme.

“Sites can miss the mark when traditional navigation is ignored in place of interesting design features.  Shoppers expect sites to function a certain way based on their experiences with other websites,” said Arianne Walker, director of marketing and media research at J.D. Power and Associates. “Failing to follow navigation conventions often makes it difficult for website shoppers to find the information they seek.”

Two of the highest scoring sites, Honda and Kia, each successfully focus on usability—allowing shoppers to access the information they seek in the shopping process quickly and easily. Due to their focused usability efforts, both Honda and Kia score significantly above the industry average in each of the four MWES measures.

“The Honda and Kia websites are great examples of incredibly straightforward sites that focus on getting appropriate information to shoppers easily and quickly, which has been a great recipe for their high MWES rankings in the recent past,” said Walker.

MINI, like Cadillac and Scion, also includes branding-oriented and untraditional navigation menus, design elements, and images on their website. However, MINI ranks significantly above the industry average by balancing their non-traditional elements with more traditional navigation menus throughout the site.

“The desire to provide a sense of the brand and a personality for the vehicles on the website can and should be considered,” said Walker. “But success in this area is also highly dependent upon balancing that branding feel with good usability, which MINI has achieved this wave of MWES.”

Understanding the critical importance of navigation is possible through this semi-annual study, which measures the usefulness of automotive manufacturer websites during the new-vehicle shopping process by examining four key areas: speed, appearance, navigation and information/content.

Honda ranks highest among automotive manufacturer websites for usefulness in new-vehicle shopping with an index score of 871 on a 1,000-point scale. This wave of MWES marks Honda’s 3rd time in the last 4 waves that they have delivered the most useful OEM website in the industry.  Following Honda in the rankings are Kia (868), Mazda (866), Acura (860), and Infiniti (860).

The 2010 Manufacturer Website Evaluation Study—Wave 2 is based on evaluations from more than 10,621 new-vehicle shoppers who indicated they will be in the market for a new vehicle within the next 24 months. The study was fielded in May 2010.

The earliest automotive mobile Web sites emphasized function over user experience. As more sites have been launched, packed with more advanced content and functionality, usability has the potential to be a differentiator. Mobile sites that work across all devices are at a disadvantage since they are by necessity text-heavy and graphics-light. Sites designed for platforms such as the iPhone offer greater flexibility, albeit at the cost of not being available to all mobile users.

These three dealer locator results come from basic sites. Buick doesn’t even give phone numbers, which is an odd decision on a mobile site. Mazda goes two better by linking to the phone number and offering a map.

Advanced sites provide far more robust tools. These three look better, are more readable, and easier to use than those in the prior example. Saab and Scion also have intuitive icons that represent further calls to action, e.g. phone, view on map, email.

Mobile photo galleries represent a greater usability challenge. These three mobile sites employ image thumbnails that site visitors select to view larger images. One downside of this approach is that users must continually click back to the thumbnails page in order to view another image. Further, the thumbnails are so small that it can be difficult to get a sense of what you’ll see before actually clicking it. Kia and Infiniti exacerbate this issue by using dark or nearly monochromatic images. On the other hand, the images on Car and Driver bring in more color and contrast, which makes them much clearer even in thumbnail form.

Another approach is to present one image at a time with previous and next buttons/arrows to advance. Of the three below, Volkswagen has the largest and most compelling images. I like GMC’s text descriptions, but an image counter would be a welcome addition.

Lexus and Toyota have created two completely new, user-friendly approaches to the mobile photo gallery. Lexus puts four large images on each page, which makes browsing simple. Toyota’s gallery allows the user to advance by sliding the image to the left or right, just as you would on the iPhone’s built-in photo albums.

Usability should be built into the creation (and testing!) of any Web site, mobile or not. It may be even more critical on mobile sites, since recovering from an errant click is more time-consuming (even on 3G). And users increasingly have other options.

In the August OAR-DE (downloadable PDF), I discussed Web site usefulness in the context of dealer sites. Usefulness includes the efficiency with which visitors can use the site, the quality of the content, the relevance of that content toward the user’s needs, etc. Even though dealers generally don’t design their own sites, they must still be involved to ensure that their vendors create functional and useful sites. While templates can be restrictive, even minor tweaks can enhance a site. The J.D. Power and Associates model for site usefulness is comprised of Information/Content, Navigation, Speed, and Appearance.

Information / Content
Dealers have many options regarding their Web site content. At a minimum, contact information should be available everywhere. Other key elements include inventory, request for quote, and even in-depth vehicle research. But all this functionality must be incorporated in such a way that it doesn’t detract from overall usefulness. For instance, why have a great inventory tool that is updated regularly if no one can find it?

Navigation
Navigation is about how easily site visitors are able to find the information/content they want. Remember that most Internet users scan web pages rather than actually reading them – extra clicks are a sign of problematic navigation. The following is a brief summary of major navigation considerations.

• Visual consistency of menus, layout, headings, etc. ensures that site visitors don’t have to relearn the navigation. For instance, the main menu should remain in the same location to provide a consistent navigation touch point.
• Menus and links. All menu items and link labels should be descriptive and easy for the average consumer to understand.
• Font size. Use the largest font possible. 12-pt text is ideal for most users.
• Contrast. The greater the contrast between the text and background, the easier it is to read. Black text against white is best. Avoid gray text against gray.

Appearance
Online, as in the real world, a professional appearance implies that the customer will be treated professionally. The branding of the dealership itself (versus the vehicles it sells) is also part of appearance.

Dealer sites should also give people the impression that the site is updated regularly – don’t leave up service coupons that expired 6 months ago. This may also inspire greater confidence that dealer representatives will be responsive.

Speed
Speed goes beyond technical factors like page weight and server load to encompass the user’s perception of the site’s speed. For instance, visitors expect home pages to load quickly and will abandon sites that don’t load within seconds. On the other hand, Internet users understand that advanced content like video and inventory search are slower to load – even then, tasks must complete in a reasonable period of time.

The navigation setup also impacts site speed perception. If visitors spend a lot of time looking for information (or can’t find it), they have a negative perception of the site’s speed. In other words, poor navigation = extra clicks = poor perception of site speed.

Putting it into Practice
To illustrate these concepts, I audited several major dealer Web sites. These are all highly functional sites with good content, but a few tweaks could improve all of them even further.

Pacific Audi

Gillman Hyundai of Austin

Bill Heard Chevrolet

One word – Flash. Don’t get me wrong. Flash and other Web technologies like Ajax and Javascript are valuable tools in a Web designer’s arsenal. But when Flash’s siren song distracts a Web design team from usability concerns, future site visitors are the ones who suffer.

Over-use of Flash has created a fairly negative attitude among site visitors towards Flash (and other technologies that look similar on the user end). I’ve seen many verbatim comments from OEM site shoppers who react negatively to site features that they perceive to be Flash-based. And when site visitors are noticing Flash implementation, they are likely to also start theorizing about Flash’s impact on site speed.

In short, Flash should quietly enhance the user experience, not BE the user experience. If you play your cards right, your site visitors should be engrossed in the site’s content, and not thinking about the technology that’s delivering it.

Sometimes, though, the allure of what Flash can offer is too much for a Web development team (or client) to resist. Consider the current Pontiac site. The model configurator offers a deluge of Flash-based tools – changeable music/background options, rotating imagery, flyover pop-ups, standard pop-ups, and more. The implementation of these features is so overwhelming that Pontiac shoppers in the most recent wave of MWES* ranked Pontiac’s configurator as the least useful out of the 36 OEM site configurators.

GMC’s model page is another example of a site using Web design features that can divert shoppers from their primary purpose. A rotating slideshow catches the eye at the bottom of the page, a rapidly refreshing marquee in the center of the screen flashes the model’s accolades, and a rotating icon in the corner of the page encourages shoppers to view interior features.

With all of this motion occurring simultaneously, shoppers must stop, disengage from their shopping process, and address the blinking objects. To be sure, there are appropriate times and places for motion and blinking on Web sites, but having three such features at one time succeeds only in pulling site visitors in three different directions – in this case, away from the main content on the page.

Flash is a ubiquitous technology, and many OEM sites use it effectively. Acura, HUMMER, Honda, and Lexus have seamlessly integrated Flash and other Web design tools into the architecture of their sites, resulting in a nimble user experience that is modern and appealing. The key difference between these sites and others is that their site design provides a smooth experience without calling attention to the code and technology delivering the experience.

*J.D. Power and Associates 2008 Manufacturer Web Site Evaluation Study Wave 1

On this blog, we frequently discuss the tension between usability and branding on OEM sites. The same tension exists on dealer sites, but may be even more important to manage because of the lower-funnel nature of many dealer site visits. In short, you don’t want your Web site to irritate a shopper who is thisclose to purchasing.

Now that most dealer sites have largely left behind the hallmarks of Web 1.0 (neon green text and blinking GIFs, anyone?), the current crop of dealer sites has evolved to offer a variety of contemporary page designs and layouts. The most effective site designs are those that are able to achieve both a dealer’s sales and branding goals at the same time. But what are those goals?

Dealer Site Goals
From a simple sales perspective, dealers want their sites to drive traffic to the showroom and encourage shoppers to submit a lead. From a branding perspective, dealer sites should have the goal of supporting any existing offline branding campaigns, from a jingle to a mascot. Beyond supporting existing ad campaigns, the dealer site should also aim to engender trust in the dealer’s knowledge and sales practices.

The following are examples of dealer sites that range in their ability to achieve both sales and branding goals without one negatively impacting the other. All of these sites have a robust selection of content, but differ in the way this content is organized and offered.

Examples
First Kia is an example of a dealer site that may be unintentionally sacrificing usability to branding. A promotional pop-up that appears immediately upon load, complete with animated fireworks, dwarfs the Contact Us link and blocks main navigation fly-outs. Below, an animated monkey (perhaps the dealer mascot?) wanders around the bottom of screen, next to three other flashing links.

A visit to Keyes Toyota’s site starts off on a similar foot. A branding-oriented video loads, which shows sunny California images while playing the dealership’s radio jingle (one that successfully sticks in your head for hours). The site offers plenty of information, but like First Kia, places cartoonish links that strongly resemble advertisements around the periphery of the site.

In general, our OEM site research has found that shoppers consider animations a distraction and prefer to opt in to site videos. Moreover, flashing and cartoonish images are commonly found in banner ads, site features that shoppers familiar with the Web may automatically ignore. Unfortunately, First Kia’s biggest link to submit a lead is one of these flashing tiles, which may hamper the site’s goal of encouraging RFQs.

Power Volvo of Irvine takes the opposite approach and prioritizes usability to the point where branding on the site is non-existent. Shoppers can immediately and easily search inventory, request a price quote, investigate specials, or simply research a vehicle. All dealers would do well to examine this site’s efficient design and quick access to information.

At the same time, the site is clearly a part of a larger dealer organization and uses a standard site template. There is no link to learn “About Us”, or any hint to the dealership’s relationship to the local community or its customers. The lack of dealership branding leaves the site with a cold and informative appearance – that could probably benefit from an animated monkey!

Cuesta Cadillac Saab does a better job of balancing usability and branding concerns. The site has a dominant navigation bar across the top of the page, with a concise number of headings that are also drop-down menus. The site clearly expresses its pride in the OEM brands it sells, and a rotating home page image welcomes shoppers to Cuesta Cadillac Saab, “Where our friends are our customers and our customers are our friends.  The home page also includes a link to Why Buy Cuesta Cadillac Saab. The biggest design problem on this site, in my opinion, is that it doesn’t use the words “price quote” anywhere on the home page, a feature that may increase the lead submission rate.

Your Thoughts?
The tension between branding and usability is not unique to dealer sites, but it is an area that is still developing as dealer Web sites mature. What have your experiences been as you’ve balanced branding and usability on your dealer site? What pitfalls did you encounter, and where have you had success?