February 2000   

Consumers spent $7 billion shopping online during the 1999 holiday season, according to a survey by Jupiter Communications, and graphics sold many of the products they purchased. E-commerce Web sites depend on graphics, but the success of any site, including yours, depends largely on how quickly it can deliver those graphics and related information to its visitors. Several new graphics technologies are making those deliveries faster, easier, and more effective. If you’re interested in carving out a larger piece of that $7 billion pie for your site, it’s time to notice what, until now, you may have left exclusively to the "techies" on your team.

Squeezing It In

Graphics compression, not a new concept by any means, has already evolved considerably, and is now about to take a quantum leap. Traditional methods of compression allowed Web sites to include larger images and product photos, because the compressed image resulted in a smaller file size that could be delivered to the viewer in less time than an uncompressed image.

Graphics can be compressed in several different ways -- depending on the choice of file format that you use.

• GIF: GIF (Graphics Interchange Format and pronounced either "jiff" or "gif") should be used for images with text or large blocks of solid color. The GIF format has the additional advantage of preserving transparency, allowing backgrounds to be viewed. Animated GIFs can provide small, cross-platform moving presentations such as those used in many banner ads.

• JPEG: JPEG (Joint Photographic Experts Group and pronounced jay-peg) is best for photos or complex files with multiple colors and fine detail. The format can reduce files down to as little as 5% of their pre-compression size, but the downside is that the image loses some of its data, or detail, each time the file is compressed. But the new JPEG 2000 standard currently in development will drastically reduce the amount of "loss" that can be seen by the naked eye.

• PNG: Portable Network Graphics (pronounced "ping") is a patent-free format that has been accepted as an industry standard for optimizing graphics on the Web. It was the first format to incorporate standardized color, which means that the blue version of your client's product will look the same no matter whose computer shows it. The format allows a user to see the image 8 to 16 times faster than a GIF image. A limitation of PNG is that it does not support animation. And while it is now being integrated into major Web browsers, such as Netscape and Internet Explorer, the adoption is a slow process and backwards compatibility will remain an issue.

Making It Move

The interactive capability of the Internet gives this medium a huge advantage over print. And animation and multi-media technologies can provide users with visualization of the product far beyond those in print advertisements. This can translate to more sales. New interactive technologies can also enhance customer service opportunities.

Interactive technologies you can consider include:

• QuickTime & 3-D Video: QuickTime is a proprietary digital audiovisual file format and is one of the most popular multimedia formats. Apple Computer Inc. developed QuickTime. It has multiple versions, including QuickTime VR that lets users look 360 degrees from a fixed point in space. QuickTime makes good quality video clips in a reasonable file size and can greatly enhance product sales. 3-D Video allows the viewer to take a virtual tour of a product, whether it is as large as a house or as small as an insect. A great example of a virtual tour can be found at Realtor.com. House-hunters can view the neighborhood from just outside the house, as well tour individual rooms. The 3-D application allows you to scan floor to ceiling, left and right -- requiring only the movement of a mouse. Until recently, still photos were the best technique available for viewing products on the Internet. 3-D video enables the user to have a sense of actually moving throughout the house, rather than viewing flat photos.

• Shockwave Player: Shockwave Player has been considered by many to be the Web standard for state-of-the-art media playback. It lets you view interactive Web content from your Web browser. Disney.com, Intel.com, SharperImage.com, Palm Computing, and many other Web sites use Shockwave. It is compatible with Windows 95, 98, MacOS, Internet Explorer CD, America Online, and Netscape Navigator.

• Flash 4: Flash 4 is a new technology that provides sound effects and animations. Flash graphics have the advantage of resizing according to browser window size, without quality loss. Compared to GIF files, Flash files are small, resulting in speedy downloads, even on slow modem connections. The Flash Player is the most widely distributed high-impact Web site viewer today. Popular Web hardware and software products from Microsoft, Netscape, America Online, Apple, WebTV, Prodigy, Earthlink, Network Computer, Gateway, Compaq, Disney, and many others already have Flash technology built into their products.

Coming Soon . . .

Beyond the new JPEG-2000 standard slated for release by 2002, the soon-to-be released .MNG extension is in the works for use with animated images. MNG (pronounced ''ming'') is short for Multiple-image Network Graphics. MNG is designed to provide animation capabilities that were not found in PNG. There is no release date for MNG yet, but it promises to be interesting, if it is widely adopted.

Talking the Talk

In order to make graphics work for you in selling product, you need to be able to discuss the options and ensure that your graphics and Web designers are creating compatible, rapidly delivered images. Before contracting a Web professional to design or develop your site, take some time to plan your graphics campaign.

• Know your audience: Do your best to define the population of consumers who are likely to search for what your site offers. Are they children or adults? Young or mature adults? Male, female, both? Professional users or casual browsers? Why would they be looking for this particular product? Is it related to work or home? Narrowing the focus of your potential consumer group will make it easier to make better decisions about your site design.

• Envision your site: Are you trying to entertain, or are you going to sell products? Explore other sites that have similar goals. Study the Web sites of major corporations and your competitors to determine your site's niche.

• Use graphics to convey the selling points: Think about how the product is used and how graphics can most closely simulate its use. Remember that dynamic graphics can communicate more about your product or service than multiple pages of text.

• Consider visual impact: You wouldn't use the same colors and animation techniques on a site selling office furniture, as you would for a site selling sporting equipment. Decide whether your site would benefit from video and other animation. Again, think about your audience and what you believe might be appealing to the segment of the population most likely to visit your site.

• Design for your "lowest common technology denominator": Many computer monitors are still set to show only 256 colors, and the colors they see can be limited by browser choice and platform. In other words, a royal blue that looks good to a Windows user using Internet Explorer may not look so hot to a Mac user viewing your page with Netscape. There are only 216 colors that show up consistently between platforms. If you aren't sure that your audience has newer computers and that they know how to change their display properties themselves, rely heavily on those 216 colors to form your color palette.

• Limit your graphics to about 50 kilobytes (KB): If you want your pages to load quickly, size really does matter! Less than half of retail Web site visitors have modem speeds of 56Kbps or more. And if your page doesn't display in 30 seconds or so, expect that many of your visitors won't opt to hang around. Business-to-business sites can usually afford a larger page size because connection speeds are faster. But if you're building a retail site for home users, keep it small.

• Limit media playback and animation techniques: Rely on special techniques such as Shockwave and Flash for emphasis, and don't overdo. Too much of a good thing can mean that visitors without these technologies will feel alienated. Always provide navigation alternatives that don't rely on these technologies so that visitors can move through your site without them.

Walking the Walk

Whatever your graphic goals, make sure that you consider the overhead. The days where flashing "new" buttons and flaming CD icons were good things on the ‘Net are long gone. These days, having a Web site isn’t so cool that you can get away with just any site. Your site has to graphically resemble your offline business. While that is difficult to achieve with existing compression techniques, it’s necessary. And Internet bandwidth and new technology are quickly converging to allow you to really put your best foot forward with your customers without having to pay exorbitant sums for photo manipulation and graphics work. Talk to your design team about new approaches. Allowing your potential customers to see how your products really look and work is your first step on the path to more sales and fewer merchandise returns.