Some of the best uses for the Web are the extension of corporate image, customer relations, and access to information that the Internet so conveniently offers. This chapter examines some well known and not-so-famous companies that are doing innovative
Web sites to great success.
The Web design lessons here are many, including the importance of promotions as exemplified by JCPenney's site, the powerful technique of GIF animation that Bloomingdales does a beautiful job with, effective use of <meta> elements on IBM's home
page, and the value of global presence as expressed by Toshiba. I continue with practical tips on how to mix background textures and flat colors on the Sedgwick China site, and how to cleverly avoid looking amateurish while parts of a Web site have yet to
be finished. Nike has done the Web justice with its treatment of this. With Beaudry RV, you'll think about themes and how they can drive a Web site, and learn how to color match links by finding hexadecimal equivalents of RGB values at Konika Business
Machine's site.
Customer service is an important function of Web sites, and MCI does it very well, offering a very progressive and convenient method of providing customers with on-demand access to account information. Finally, Gerber Optical will warm you up with a
little hot Java, and see how fun and easy it is to add simple applets to a Web site with style, as well as functionality.
Figure 11.01. JCPenney's home page.
Since 1902, JCPenney has been a household word for most North Americans. Now, with a global online presence, this stalwart company has entered the world market with a bang. Secure online shopping, gift and wedding registries, sales, and corporate
information are all available from this Web site with a simple mouse click.
I was browsing through companies with a Web presence while doing research for this book, and what drew me to the JCPenney site was the aggressive advertising campaign they had going on. (See Figure 11.02.) An old trick in media, promotion is as much a
part of the business plan of any company as is the desire to make a profit!
Figure 11.02. JCPenney's ad banner on Yahoo.
Yet, many businesses on the Web have yet to catch on to this simple and sensible advice. Web designers need to sit up and take notice—promotional events are excellent methods of bringing a fresh look to a site, or the perfect opportunity to add a
special game or other feature to a Web site. It's a good way to keep visitors entertained, and to keep clients engaged in being excited about their Web sites.
Web promotions needn't be cost prohibitive, either. One page of exciting information, or an additional banner on a home page, is a great start. The more resources available, the more flexibility you have in designing more aggressive strategies. JCPenney
is obviously in a position to take advantage of some of the Web's best advertising methods, and these can be costly. But the advantage is obvious—the aggressive promotion is definitely giving the company a true presence on the Web.
To create effective seasonal promotions, the best place to start is with a little research. Find out as much as you can about your client. The interests and customer base of that client are going to drive the type of promotion you bring into being. This
idea follows a statement I'm famous for: Intent drives content.
For example, if you don't want to alienate a specific heritage or religion during the holiday season, you'll be sure to incorporate as many events as feasible. This isn't just political correctness—it's good business sense. Don't alienate potential
customers. In fact, a major part of selling involves flattering the customer, making him or her feel as though they have been personally singled out by you, and that you are making that particular customer some special offer.
It's a good idea to keep a comprehensive list of seasonal events available as a reference. Then, when consulting with Web site clients, you, as the designer, can be sure to offer good ideas as to how to promote the site. Consider all the familiar
offerings, such as New Year's, Valentine's Day, Easter, Mother's Day, Father's Day, Halloween (see Figure 11.3) and so on, as well as more demographically specific ones such as Rosh Hoshana (Jewish New Year), or Dia de los Muertos (the Latin American
equivalent to Halloween that is actually a highly ritualized holiday). Comprehensive conversations with your client will enlighten you to the types of customers they already have, as well as those they'd like to entice.
Figure 11.3. JCPenney's Halloween page.
I was once at an Internet Exposition during DesertNet's early days, and was approached by an attendee for more information about the Web site design we provided. "I thought a Web site was marketing," she stated. The comment struck me as
interesting, because, although a Web site can indeed be an extension of marketing, it also requires marketing in order to be successful.
One way of bringing Web sites out of the dark tangents of the vast Internet is by creating and placing advertising banners on well-traveled sites. This can be rather affordable or very expensive, depending on the type of marketing strategy the client is
seeking. JCPenney's advertising happened to be on Yahoo, which is extremely well-trafficked. There are also banners to be had on less expensive, but still effective, sites. Regionally-oriented sites such as DesertNet are a perfect example of effective
presence in a specific market. Further narrowing down the scope of your intended audience would allow you to choose newspapers and magazines that reach the audience you want to reach.
Again, your preliminary research is going to be critical to the type of banner advertising you're going to create for the client. There are also different types of banner advertising, including the seasonal promotion as previously mentioned, which can
be supported by custom banners for that promotion, single banners that are representative of the product or service at hand, or entire banner advertising campaigns. The choice you make will most certainly be determined by resources as well as demographic
concerns.
For a full perspective on the power of banner advertising, I recommend a visit to DoubleClick, a company that is completely focused on Web advertising. Ideas as well as resources are available on the site. Point your browser to http://www.doubleclick.com/ for more information.
Another paradox found in the advertising methodology of the Web is that Web sites must be supported offline. There are two reasons I feel that offline promotions are extremely important. The first is the more obvious: It is necessary to make sure that
customers and fellow businesspersons know about your Web site. The second is a bit more insidious, but perhaps the most powerful: the penetration and saturation of Web marketing into the culture at large.
It's almost impossible to watch television in the United States without seeing commercials go by with Web URLs. One Monday night while watching Chicago Hope, I counted commercials with Web sites. I kept thinking, "The next won't have an URL.
It won't!" But sure enough, it did. It was both frustrating and exhilarating to see how much the Web had become a part of our daily lives. When the market becomes truly saturated, Web sites will be viewed (as well they should be) as an essential part
of a business plan.
There have been some truly unique and commendable ways I've seen offline Web advertising handled. Of course, there are the more obvious ways, such as placement of URLs on business cards, letterhead, and in regular advertising spots that the client has
in newspapers, radio, and television. My favorite two examples from URL watching include a waste disposal company that had their site's URL on a coffee mug (the paradox thrills me!) and one of my own clients, the Saguaro Credit Union who have placed their
URL on check stubs. Kudos to them for relating a Web site with money!
Yes, a Web site is marketing. But, it is also much more. JCPenney, although already an established company, has proven how effective the use of extended advertising is in taking a business to a new level—in this case, from a national market to a
global one. It's exciting to see this kind of vision from what might be considered old-paradigm corporations. As Web designers, you have the opportunity to bridge the gap for your clients, assisting them through promotions in getting the very best for
their company's long-term future.
Figure 11.4. Bloomingdale's home page.
It is truly accidental that both of the featured sites in this section would be from major retail chains, at least on my part. The other end of the argument might claim that it's an endorsement of the Web working for corporations in a variety of
different ways. No matter how you choose to sum it up, I, a shopping maniac with a serious addiction to clothing, am nothing less than delighted (and nothing more than deeper in debt) to find so much in the way of retail on the Web.
The Bloomingdale's site is as fashionable as one might expect. It changes often, much like their in-store displays. During my original visits to the site, I was particularly taken with the use of GIF animations on the home page, especially the center
one, which showed off various fashion and home accessories fading in and out. This animation provides the perfect opportunity to examine how animated GIFs are made, and to celebrate the fact that the exploitation of technology has turned out to be one of
the most easy and effective techniques available to the Web designer.
Animated GIFs have literally changed the face of the Web, even more than other forms of animation. The primary reason is because they can be kept very small for fast loading, and they cross the platform barrier with ease. If a browser doesn't interpret
the animated aspects of an animated GIF, the default is still a GIF image!
The technique is now extraordinarily simple because software engineers have graced us with WYSIWYG (What You See is What You Get) tools that can walk even the novice designer through the process with grace and ease. Because I work on a PC platform, I'll
be discussing two programs that I've had great success with. For those designers using MACs, the popular GIF animation program available is GIFBuilder, a powerful program that is very similar to the programs I'm about to describe. GIFBuilder can be
obtained for free, along with detailed history and tutorials of GIF Animation, at Royal Frazier's now-famous Web site: http://members.aol.com/royalef/gifanim.htm.
All GIF animations require a series of GIFs that make up the individual "cells" of the animation, a tool to process the GIFs, and a browser that will interpret them (Netscape and Internet Explorer 2.0+ users are safe). The same rule that I've
covered whenever discussing graphic formats on the Web remain true: size matters. Keep individual cells optimized and the overall file size will remain very manageable.
To install the GIF Construction Set from Alchemy Mindworks (found on the enclosed CD ROM), perform the following steps:
Sounds too simple, right? It really is that easy. Another program that I highly recommend because it gives very detailed palette control, is the PhotoImpact GIF Animator from Ulead Systems. Although the instructions are very similar, there are settings
in this product that can make a power user of anyone in an instant. Open the program, and from File go to Preferences. There, under General, you will find a range of palettes that will best match the work you are doing. Image Layer gives options on
interlacing and diffusion, as well as offering more palette control options. You can add comments to your work if you have the commercial version. For personal palette control, select Edit, and then Global Palette. This gives you the opportunity to set a
custom palette for an entire project!
Bloomingdale's fantastic GIF animation (see Figures 11.5 and 11.6) is a perfect example of the kind of clever and practical applications GIF animations allow. They are a lot of fun, a diversion as well as an art for you, the designer!
Figure 11.5. Bloomingdale's animated GIF (center).
Figure 11.6. Another view of the GIF.
This corporate giant has an attractive and practical Web presence. Using a news style interface, the first information you are offered is the lead stories of the month, whether they be financial data about IBM, or details of upcoming products and
projects.
The graphic design is sensible: an effective, consistent page layout consisting of navigation icons to the left, and details in the main body of the page. The lack of animation or Java on the main page is a tasteful choice for a business of IBM's
corporate composure. The site, in a word, is precise.
This precision is reflected in the underlying HTML of the site. I was especially impressed with the thorough and consistent use of the <meta> element.
Used in the <head> section of HTML documents, the <meta> element helps provide information about the document for identification purposes, such as author and content. The <meta> element "tags" document information for search
engines to index and catalog, to help browsers cache and refresh documents, or to allow for client pull, a technique that causes a page to automatically reload after a set amount of time.
IBM's site uses <meta> mostly to identify the page and alert the Web worms to do their indexing appropriately. Here are some relevant <meta> tag examples from IBM's Home Page code:
<META NAME="DESCRIPTION" CONTENT="The IBM corporate home page, entry point[ic:ccc] to information about IBM products and services"> <META NAME="LANGUAGE" CONTENT="en-us"> <META NAME="KEYWORDS" CONTENT="dynamic homepage home page index ibm[ic:ccc] international business machines"> <META NAME="OWNER" CONTENT="webmaster@www.ibm.com"> <META HTTP-EQUIV="REFRESH" CONTENT="900">
First, you'll notice that each <meta> element begins with a left-angle bracket, followed by the word meta, a space, the qualifying arguments, and finally, a right-angle bracket. It's important to note this because there is no closing
</meta>, unlike many other tags and elements. Instead, the entire <meta> information is handled line by line, between the <head> tag and closing </head> tag.
The first line in this example is the description, defined by the name="description" argument. Once the name element is defined, you'll follow up with the content, which is the literal description. In this case, IBM has placed a description of
the specific page. This is quite useful, both for identifying the page's purpose when looking only at the code, as well as providing a description for visiting Web crawlers, worms, and other robots to grab and place in their respective data banks.
The next line tells you the specific language and character set in use, in this case United States English. Following this are keywords, which also enable Web robots to index the page. I recommend using more than the example here
provides, and in fact, using more descriptive words. Keywords are quite important, and should be very comprehensive, containing not only the company's name, but the names of products and related words. In IBM's case, such words might include
"computers copiers stock quotes economy money." This would enable those pesky robots to get a broad-range of information as quickly as possible.
The "Owner" argument points to the Webmaster and how to get in touch with that individual via electronic mail. Finally, there is a refresh request. This particular example requests the browser to reload the document after a period of 900
seconds. This particular type of meta argument can be used to actually replace the current document with another. This is referred to as client pull, as previously mentioned, and the technique, which creates a form of animation, is detailed in Chapter 4, "Sites that Teach: Arts, Culture, and the Humanities."
Figure 11.8. Toshiba's home page.
I like this site for a number of reasons. I'm a fan of many Toshiba products, particularly their wonderful notebook computers. More importantly, I think they've done an admirable job of incorporating the global awareness that is inherent on the
Web—and their international company—within their site.
Some companies seem reluctant, despite an international business presence, to use the Web as a means to promote the worldwide opportunities the Web provides. I'm not certain that this is a deliberate or accidental issue. Or, perhaps this issue can be
attributed to less obvious circumstances, such as the politics and policies involved in corporate image. Regardless of the reasons, it is refreshing to find a company that openly embraces this worldwide relationship.
For the Web designer, there is great empowerment in the non-geographical aspect of the Web. Essentially, you can be anywhere in the world and present a global face; the size of the city does not matter. The same is true with the size of the businesses
you represent. A large corporation desiring a warmer, more personal presentation, can achieve that on the Web. Conversely, the small business can come across as a large corporate entity, as long as the ability to back up the product is there for
follow-through, of course.
The significant point here is that Web designers should work closely with clients to take advantage of the Web's international scope. Understanding how the Web can be a powerful application is going to enable your client to have a successful Web site,
and enable your own progress within the design world.
When meeting with clients, the following questions can serve as helpful guides to determine how the international mien of the Web can best assist with the site design at hand:
Toshiba provides an excellent example of language options. The corporate site is offered in both English and Spanish. Because Spanish is a very common language worldwide, as well as in the United States, it makes sense to make a visit to the site as
practical and helpful as possible. Toshiba provides a strong example for Web designers to take the international issues to their clients, strengthening not only the corporate advantage, but, ultimately, fully embracing the World in World Wide Web.
Figure 11.9. Sedgwick China's home page.
This elegant site is as functional as it is attractive, a powerful combination that is a reason for its success. The Web presence for China's only licensed foreign insurance broker, this site offers information about Sedgwick to its U.S. constituents in
a clear, crisp fashion that is easy to navigate and read.
The graphic design is a mix of clean lines and textured fields. Bright Chinese photographs and images appear throughout, nicely set into the text. This mix of texture and clarity is first established on the site's home page, where photographs are set in
to the textured background. Within the site, the continuation of this blend is assisted by the use of frames, and visually created by the implementation of different backgrounds within those fields.
Background choices are very important. Web designers must select backgrounds that are elemental parts of a whole. The background must enhance and interact with the site design, never taking away from the information within a site. Instead, the
background should serve as a complementary member of the entire site. Sedgwick China is a perfect example of the wise use of backgrounds as part of a cohesive Web environment. Look closely at figure 11.10 to see the navigation frame (to the left) and the
information frame. This figure will help you clearly follow this concept.
Figure 11.10. Sedgwick China's mix of backgrounds.
In the navigational frame, you'll notice the burlap style texture. It's a very realistic looking fiber, and is light enough to read the information placed over it. This is extremely important when creating textured backgrounds: Be sure to make them dark
enough to maintain the look and feel you're after, but light enough for text to be clearly readable. Typically, textured backgrounds such as this are made into tiles, either square or rectangular. Textured backgrounds should, when tiled into a
field, be smooth. In other words, the eye should not be able to detect where a tile begins and ends, or when a new one meets its edge.
The information frame also uses a background. This background has a left margin object with a clean white chosen for the main field. Margin backgrounds are a special case, in that they must be created length-wise at a length of no shorter than 1280
pixels. The rationale behind this is that anything shorter is going to repeat at the screen resolution of the individual's monitor. For example, if I create a blue margin, as seen in the right frame field of Sedgwick, and I left it at 600 pixels on a 640
pixel screen width, the vertical blue line is going to repeat, which will disrupt my design. So, when creating any background with a vertical stripe, be sure to make it long enough to avoid repetition on a higher resolution monitor.
In the Sedgwick case, both a tiled texture and margin-style background are employed (see Figure 11.10), and the resulting effect is quite classy. This suggests not only one background image is necessary within a site. Play around with the colors and
styles you like to get the kind of look you like the best.
Here are a few rules of the highway when working with background images:
Figure 11.11. Nike's effective placeholder.
Conceptually, the Web is always under construction. Areas of sites are constantly changing, with the infrastructure being rebuilt, torn down, and redesigned, sometimes on a daily basis. New areas of sites are added, and sites go through entire
restoration or renovation. This is all part of the living, breathing Web. Announcing it with as stupid a symbol as the Under Construction sign (see Figure 11.12) is not as clever as it once was. Now, I'll get off my slippery soap box and offer some
realistic advice as provided per Nike.
The method Nike uses (see Figure 11.11) perfectly exemplifies the right way to handle site changes or redesigns when you don't want a visitor to not be able to find the site, or think that it is no longer available. You want to let the visitor know that
the site will be back, bigger and better than ever! Simply telling your audience what's going on is ever so much more informative than suggesting that you, like any Web site, are under construction.
Figure 11.12. An example of the dreaded Under Construction symbol that Nike has wisely chosen to avoid using.
Here's how Nike just did it. With their little check mark trademark on the left, the text reads as follows:
"The number you have reached is no longer in service. Nike.com will be dark for several months while we rebuild the site and prepare for the future. So thanks for thinking of us and be sure to come back when we go on-line again"
"Don't worry. You'll hear about it."
There you have it. Clear communication, appreciation of the audience, an invitation to return, and that Nike humor letting you know that they know you're going to be hearing about what a great Web site they've got. I'll bet big money it's going to be a
sizzling site. After all, they treated this problem—a bane of my existence—with such grace, that I'm convinced only amazing things lie ahead.
Figure 11.13. Beaudry RVs splash page.
There's a lot of things for sale on the Net, but who would have thought that selling recreational vehicles (expensive, elaborate items at best) would be a smashing success on the Web? Sure enough, the tale is that the company had to add a special
salesperson just to handle the inquiries and sales leads generated from the Web site.
Perhaps being the World's #1 Fleetwood dealer doesn't hurt. It takes a bold company to sell such a, well, big product, and bold is the way Beaudry RV has tackled the Web.
Blocky, masculine letters grace the page's splash page, which uses a postcard style graphic that sets the theme for the site. Throughout the pages, the travel theme continues, both visually and in content. Photos are treated with a Polaroid matting.
There are on-the-road forums for RV fans to write in and chat about their experiences, and even links to campgrounds and activities for RV enthusiasts to help plan trips from the virtual, or real, highway.
Theme is a strong aspect of creating a Web site. Choosing and developing a thematic approach to data and information can make a site cohesive, intelligent, and guide the material. In a sense, theme treatments can keep your job easy by showing you the
route to take for various subjects to be incorporated into the site.
It's not difficult to develop theme; typically, the subject matter will drive it. Beaudry RV's travel motif is a natural extension of the product. The idea is to find the theme within the product, subject, or with the client. Sometimes he or she might
have excellent ideas as to how they'd like to present the information. It's a creative process, but it can be guided by thinking about the following:
Not all sites are going to call for theme, but it should always be in the forefront of a Web designer's mind when approaching a particular site. The end result can be very powerful and act as a vehicle for success.
Figure 11.14. Konika Business Machines home page.
The lion's eyes light up the splash page on Konika's Business Machine's site, and their famous mascot roars. The internal pages are crisp and bright, and make excellent use of white space, well-optimized graphic images, and bright color.
I like the way the designers of this page have color matched link attributes. (See Figure 11.15.) It's a sophisticated touch when designers go the extra mile and methodically, but creatively, make sure that smaller, seemingly less important elements
like this are considered as part of the over-all design.
Figure 11.15. Konika Business Machines link color matching.
There's been a bit of controversy as to link colors. Some designers are of the mindset that link colors should remain at the default blue and purple for identification purposes. To me, this suggests that Web visitors aren't worldly enough to know when
something is hot or not. I think that opinion is not only false, but insulting to the intelligence of Web users. Besides, it's the duty of designers to make Web sites clear enough so that visitors will have little or no questions as to how to navigate.
Link color matching does have some recommended guidelines, however. Konika Business Machine's Web site matches from the graphic palette used for that site, and not from a safe palette. As much as I discussed background colors in Chapter 10, "Sites for Kids: Education, Games, Items of Interest with Children in Mind," any type of text or field color that will be pulled from a computer's color control system could conceivably end up dithering to
horribly bright or significantly different colors on Windows 3.1 machines, and with monitors that only support 256 colors rather than thousands or millions. As such, text and link color matching should be done either by selecting from the safe palette (see
Appendix C, "Color Table"), or the designer should be sure to check out his or her choices at lower color resolutions. It's an extra step in the process, but it's a wise one to take.
Link controls are all found within the <body> tag. Here is an example of the syntax from the KBM site:
<BODY bgcolor="#FFFFFF" background="graphics/backg.gif" vlink="#9d3e0d"[ic:ccc] alink="9d3e0d">
The HTML coder has, in the preceding example, argued first for a background color value of white, and a background graphic to load after that. The visited link color is brown, and the active link (the color the link turns as it's being clicked on)
appears as the same brown. Interestingly, the link color itself has been left at the default blue, as has the text.
I would personally have defined the elements left as defaults. It's a good rule of thumb to argue as much as would apply to a page, instead of leaving it to default. Browsers differ, and some browsers allow for customization of default colors.
Therefore, in order for the careful, considerate design to be effective, arguing the default will create as much cross-browser, cross-platform consideration as possible. The results would look like this:
<BODY bgcolor="#FFFFFF" background="graphics/backg.gif" text= "#000000"[ic:ccc] link="#3758DB" vlink="#9d3e0d" alink="9d3e0d">
A minor change with potentially improved results. Now, some readers might be asking, "Well, where did the value come from? Just what do those letters and numbers mean?"
Colors are defined in HTML documents (either in the <body> or <font> tags, or wherever the bgcolor argument is allowed, as with table data fields) by the hexadecimal equivalent of the RGB (red-green-blue) value of a given color (an exception
is with Internet Explorer extensions—you can simply type a color in the appropriate field, but I would avoid this as it isn't standard). There are several ways to get this value. My preference is by converting the RGB value to hexadecimal with a
scientific calculator. In Windows, all of this can be done with Photoshop and the calculator provided with the Operating System. The following steps show how:
My RGB value for the blue link color was: 55 88 219. After processing, the result was: 3758DB, which is indeed the bright blue resulting link color.
It's important to note that "0" will appear as "0" in hexadecimal. Be sure to use two zeros in order to achieve the proper results. Hexadecimal values should always, as the name indicates, be six characters in length.
Please see Appendix C, which provides the complete hex values for the safe palette.
Figure 11.16. MCI's home page.
When pitching the Web to clients, I have often mentioned the value of twenty-four hour online customer service. This is one of the best uses of the Web for businesses. It provides on-demand access for information about a product, can easily provide
secure account information for customers, and offers a variety of other services to the public any time of the day, any day of the year. A client can get all of this with much less overhead than such services would cost elsewhere.
MCI has taken this aspect of the Web and truly made it a powerful part of the various offerings on their Web site. There is a lot of energy on the site: product information, news with feature articles, and regular columns from Internet and technology
personalities, such as Vint Cerf (casually known as the Internet's dad for his part in developing the TCP-IP protocol).
Other site areas focus on MCI's vast services, including long distance for home or business, hot focus on their Internet products (see Figure 11.17), and an online CGI-to-pager service. There's even a collection of QuickTime Virtual Reality scenes from
the "Garden of the Gods," the MCI home office in Colorado Springs. The site is heavy on the frames, but it is generally a judicious use of space. It is very comprehensive, but the intelligent use of interactive customer service shines the
brightest.
The first thing customers who want service must do is apply for a password and user ID. (See Figure 11.18.) This is done via a CGI script, and the password is generated and automatically sent back to your e-mail. You can then sign on and use the service
to view your bill, update your account, redeem points, and add or delete custom services. All that's missing is paying your bill online, but this may well be available in the near future.
Figure 11.18. Customer service on MCI.
Obviously, not all clients wanting to have a Web site are going to have the resources, both technologically and financially, that a large corporation has available. However, this doesn't mean customer service—even with limited interactivity such as
feedback e-mail or FAX forms—is out of reach. The hallmark of customer service on the Web is the provision of information. Beyond that, everything else is value-added service.
The one caution is to work within the clients resources. Over-extending options, such as a 24-hour e-mail feedback response, could cause problems if the means to provide that type of support are not in place. Always evaluate a client's needs as well as
the level of resource commitment he or she is able to make. Re-evaluations can always take place as a company grows or resources change.
Figure 11.19. Gerber Optical's home page (with Java applet).
The entire spectrum of Gerber sites are quite exceptional and rather diverse. (See Figure 11.20.) The Gerber Optical site is a quintessential example of corporate presence—attractive but functional design, with a focus on the products and
information.
Figure 11.20. Gerber Scientific: another view of a Gerber Web presence.
There's almost a feeling with sites such as this that they aren't out to serve the general public, but rather, a very specific network of peers or buyers interested in the company. I think of sites such as this as Intra-Internets: sites not quite as
private or in-house as an intranet, but not quite as public as a frank commercial Web site, either.
When going down this road with a client, it's to the Web designer's advantage to be rather subtle with the design and focus on the content. You're not trying to impress with the proverbial hoops, bells, and whistles, but rather, you want to allow
function to guide form. The designers of Gerber Optical have done a good job adding a simple, popular Java applet to the home page.
Java applets are fun and neat additions to HTML pages, without requiring advanced or detailed programming. They are set right within the HTML code itself and are simply customized to the needs of the individual.
Here is the Java applet from Gerber Optical:
<applet code="TickerTape.class" width=370 height=18> <param name=step value=3> <param name=redbackground value=0> <param name=greenbackground value=0> <param name=bluebackground value=0> <param name=redforeground value=255> <param name=greenforeground value=255> <param name=blueforeground value=255> <param name=text0 value="Welcome to Gerber Optical's Home Page![ic:ccc] Check out our three new products"> <param name=url0 value="index.html"> <param name=text1 value=": Triumph Frame Tracer in Finishing"> <param name=url1 value="finishing.html"> <param name=text2 value="... Apex Finer/Polisher in Surfacing"> <param name=url2 value="surfacing.html"> <param name=text3 value="... Step Two Finish Blocker in Finishing"> <param name=url3 value="finishing.html"> </applet>
As you can see, a JavaScript applet opens with the <applet> tag, and attributes are added. In this case, it is a tickertape-style applet, which allows for a vertically scrolling selection of information.Note that the width and height are argued.
Then, each following parameter describes values including background color, foreground or text color, and the actual text to be scrolled across the ticker tape. Finally, the </applet> tag closes the application.
Common applets are available from JavaSoft's official Java directory at Gamelan, http://www.gamelan.com/, and at Macromedia's fantastic Web site in the software section, http://www.macromedia.com/software/powerapplets/index.html. A general overview of Java Script and the more complex Java Language is available at
http://java.sun.com/.
Okay, fellow Web designers. Sell me your best. I'd like to see you
It's no accident that I've finished the book's sites and lessons up with the commercial end of the spectrum, because many designers are finding that the demand for business-oriented sites is the highest these days. I hope you've found the lessons within
this chapter, and the entire book, helpful in making your designs sizzle!
Please be sure to read through the appendices. They offer a variety of resources, including an index of this book, twenty top design tips, a safe palette example, a list of designer resources, and an index to everything on the well-stocked CD-ROM.
