Web Site Design and Setup

views updated

WEB SITE DESIGN AND SETUP

As many businesses found, to their dismay, in the early days of the World Wide Web in the mid-1990s, the design of a Web site can make or break a firm's attempts to establish a Web presence. Poor aesthetic design, weak technological backbones, inconsistent data integration, and illogical site organization and structure can discourage users and potential clients, causing them to give up on a site and take their business elsewhere. As competition for Web-based hegemony heated in the late 1990s and early 2000s, companies invested increasing time and money into the design and set-up of their Web sitesboth the back-end architecture and the visual presentation of their information. The result was an ever-evolving Web of greater sophistication, enhanced aesthetic consideration, and more options for the average user.

In the early days of the Web, companies typically set up Web sites with little consideration to aesthetics or to efficient or user-friendly e-commerce architectures. Rather, the competitive pressures at the time spurred companies to simply get their sites out there to stake out a place on the Web. This process led to the phenomenon of the brochure site: a Web site that did little more than announce a firm's presence and explain their business, but with little capability of handling e-commerce orders, customer service, or sophisticated interaction. Sites such as these were often built with generic brochure-ware, software set up as a basic template into which companies could enter their own information.

As e-commerce intensified, however, it became increasingly apparent that such a cookie-cutter and half-hearted approach to the Web wouldn't suffice. Firms began looking to the Web as more than just a prerequisite of doing business; they saw in their Web sites the potential for generating new revenue streams and adding value to their offerings. Through the late 1990s and early 2000s, Web site design and structure grew to reflect and propel larger business plans, integrating technical expertise and aesthetic design with sophisticated market research and broader company concerns, ranging from customer service and transaction issues to inventory management and procurement processes. Thus, corporate Web sites came to reflect the corporate culture and processes as a whole at the same time that the culture and processes were transformed to reflect the focus on Web-based e-commerce. In the process, Web sites were transformed from company-centered to customer-centered commercial outlets.

SITE LAYOUT

Since the human brain can only digest so much information in a single space before it becomes overwhelmed, and since large Web pages can take an impossibly long time to load, Web sites are intricately organized as a series of pagesoften stretching into the hundredsthat interconnect in ways that have been thoroughly thought out by the designer to most accurately reflect the site's content and make the site as user-friendly as possible. A general rule of thumb holds that smaller, easily differentiated units of information are easier for users to sift through and use than are large, undifferentiated pieces. Through the late 1990s and early 2000s, e-commerce Web sites were shortened to limit the amount of scrolling a user had to do on a given page. Ideally, sites are organized so that all the information is presented to customers without their having to do anything. Obviously, this was not always possible, but design analysts generally agreed that the less a user has to hunt around to find what he or she wants, the more likely a purchase will result.

According to the Web Style Guide: Basic Design Principles for Creating Web Sites by Patrick J. Lynch and Sarah Horton, the organizational schemes of Web sites are ideally designed to limit the number of variables that the user must keep in short-term memory by way of intelligent site layout and a combination of textual content, graphic design, and layout schemes organized to complement the Web site's purposewhether that purpose is to sell products, convey information, or provide tools by which users can find the information they want. "Most Web sites contain reference information that people seek in small units," Lynch and Horton wrote. "Users rarely read long contiguous passages of text from computer screens, and most people who are seeking a specific piece of information will be annoyed to have to scan long blocks of text to find what they are after."

Web sites are typically laid out in hierarchical organization schemes, and guide users through the site via a navigation path. That is, it points users toward various broad sectors of the site from the home page, and with each click the user gets closer to the precise information they want. The trick in devising this organization scheme is to make it obvious to the user without necessarily calling attention to itself. All things being equal, designers generally want to create navigation paths that allow users to get the information they want in as few clicks as possible while still maintaining a clear overall sense of logical navigation. A clear navigation path ensures that, no matter where users are on a site and no matter how many clicks from the home page they are, they still have a clear sense of where they are on the site, particularly in relation to the home page and the major subsections.

PAGE LAYOUT

Web documents contain a number of core elements. The first of these is a tag identifying the appropriate document type, marked by the DOCTYPE HTML tag. (XML has similar tags of its own, but in each case, the document starts off with a tag defining what kind of document follows.) This tag ensures that the Web browser understands the appropriate manner in which to render and interpret the document. This is followed by a header, in which the general color scheme is established and the title, appearing at the top of the browser, is set. Finally, the body of the document is established by the BODY tag in HTML. It is within the body that the Web page's information is conveyed. These are the essential elements that allow a Web browser to read a Web page. In addition to these, however, there are several general conventions that site designers tend to follow within the bodies of their documents.

Design consistency is important in order to create a common theme that users can identify as belonging to a particular company. In other words, consistent design parameters across a site help define the company's character on the World Wide Web. For example, wherever possible, designers are encouraged to use identical layout grids, color schemes, graphic themes, text fonts, and organization patterns. According to

Web Style Guide: Basic Design Principles for Creating Web Sites, designers need to make users comfortable with a site as quickly as possible, which requires users to be familiar with the site in only a few minutes; obviously, then, designers need to check their temptation to explore a wide range of design techniques within a single site. Headers, titles, footers, navigation links, and other common page elements thus need to appear in similar or identical fashion. Fast-loading graphics combined with comfortable color palettes are the most effective aesthetic combination.

Designers should also avoid what are known as "dead end" pagesthose pages on which there are no links back to the home page or to another local page. Such dead ends give the impression of a poorly designed and unorganized site, and easily frustrate users. Sophisticated, consistent design that meets high standards and avoids sloppiness is crucial if users are to maintain confidence in the site.

MARKUP TOOLS

Various markup languages exist that designers use to render their information in Web-readable format. The chief among these is Hypertext Markup Language (HTML), a series of codes and tags that tells the Web browser how to interpret and present text data and links to other documents, files, and graphics on a Web site and elsewhere on the Internet. While this was the original standard markup language developed along with the World Wide Web itself, by the end of the 20th century, it was no longer the recommended markup methodology, according to the World Wide Web Consortium, the main body overseeing the Web's development.

In 2000, the chief recommended markup standard shifted to eXtensible Hypertext Markup Language (XHTML), conceived as a bridge between HTML and eXtensible Markup Language (XML), which was poised as the next-generation lingua franca of the Web, particularly for e-commerce. By the early 2000s, however, neither XHTML nor XML had been widely adopted, due largely to the great confusion these standards have caused for designers.

HTML tags focus primarily on the structure and layout of a document, while XML leaves presentation to style sheets, focusing instead on the definition and meaning of certain kinds of information, allowing for the flexible defining of terms and parameters for various types of data. It is for this reason that XML was touted as the future language of e-commerce, since XML deals specifically with giving meaning to information, allowing computer systems to intelligently apply Web-based information in meaningful ways in commercial transactions.

HOLISTIC BUSINESS WEB SITES

In the more mature e-commerce environment of the early 2000s, Web sites needed more than a pleasing look and convenient layout. As Web sites were positioned as integral aspects of firms' strategies, they were increasingly retooled to create a seamless overall network, integrating the Web site with the rest of the companies' information technology architectures. Thus, Web sites were increasingly built to work alongside company databases and systems designed to handle ordering, procurement, inventory management, payment processing, billing, customer relations, and intra-firm communications, among others. In this way, Web sites were beginning to reflect the broader promise of the World Wide Web and the Internet by creating value and harnessing the power of contemporary information technology to form more efficient business practices.

The last step in setting up a Web site is promotion. Depending on the size and stature of the business, site promotion can take many different forms. If a firm is well established, with several advertising means at its disposal, it can simply utilize its existing promotion channels to alert people to its Web site. Smaller and upstart firms need to establish links with sites already proven to draw trafficparticularly traffic from the firms' desired customer basein the hopes of generating links to their new sites. Large and small businesses alike also invariably try to establish a presence on the major search engines, which often entails various applications or referrals. There were a range of search engine strategies, but the primary goal of any such strategy was to position a site to appear toward the top of user Internet searches.

CUSTOMER-CENTERED DESIGN

Ultimately, the customer is the most important element of the Web site, and thus design decisions need to reflect the customers' interests above all. Designers must be on the lookout to avoid too much or too little information, excessively long or convoluted registration or purchasing processes; an excessive or confusing dearth of advertisements; too many or too few clickable links; unobvious navigation schemes; a shortage of helpful tools such as search engines, site maps, help pages, or links back to a home page or other logical starting point; color schemes that strain the eye or render the text difficult to read; complex graphics that lower-end systems can'thandle; and a host of other design sins.

Another important rule of effective Web-site design is that there is no such thing as static perfection. Rather, Web sites must constantly evolve to reflect and accommodate transforming business climates, improving technological capabilities, and, perhaps most importantly, shifting customer expectations. Effective corporate Web sites thus require constant updates and tweaking. If a site undergoes no substantial change for too long a period, customers may get the impression that the company isn't keeping pace with demands or technology, or that in some other way the company's site may not cater to their needs as well as that of the firm's competitors.

DESIGN RECOGNITION

As Web sites moved from simple information depositories to aesthetic creations and mediums for specific commercial activity and content, Web design evolved alongside a growing recognition of design achievements. By the early 2000s, the Web was littered with awards recognizing various criteria for excellent Web design. While some of these awards were amateur-drivenoccasionally, the winners had no idea they won, not having heard of the awardand others functioned more as advertising and promotion schemes for the presenter, there were a number of prestigious awards that designers and businesses sought after. Recognition by the likes of the Webby Awards not only put a firm's name in good companythe winners were widely respected as quality Web sites and the awards themselves drew celebrity power from the Internet and business communities and from society at largethey brought much-needed recognition of and attention to the company's site, an endorsement that could give a Web site a competitive edge.

FURTHER READING:

"Design Matters." Fortune, Winter 2001.

Holzschlag, Molly E. "The Fear of XWhat Web Designers Should Know About XML and XHTML." PC Magazine, August 1, 2001.

Lynch, Patrick J., and Sarah Horton. Web Style Guide: Basic Design Principles for Creating Web Sites. New Haven, CT: Yale University Press, 1999. Available from info.med.yale.edu/caim/manual.

Raskin, Jef. "The Humane Touch: Bad Design Can Be Costly." Forbes, May 28, 2001.

O'Donovan, Cheryl. "Dot Ugh." Communication World, June 2001.

Syers, Mandy. "ZDNet Developer: Build Your Own Web Site in Six Steps." ZDNet, 2001. Available from www.zdnet.com.

SEE ALSO: HTML (Hypertext Markup Language); Integration; Promoting the Website; Three Protocols, The; Search Engine Strategy; URL (Uniform Resource Locator); Web Awards; Web Site Basics; Web Site, Relaunching a; Web Site Usability Issues; World Wide Web Consortium (W3C); XML (Extensible Markup Language)