Home   Preview the Book   Chapter 15, TOC   Part 6

  Previous: Converting a Web Design into a Web Application
  Next: Implementing a Web Design

Factoring a Web Design for Implementation

Take another look at Figure 15-3. Many design elements repeat, some with variations, from page to page. The left side of each Web page displays a navigation menu with items representing the homepage and the second-level pages in the site. The large rectangle on the right side of each Web page contains four distinct sections. A graphical logo appears at the top. Underneath the logo is a “breadcrumb” section that allows a visitor to return to pages higher in the hierarchy from the current page. (Appendix A provides more information about providing breadcrumb links to enhance a Web site’s usability.) Underneath the breadcrumb section is the main content section, which varies greatly from page to page (but it is the only section to do so). The bottom section displays a standard footer containing copyright and business information.

Figure 15-4 shows an ASPX page in Visual Studio .NET that distills the basic structure of all the HTML pages delivered by the Web designer. A table containing just one row of two cells defines the overall left and right structure of each page.

Figure 15-4. The aa_basic.aspx Web page defines the structure of all the ASPX pages in the VB Snippets case study.
Chapter 15, Figure 04.

The three user controls in Figure 15-4—smaNav, smaLogo, and smaFoot—appear in every Web page in the case study. The custom control BreadCrumbs appears in every Web page except for the homepage (index.aspx), which is at the top of the hierarchy and needs no backwards navigation to parent levels of the hierarchy. We present the code for each of these controls in this chapter. We also describe other controls with more-limited use, such as a control that displays localized graphic buttons. Figure 15-5 shows the basic page in Visual Studio .NET after a Build and Browse. As you can see, the four controls on the page duplicate the appearance of the HTML received from the Web designer.

Figure 15-5. The controls on the aa_basic.aspx Web page encapsulate design elements that recur throughout the Web site.
Chapter 15, Figure 05.

The VB Snippets case study also makes use of four class files. The CLocalization class, introduced in Chapter 13, encapsulates common functionality needed to localize each Web page. We do not discuss it further here. Two classes—CVbUser and CVbCode—encapsulate the code that’s needed to access the two databases used by the application. We discuss portions of the CVbCode class in this chapter, and you can download and examine the full code for both. The fourth class, CVisitor, encapsulates information about the current visitor that is needed to personalize some of the displays in VB Snippets. As shown later in this chapter, the information in CVisitor comes from persistent cookies as well as the VbUser database.

By factoring a Web application in this manner, you achieve the benefits of object-oriented programming. The classes may be instantiated and used throughout the Web application. When changes are needed, they are isolated within the appropriate class. Once tested, the code in a class works properly no matter what other class uses it.

  Previous: Converting a Web Design into a Web Application
  Next: Implementing a Web Design

Home   Preview the Book   Chapter 15, TOC   Part 6

Copyright © 1996 - 2017 SoftMedia Artisans, Inc. All Rights Reserved.