US20070180361A1 - Method and system for dynamic web page breadcrumbing using javascript - Google Patents

Abstract

According to the present invention, there are provided a dynamic client-side breadcrumbing method and system for improving navigation of a plurality of web pages within a Website. The method and system comprise executing a breadcrumbing engine embedded into a web page for: generating a breadcrumb for each web page downloaded to a web browser associated with a client from a web server associated with the Website, the generated breadcrumb including navigation information for each downloaded web page; storing breadcrumbs associated with web pages downloaded to the web browser at the client; updating the stored breadcrumbs with the generated breadcrumb to form a breadcrumb navigation trail of breadcrumbs associated with navigation of the web pages at the Website; and displaying the breadcrumb navigation trail on each downloaded web page for user selection. The method and system further comprise resuming navigation according to the breadcrumb navigation trail by downloading of a web page according to navigation information of a last breadcrumb in the breadcrumb navigation trail.

Description

REFERENCE TO CROSS-RELATED APPLICATIONS
• This application is a divisional of U.S. patent application Ser. No. 09/903,046, filed Jul. 11, 2001.
BACKGROUND OF THE INVENTION
• 1. Technical Field of the Invention
• The present invention generally relates to navigation within a Website. More particularly, the present invention is directed to a method and system for dynamically generating and maintaining a client-side breadcrumb navigation trail for improving navigation of a plurality of web pages within a Website.
• 2. Description of the Prior Art
• Navigation within a Website generally falls within a simple linear navigation architecture, or the more complex breadth-emphasizing and/or depth-emphasizing navigational architectures. Invariably, a well-designed Website on the World Wide Web (i.e., “WWW”) and more generally on the Internet, adheres to a navigational architecture that enables a user to easily navigate through the Website's information space (i.e., plurality of web pages). The breadth-emphasizing navigation structure reminds the user of the full array of information within its information space. That is, such a structure depicts all top levels of the Website (i.e., categories) on a particular web page of the Website (i.e., as links to those top level web pages), such as at the left margin of the web page running the length of the web page or across the top of the web page running from the left margin to the right margin. The depth-emphasizing navigation structure depicts a hierarchical path through the information space from broader categories through more narrower categories through to a final web page, i.e., displaying links from a home page of the Website through a plurality intermediary web pages representing categories (i.e., child web pages) to the current page (i.e., also a child web page) atop the current web page as breadcrumbs, i.e., breadcrumb navigation. Particular web sites that implement breadcrumb navigation include CNET.com, Yahoo.com, ZDNnet.com, Sun.com, and the like.
• Presently, myriad web sites implement breadcrumb navigation within their websites. Breadcrumbs are Hypertext Markup Language (i.e., HTML”) links that are displayed atop of web pages of a Website that link users to web pages that the user navigated through while at the Website. Furthermore, the links are displayed in order from a first web page (i.e., parent page) to subsequently visited web pages (i.e., child web pages). For example, the following links represent breadcrumb navigation from a parent web page to a plurality of subsequent web pages: “Home>Computers>Software>Internet>TCP/IP”. In the foregoing example of breadcrumb navigation, a user is presented with all of the pages that the user has visited from the parent web page “Home” to the current child web page “TCP/IP” in the information space of the Website. It should be noted that all of the pages except the last page “TCP/IP” are HTML links, since the last page represents a web page that is currently displayed. If, for example, the user were to click on the “Computers” link, a child web page associated with this link would include the following breadcrumb navigation “Home>Computers”. Thus, a user is enabled to traverse the visited web pages of a Website via the links atop each of the web pages by clicking on the appropriate link associated with a visited web page. Separators that distinguish one link from another generally include: “>”, “→”, “/” and the like.
• Different breadcrumbing methods are known in the art. One of the methods hard codes breadcrumbs as static links in web pages requested by a user (i.e., hard-coded breadcrumbing). Another method implements breadcrumbs generated, maintained and inserted into web pages by a Website server (i.e., server-side breadcrumbing) and transmitted to the user requesting the web pages. Both of the foregoing methods provide for navigation of the Website's information space (i.e., plurality of web pages at the Website) for the user. A deficiency of the hard-coded breadcrumbing method is that the breadcrumbs (i.e., HTML links) may not accurately reflect correct order, link name and associated web pages for the navigation structure through the information space of the Website. That is, in order to correctly reflect the user's navigation through the Website's information space, breadcrumbs must be maintained and updated as the Website changes, i.e., changes occurring in the web page organization including renaming, deleting, adding and moving web pages within the Website. A deficiency of the server-side breadcrumbing is that such an implementation places an inordinate load on the server in terms of execution time and storage space required to satisfy all user requests for web pages utilizing breadcrumbs.
• Therefore there is a need in the art for dynamic client-side breadcrumbing for abating deficiencies of the prior art breadcrumbing systems requiring hard coding of the breadcrumbs or placing a load upon the Website's server resources for performing breadcrumbing.
SUMMARY OF THE INVENTION
• It is therefore an object of the present invention to provide a system and method for dynamically generating breadcrumbs for web pages requested by a plurality of users.
• It is another object of the present invention to provide a system and method for dynamically maintaining breadcrumbs.
• It is yet another object of the present invention to provide a system and method for dynamically maintaining client-side breadcrumbs.
• It is a further object of the present invention to provide a system and method for facilitating the plurality of users to navigate a Website utilizing the dynamically generated and maintained breadcrumbs.
• It is yet a further object of the present invention to provide a system and method for facilitating users to utilize the dynamically generated and maintained breadcrumbs to resume navigation where they left off upon revisiting the Website.
• According to an embodiment of the present invention, there is provided a dynamic client-side breadcrumbing method for improving navigation of a plurality of web pages within a Website, the method comprising: generating a breadcrumb for each web page downloaded to a web browser associated with a client from a web server associated with the Website, the generated breadcrumb including navigation information for each downloaded web page; storing breadcrumbs associated with web pages downloaded to the web browser at the client; updating the stored breadcrumbs with the generated breadcrumb to form a breadcrumb navigation trail of breadcrumbs associated with navigation of the web pages at the Website; and displaying the breadcrumb navigation trail on each downloaded web page for user selection.
• According to another embodiment of the present invention, there is provided a dynamic client-side breadcrumbing system for improving navigation of a plurality of web pages within a Website, the system comprising: a web server associated with the Website transmitting web pages requested by a client, the web pages embedding a breadcrumbing engine; and a web browser associated with the client downloading the web pages and executing the breadcrumbing engine, the breadcrumbing engine for: generating a breadcrumb for each web page downloaded to the web browser, the generated breadcrumb including navigation information for each downloaded web page, storing breadcrumbs associated with web pages downloaded to the web browser at the client, updating the stored breadcrumbs with the generated breadcrumb to form a breadcrumb navigation trail of breadcrumbs associated with navigation of the web pages at the Website, and displaying the breadcrumb navigation trail on each downloaded web page for user selection.
• According to yet another embodiment of the present invention, there is provided. A program storage device, tangibly embodying a program of instructions executable by the machine to perform a dynamic client-side breadcrumbing method for improving navigation of a plurality of web pages within a Website, the method comprising: generating a breadcrumb for each web page downloaded to a web browser associated with a client from a web server associated with the Website, the generated breadcrumb including navigation information for each downloaded web page; storing breadcrumbs associated with web pages downloaded to the web browser at the client; updating the stored breadcrumbs with the generated breadcrumb to form a breadcrumb navigation trail of breadcrumbs associated with navigation of the web pages at the Website; and displaying the breadcrumb navigation trail on each downloaded web page for user selection.
• According to still another embodiment of the present invention, there is provided a dynamic client-side breadcrumbing method for improving navigation of a plurality of web pages within a Website, the method comprising: storing breadcrumbs associated with web pages downloaded to a web browser from a web server associated with the Website at the client, the breadcrumbs including navigation information associated with downloaded web pages and forming a breadcrumb navigation trail of breadcrumbs associated with navigation of the web pages at the Website; setting a time stamp corresponding to the breadcrumb navigation trail and storing the time stamp at the client; downloading a subsequent web page and retrieving the time stamp corresponding to the breadcrumb navigation trail stored at the client; determining whether a time interval between the time stamp and a time corresponding to the subsequent downloaded web page exceeds a threshold; and enabling resumption of navigation according to the breadcrumb navigation trail by enabling downloading of a web page according to navigation information of a last breadcrumb in the breadcrumb navigation trail and displaying the breadcrumb navigation trail on the downloaded web page if the time interval exceeds the threshold,
• According to still yet another embodiment of the present invention, there is provided a dynamic client-side breadcrumbing system for improving navigation of a plurality of web pages within a Website, the system comprising: a web server associated with the Website transmitting web pages requested by a client, the web pages embedding a breadcrumbing engine; and a web browser associated with the client downloading the web pages and executing the breadcrumbing engine, the breadcrumbing engine for: storing breadcrumbs associated with web pages downloaded to a web browser from a web server associated with the Website at the client, the breadcrumbs including navigation information associated with downloaded web pages and forming a breadcrumb navigation trail according to user navigation of web pages at the Website, setting a time stamp corresponding to the breadcrumb navigation trail and storing the time stamp at the client, determining whether a time interval between the time stamp and a time corresponding to a subsequent downloaded web page exceeds a threshold, and enabling resumption of navigation according to the breadcrumb navigation trail by enabling downloading of a web page according to navigation information of a last breadcrumb in the breadcrumb navigation trail and displaying the breadcrumb navigation trail on the downloaded web page if the time interval exceeds the threshold.
• According to a further embodiment of the present invention, there is provided a program storage device, tangibly embodying a program of instructions executable by the machine to perform a dynamic client-side breadcrumbing method for improving navigation of a plurality of web pages within a Website, the method comprising the step of: storing breadcrumbs associated with web pages downloaded to a web browser from a web server associated with the Website at a client, the breadcrumbs including navigation information associated with downloaded web pages and forming a breadcrumb navigation trail according to user navigation of the web pages within the Website; setting a time stamp corresponding to the breadcrumb navigation trail and storing the time stamp at the client; downloading a subsequent web page and retrieving the time stamp corresponding to the breadcrumb navigation trail stored at the client; determining whether a time interval between the time stamp and a time corresponding to the subsequent downloaded web page exceeds a threshold; and enabling resumption of navigation according to the breadcrumb navigation trail by enabling downloading of a web page according to navigation information of a last breadcrumb in the breadcrumb navigation trail and displaying the breadcrumb navigation trail on the downloaded web page if the time interval exceeds the threshold.
• According to yet a further still a further embodiment of the present invention, there is provided a breadcrumbing engine to be embedded into a plurality of web pages within a Website for execution at a client web browser for improving navigation of the plurality of web pages within the Website, the breadcrumbing engine comprising: mechanism for generating a breadcrumb for each web page downloaded to a web browser associated with a client from a web server associated with the Website, the generated breadcrumb including navigation information for each downloaded web page; mechanism for storing breadcrumbs associated with web pages downloaded to the web browser at the client; mechanism for updating the stored breadcrumbs with the generated breadcrumb to form a breadcrumb navigation trail of breadcrumbs associated with navigation of the web pages at the Website; and mechanism for displaying the breadcrumb navigation trail on each downloaded web page for user selection.
• According to still a further embodiment, there is provided a breadcrumbing engine to be embedded into a plurality of web pages within a Website for execution at a client web browser for improving navigation of the plurality of web pages within the Website, the breadcrumbing engine comprising: mechanism for storing breadcrumbs associated with web pages downloaded to a web browser from a web server associated with the Website, the breadcrumbs including navigation information associated with downloaded web pages and forming a breadcrumb navigation trail according to user navigation of web pages at the Website; mechanism for setting a time stamp corresponding to the breadcrumb navigation trail and storing the time stamp at the client; mechanism for determining whether a time interval between the time stamp and a time corresponding to a subsequent downloaded web page exceeds a threshold; and mechanism for enabling resumption of navigation according to the breadcrumb navigation trail by enabling downloading of a web page according to navigation information of a last breadcrumb in the breadcrumb navigation trail and displaying the breadcrumb navigation trail on the downloaded web page if the time interval exceeds the threshold.
BRIEF DESCRIPTION OF THE DRAWINGS
• The objects, features and advantages of the present invention will become apparent to one skilled in the art, in view of the following detailed description taken in combination with the attached drawings, in which:
• FIG. 1 is an exemplary block diagram of a breadcrumb navigation system according to the present invention.
• FIG. 2 is an exemplary embodiment of a method flowchart for dynamically generating and maintaining a client-side breadcrumb navigation trail according to the present invention.
• FIG. 3 is an exemplary method flowchart for dynamically displaying the client-side breadcrumb navigation trail generated inFIG. 2 according to the present invention.
• FIG. 4 is another exemplary embodiment of a method flowchart for dynamically generating and maintaining a client-side breadcrumb navigation trail, and resuming navigation according to the generated client-side breadcrumb navigation trail according to the present invention.
• FIG. 5 is an exemplary web browser window depicting the generated client-side breadcrumb navigation trail according toFIGS. 1-4.
DETAILED DESCRIPTION OF THE PREFERRED EMBODIMENT OF THE INVENTION
• The present invention is directed to method and system for dynamically generating and maintaining a client-side breadcrumb navigation trail for improving navigation of a plurality of web pages within a Website.
• FIG. 1 is an exemplary block diagram of abreadcrumb navigation system100 according to the present invention. In thebreadcrumb navigation system100,Website114 comprises aweb server116, which in turn maintainsweb pages108. Although thebreadcrumb navigation system100 depicts only oneweb server116 for simplicity, it is contemplated that theWebsite114 may comprise a plurality of web servers, each comprising a plurality of web pages, for servicing client requests. According to thebreadcrumb navigation system100, theweb server116 integrates (or embeds) abreadcrumb engine112 intoweb page108, which includes HTMLdata110. Theweb server116 ofWebsite114 is interconnected via acommunications network102 toclient104. Theclient104 comprises aweb browser106 for displaying theweb page108 transmitted by theweb server116.
• In operation, a user ofclient104 utilizes theweb browser106 for transmitting a request for aweb page108, which is identified by a Uniform Resource Locator (i.e., “URL”), over thecommunications network102 toweb server114. In response to the request, theweb server116 services the request by transmitting theweb pages108 identified by the URL to theweb browser106, which displays the HTMLdata110 to the user and executes the integrated (or embedded)breadcrumb engine112. The breadcrumb engine is preferably implemented using JavaScript scripting language developed by Netscape Communications Corp. or JScript developed by Microsoft Corp. Alternatively, other scripting tools may be easily be implemented according to the teachings of the present invention. According to the present invention, thebreadcrumb navigation system100 utilizes conventional communications protocols, e.g., HyperText Transfer Protocol (i.e., “HTTP”), for communications between theweb server116 andclient104 overcommunications network102. Thebreadcrumb engine112 enhances navigation within theWebsite114 by dynamically generating, maintaining and displaying a client-side breadcrumb navigation trail, and resuming navigation according to the client-side breadcrumb navigation trail at theclient104, as particularly illustrated inFIGS. 2-5 herein below.
• FIG. 2 is an exemplary embodiment ofmethod flowchart200 for dynamically generating and maintaining a client-side breadcrumb navigation trail according to the present invention. It is assumed at this point that theclient104 has requested theweb page108 and theweb server116 has serviced the request by transmitting theweb page108 to the client'sweb browser106, which has executed thebreadcrumb engine112. Since theweb page108 is currently displayed by the client's web browser, it will be referred to as the current web page in the following description ofFIG. 2. Thebreadcrumb engine112 ofFIG. 1 executes the methodology depicted inflowchart200. A JavaScript function update_breadcrumb_navigation_trail( ) depicted in Table 2 below, illustrates a sample JavaScript code for implementing themethod flowchart200. The functions is executed within theHTML data110 by the following function call: update_breadcrumb_navigation_trail(“breadcrumb_cookie”, “remove” document.forms[0].bctitle.value, document.location). The first argument, “breadcrumb_cookie ”, is a desired name for a client-side cookie that will maintain the breadcrumbs in the breadcrumb navigation trail. One skilled in the art will appreciate that other means for maintaining the breadcrumb navigation trail at the client may be utilized, such as a file or other persistent storage. The second argument, “remove”, allows removing a breadcrumb and all subsequent breadcrumbs from the breadcrumb navigation trail if a breadcrumb associated with the current page already appears in the trail. If desired, the breadcrumb navigation trail may maintain all breadcrumbs regardless of whether a breadcrumb already appears in the breadcrumb navigation trail. The third argument, document.forms[0].bctitle.value, is comprised of a pre-built document object, which belongs to a set of pre-existing objects known as the “Document Object Model” (i.e., “DOM”) for allowing JavaScript to manipulate the current web page, i.e., such as accessing an HTML form tag within the web page, and the HTML form tag that is included in the current web page for defining an invisible title (i.e., not displayed by the web browser) for the current web page. An exemplary hidden HTML input form tag is illustrated in Table 1 below. The last argument, document.location, is a URL for the current web page. The third and fourth arguments define the breadcrumb in the breadcrumb navigation trail, which is illustrated below with reference toFIG. 2.
• Table 1 particularly illustrates an exemplary hidden HTML form tag for defining an invisible title for a web page according to the present invention.

  	TABLE 1
  	<form>
  	<input type=hidden name=bctitle value=“page3”>
  	</form>

• The method for dynamically generating, and maintaining a client-side breadcrumb navigation trail starts atstep202 ofFIG. 2. Atstep204, it is determined whether theclient104 has cookies associated with the current web page (i.e., web page108). It should be noted that a web page may have a plurality of cookies associated with it. If the cookies associated with the current page do not exist at theclient104, the method continues atstep216. If cookies associated with the current page exist at theclient104, atstep206 it is determined whether theclient104 has a breadcrumb cookie for the current web page. If the cookies for the current web page or the breadcrumb cookie for the current web page do not exist, then atstep216 breadcrumb information is set to a breadcrumb associated with the current web page. Then, at step218 a breadcrumb cookie for the current web page is created, and the method continues atstep220 described hereinafter. If the breadcrumb cookie exists, breadcrumb information is retrieved from the breadcrumb cookie atstep208. The breadcrumb cookie maintains the breadcrumb navigation trail in the following exemplary fashion: “breadcrumb_cookie=bct=page1bcu=www.page1.htmbct=page2bcu=www.page2.htmbct=page3bcu=www.page3.htm;”. The bet corresponds to the title of the breadcrumb to be displayed and the bcu corresponds to the URL of the breadcrumb to be displayed. Thus, the breadcrumb information comprises the consecutive bct-bcu pairs for breadcrumbs in the breadcrumb navigation trail. Atstep210, it is determined whether a breadcrumb associated with the current web page is in the breadcrumb information. If the breadcrumb associated with the current web page is found in the breadcrumb information, the breadcrumb and all subsequent breadcrumbs are deleted from the breadcrumb information atstep212 and the method continues to step214. However, if the breadcrumb is not found in the breadcrumb information atstep210, then atstep214 the breadcrumb for the current web page is appended to the breadcrumb information. Atstep220, the breadcrumb information is written into the breadcrumb cookie for the current web page. Atstep222, the breadcrumb information in the breadcrumb cookie is displayed on the current web page as HTML links in accordance with the method flowchart ofFIG. 3, which is described hereinafter. Atstep224, the method for dynamically generating and maintaining a client-side breadcrumb navigation trail ends.
• Table 2 particularly illustrates an exemplary JavaScript function for dynamically generating and maintaining a client-side breadcrumb navigation trail according an embodiment of the present invention.

  TABLE 2
  function update_breadcrumb_navigation_trail(cookie_name, parm, bctitle, bcurl) {
  // See whether this page in the breadcrumb cookie, then display the breadcrumbs.
  // If parm is “remove” and current page is in the cookie, delete this page and subsequent pages.
  // Add this page to the breadcrumb cookie.

  	cookie_text=“”;
  	// check whether there are cookies
  	if (document.cookie.length>0) {

  	spot = document.cookie.indexOf(cookie_name+“=”);
  	// do we have this cookie
  	if (spot>−1) {

  	// get cookie text
  	end = document.cookie.indexOf(“;”, spot);
  	if (end==−1) {

  end = document.cookie.length;

  	}
  	cookie_text = document.cookie.substring(spot+cookie_name.length+1, end);
  	spot=cookie_text.indexOf(“bct=”+bctitle);
  	// if parm is remove and this page is already there, remove it and anything after it.
  	if (parm== “remove” && spot>−1) {

  if (spot==0) {

  cookie_text=“”;

  	}
  	else {

  cookie_text = cookie_text.substr(0,spot);

  }

  }

  }

  	}
  	// add current page to cookie
  	cookie_text=cookie_text+“bct=”+bctitle+“bcu=”+bcurl;
  	document.cookie= cookie_name+“=”+cookie_text;
  	display_breadcrumb_navigation_trail(cookie_name);

  }

• FIG. 3 is anexemplary method flowchart300 for dynamically displaying the client-side breadcrumb navigation trail generated inFIG. 2 according to the present invention. Once again, it is assumed at this point that theclient104 has requested theweb page108 and theweb server116 has serviced the request by transmitting theweb page108 to the client'sweb browser106, which has executed thebreadcrumb engine112. Furthermore, since theweb page108 is currently displayed by the client's web browser, it will be referred to as the current web page in the following description ofFIG. 3. Theflowchart300 is part of thebreadcrumb engine112 ofFIG. 1. A JavaScript function display_breadcrumb_navigation_trail( ) depicted in Table 3 below, illustrates a sample JavaScript code for implementing themethod flowchart300. The function is executed by a call from function update_breadcrumb_navigation_trail( ): display_breadcrumb_navigation_trail(“breadcrumb_cookie”).
• The method for dynamically displaying the client-side breadcrumb navigation trail generated inFIG. 2 starts atstep302 ofFIG. 3. Atstep304, it is determined whether theclient104 has cookies associated with the current web page. If cookies associated with the current web page do not exist, then display method ends atstep320. If cookies associated with the current page exist at theclient104, atstep306 it is determined whether theclient104 has a breadcrumb cookie for the current web page.
• If the breadcrumb cookie does not exist, then the display method likewise ends atstep320. However, if the breadcrumb cookie for the current web page exists, then atstep308 breadcrumb information from the breadcrumb cookie is retrieved and breadcrumbs in the breadcrumb information iterated at step310-316. Atstep310, a breadcrumb from the breadcrumb information is retrieved. Atstep312, it is determined whether this breadcrumb is a last breadcrumb in the breadcrumb information. It the breadcrumb is not the last breadcrumb, then atstep314 an HTML link associated with the retrieved breadcrumb is generated. Atstep316, the generated link is displayed on the current web page by writing the HTML link into theHTML data110 of the current web page (i.e., web page108). The iteration of the breadcrumb information continues until it is determined that the last breadcrumb is retrieved from the breadcrumb information atstep312. Atstep318, the last breadcrumb is displayed as placing HTML text (i.e., not an HTML link), since the current web page is the last breadcrumb in the breadcrumb information, Atstep320, the display method ends.
• Table 3 particularly illustrates an exemplary JavaScript function for dynamically displaying the client-side breadcrumb navigation trail according to the present invention.

  TABLE 3
  function display_breadcrumb_navigation_trail(cookie_name) {

  	// check whether there are cookies
  	if (document.cookie.length>0) {

  	spot = document.cookie.indexOf(cookie_name+“=”);
  	// check whether there is this cookie
  	if (spot>−1) {

  	// get cookie text
  	end = document.cookie.indexOf(“;”, spot);
  	if (end==−1) end = document.cookie.length;
  	cookie_text = document.cookie.substring(spot, end);
  	// Loop thru the cookie text, display all titles except last title as HTML links
  	// Display last title as plain HTML text
  	spot = cookie_text.indexOf(“bct=”);
  	while (spot>−1) {

  	// get title
  	end = cookie_text.indexOf(“bcu=”,spot+4);
  	bctitle = cookie_text.substring(spot+4,end);
  	spot = cookie_text.indexOf(“bct=”,end+4);
  	if (spot==−1) {

  document.writeln(“ > ”+bctitle);

  	}
  	else {

  	bcurl=cookie_text.substring(end+4, spot);
  	document.writeln(‘ > <a

  href=“‘+bcurl+’”>’+bctitle+‘</a>’);

  }

  }

  }

  }

  }

• FIG. 4 is another exemplary embodiment of a method flowchart for dynamically generating and maintaining a client-side breadcrumb navigation trail, and resuming navigation according to the generated client-side breadcrumb navigation trail according to the present invention. As before, it is assumed that at this point theclient104 has requested theweb page108 and theweb server116 has serviced the request by transmitting theweb page108 to the client'sweb browser106, which has executed thebreadcrumb engine112. Since the client's web browser currently is displaying theweb page108, it will be referred to as the current web page in the following description ofFIG. 4. This embodiment offlowchart400 replaces the embodiment of the flowchart ofFIG. 2 as part of thebreadcrumb engine112 ofFIG. 1. A JavaScript function update_breadcrumb_navigation_trail( ) depicted in Table 4 below, illustrates a sample JavaScript code for implementing themethod flowchart400. This function is executed in like fashion to the function illustrated in Table 2 and described with regard toFIG. 2.
• The embodiment of the method for dynamically generating and maintaining a client-side breadcrumb navigation trail, and resuming navigation according to the generated client-side breadcrumb navigation trail, starts atstep402 ofFIG. 4. At step404 a revisit time is defined in the current web page, which designates a period of time after which a user returning to the web page will be prompted whether the user would like to resume navigation according to the client-side breadcrumb navigation trail dynamically generated and maintained during the user's prior visit to the web page. Furthermore, at step404 a current date and time are determined. Atstep204, it is determined whether theclient104 has cookies associated with the current web page. If there are no cookies associated with the current page at theclient104, the method continues atstep216. If cookies associated with the current page exist at theclient104, atstep206 it is determined whether theclient104 has a breadcrumb cookie for the current web page. If the cookies for the current web page or the breadcrumb cookie for the current web page do not exist, then atstep216 the breadcrumb information is set to a breadcrumb associated with the current web page. Then, at step218 a breadcrumb cookie for the current web page is created, and the method continues to step418. Atstep418, a last visit is set to the current date and time determined atstep404. The breadcrumb cookie is updated with the last visit date and time and with breadcrumb information atstep420, and atstep422 the breadcrumb information in the breadcrumb cookie is displayed as HTML links according to the method ofFIG. 3. Atstep422, the method for dynamically generating and maintaining a client-side breadcrumb navigation trail, and resuming navigation according to the client-side breadcrumb navigation trail, ends.
• However, if the breadcrumb cookie exists atstep206 ofFIG. 4, then the last visit date and time and breadcrumb information are retrieved from the breadcrumb cookie atstep406. Atstep408, it is determined whether the user had been away from the web page for a designated period of time (i.e., revisit time date and time) defined atstep404. This determination is accomplished by subtracting the last visit date and time from the current date and time and determining whether this result is greater than the revisit time. If the result is greater than the revisit time, the user is prompted atstep410 regarding whether the user would like to resume navigation according to the generated client-side breadcrumb navigation trail from the last visit. If the user chooses to continue navigation, atstep414 the last visit date and time is set to current date and time and the breadcrumb cookie is updated with this time. Then, atstep416 the last breadcrumb is retrieved from the breadcrumb information and a location for the current web page is set to the last breadcrumb (i.e., the URL associated with the last breadcrumb), thereby resulting in a request being transmitted to theweb server116 for the web page identified by the URL, which is serviced by theserver116 and transmitted to theweb browser106 for display. Thereafter, the method ends atstep422. However, if the determination atstep408 reveals that the user has not been away from the web page for the designated period of time, the method continues atstep210. Furthermore, if the user atstep410 does not want to resume navigation according to the client-side breadcrumb navigation trail from the last visit, then atstep412 all breadcrumbs are deleted from the breadcrumb information. Thereafter, the method continues to step210. Atstep210, it is determined whether a breadcrumb associated with the current web page is in the breadcrumb information. If the breadcrumb is not in the breadcrumb information, the method continues atstep214. If the breadcrumb is in breadcrumb information, atstep212 the breadcrumb and subsequent breadcrumb are deleted from the breadcrumb information. Atstep214, the breadcrumb associated with the current web page is appended to the breadcrumb information. Then the method continues fromstep418 to step420 to step222 and finally to step422, as described above.
• Table 4 particularly illustrates an exemplary JavaScript function for dynamically generating and maintaining a client-side breadcrumb navigation trail, and resuming navigation according to the client-side breadcrumb navigation trail, according an other embodiment of the present invention.

  TABLE 4
  function update_breadcrumb_navigation_trail(cookie_name, parm, bctitle, bcurl) {
  // See whether this page in the breadcrumb cookie, then display the breadcrumbs.
  // If parm is ″remove″ and current page is in the cookie, this page and subsequent pages.
  // Add this page to the breadcrumb cookie.
  // Add current date and time at the beginning of the breadcrumb cookie
  // Check this date and time to see whether user has been away for a designated amount of time
  // If user has been away longer, prompt user whether to resume navigation where user left off.

  	today = new Date( );
  	revisit_time = 1000 *60 *3; //3 min.: 1000 milliseconds * 60 sec./min. * 3
  	cookie_text=″″;
  	// check whether there are cookies
  	if (document.cookie.length>0) {

  	spot = document.cookie.indexOf(cookie_name+″=″);
  	// do we have this cookie
  	if (spot>−1) {

  	//get last visit date and time
  	spot = document.cookie.indexOf(“lastvisit=”);
  	end = document.cookie.indexOf(“bct=”,spot);
  	lastvisit = new Date (document.cookie.substring(spot+10,end));
  	// get cookie text
  	spot = end; //skip past date and time information
  	end = document.cookie.indexOf(″;″, spot);
  	if (end==−1) {

  end = document.cookie.length;

  	}
  	cookie_text = document.cookie.substring(spot+cookie_name.length+1, end);
  	// determine whether past revisit time and prompt to resume where left off.
  	if(today − lastvisit > revisit_time) {

  if(confirm(“Do you want to resume where you left off last time?”)) {

  	document.cookie = cookie_name+“=lastvisit=”+today+cookie_text;
  	spot = cookie_text.lastIndexOf(“bcu=”);
  	document.location=cookie_text.substring(spot+4);
  	return;

  	}
  	else {

  cookie_text= ″″;

  }

  	}
  	// check whether this page already in the list
  	spot=cookie_text.indexOf(″bct=″+bctitle);
  	// if parm is remove and this page is already there, remove it and anything after it.
  	if (parm==″remove″ && spot>−1) {

  if (spot==0) {

  cookie text= ″″;

  	}
  	else {

  cookie_text = cookie_text.substr(0,spot);

  }

  }

  }

  	}
  	// add date and time and current page to cookie
  	cookie_text=cookie_text+″bct=″+bctitle+″bcu=″+bcurl;
  	document.cookie= cookie_name+″=lastvisit=″+today+cookie_text;
  	display_breadcrumb_navigation_trail(cookie_name);

  }

• FIG. 5 is an exemplaryweb browser window500 depicting the dynamically generated and maintained client-sidebreadcrumb navigation trail514 according toFIGS. 1-4. As depicted inFIG. 5, theweb browser window500 includes atitle bar502, amenu504, a plurality ofbuttons506, alocation input field508 and astatus bar518, all of which perform a variety of functions. Theweb browser window500 is produced by a Netscape Communicator web browser of Netscape Communications. Other web browsers, such as Internet Explorer by Microsoft Corporation, may likewise be implemented to take advantage of the present invention. Theweb browser window500 displays aweb page510 that includes a plurality ofHTML links512, abreadcrumb navigation trail514 and a plurality oftabs516 for navigation within an IBM Website (i.e., identified by www.IBM.com), comprising a plurality of web servers and web pages. The displayedweb page510 is downloaded by theweb browser106 from theweb server116 ofFIG. 1 and provides a user with information content. The user interacts with the browser window and the displayed web page by using a pointing device (e.g., a mouse). According to the present invention, the displayedweb page510 includesHTML data110 for providing information content to the user and abreadcrumb engine112 for dynamically generating and maintaining a client-side breadcrumb navigation trail, and resuming navigation according to the client-side breadcrumb navigation trail.
• While the invention has been particularly shown and described with respect to preferred embodiments thereof, it will be understood by those skilled in the art that the foregoing and other changes in form and details may be made therein without departing from the spirit and scope of the invention, as particularly embodied in the appended claims.

Claims (33)

1. A dynamic client-side breadcrumbing method for improving navigation of a plurality of web pages within a Website, the method comprising:

(a) generating a breadcrumb for each web page downloaded to a web browser associated with a client from a web server associated with the Website, the generated breadcrumb including navigation information for each downloaded web page;

(b) storing breadcrumbs associated with web pages downloaded to the web browser at the client;

(c) updating the stored breadcrumbs with the generated breadcrumb to form a breadcrumb navigation trail of breadcrumbs associated with navigation of the web pages at the Website; and

(d) displaying the breadcrumb navigation trail on each downloaded web page for user selection.

2. The method according toclaim 1, wherein the navigation information includes a title and a uniform resource locator for each downloaded web page.

3. The method according toclaim 1, further comprising a step of creating a client-side cookie for storing the breadcrumbs associated with web pages downloaded to the web browser.

4. The method according toclaim 2, further comprising a step of providing the title associated with each downloaded web page within each download web page.

5. The method according toclaim 1, wherein a web server associated with the Website embeds a breadcrumbing engine into each web page before each web page is downloaded to the web browser, the breadcrumbing engine enabled for performing step (a)-(d).

6. The method according toclaim 1, wherein the web browser executes the breadcrumbing engine embedded into each web page after downloading each web page.

7. The method according toclaim 1, wherein the step of updating the stored breadcrumbs further comprises a step of determining whether the breadcrumb for each downloaded web page is already stored at the client.

8. The method according toclaim 7, wherein the step of updating the stored breadcrumbs further comprises a step of removing the breadcrumb and subsequent breadcrumbs from the stored breadcrumbs if the breadcrumb is determined to be stored at the client.

9. The method according toclaim 8, wherein the step of updating the stored breadcrumbs further comprises appending the breadcrumb to existing breadcrumbs stored at the client to form the breadcrumb navigation trail if the breadcrumb is determined not to be stored at the client.

10. The method according toclaim 3, wherein the step of creating further comprises the steps of:

determining whether the client has a client-side cookie and creating the client-side cookie if the client does not have it; and

setting a breadcrumb generated for a downloaded web page into the client side cookie.

11. The method according toclaim 1, wherein the step of displaying the navigation trail further comprises the following steps:

iterating thru the breadcrumbs in the breadcrumb navigation trail; and

displaying a last breadcrumb in the breadcrumb navigation trail as plain HyperText Markup Language (HTML) and displaying preceding breadcrumbs as HTML links to corresponding web pages.

12. A dynamic client-side breadcrumbing system for improving navigation of a plurality of web pages within a Website, the system comprising:

(a) a web server associated with the Website transmitting web pages requested by a client, the web pages embedding a breadcrumbing engine; and

(b) a web browser associated with the client downloading the web pages and executing the breadcrumbing engine, the breadcrumbing engine for:

i) generating a breadcrumb for each web page downloaded to the web browser, the generated breadcrumb including navigation information for each downloaded web page,

ii) storing breadcrumbs associated with web pages downloaded to the web browser at the client,

iii) updating the stored breadcrumbs with the generated breadcrumb to form a breadcrumb navigation trail of breadcrumbs associated with navigation of the web pages at the Website, and

iv) displaying the breadcrumb navigation trail on each downloaded web page for user selection.

13. The dynamic client-side breadcrumbing system according toclaim 12, wherein the navigation information includes a title and a uniform resource locator for each downloaded web page.

14. The dynamic client-side breadcrumbing system according toclaim 12, wherein the breadcrumbing engine is further for creating a client-side cookie to store breadcrumbs associated with web pages downloaded to the web browser.

15. The dynamic client-side breadcrumbing system according toclaim 13, wherein a title associated with each downloaded web page is provided within each downloaded web page.

16. The dynamic client-side breadcrumbing system according toclaim 12, wherein the web server embeds the breadcrumbing engine into each web page before each web page is downloaded to the web browser.

17. The dynamic client-side breadcrumbing system according toclaim 12, wherein the breadcrumbing engine further comprises determining whether the breadcrumb for each downloaded web page is stored at the client.

18. The dynamic client-side breadcrumbing system according toclaim 17, wherein the breadcrumbing engine further comprises removing the breadcrumb and subsequent breadcrumbs from stored breadcrumbs if the breadcrumb is determined to be stored at the client.

19. The dynamic client-side breadcrumbing system according toclaim 18, wherein the breadcrumbing engine further comprises appending the breadcrumb to preceding breadcrumbs stored at the client if the breadcrumb is determined not to be stored at the client.

20. The dynamic client-side breadcrumbing system according toclaim 14, wherein the breadcrumbing engine farther comprises determining whether the client has the client-side cookie and creating the client side cookie if the client does not have it, and the breadcrumbing engine further setting a breadcrumb generated for a downloaded web page into the client side cookie.

21. The dynamic client-side breadcrumbing system according toclaim 12, wherein the breadcrumbing engine further comprises iterating thru the breadcrumbs in breadcrumb navigation trail and displaying a last breadcrumb in the breadcrumb navigation trail as plain HyperText Markup Language (HTML) and displaying preceding breadcrumbs as HTML links.

22. A program storage device, tangibly embodying a program of instructions executable by the machine to perform a dynamic client-side breadcrumbing method for improving navigation of a plurality of web pages within a Website, the method comprising:

(a) generating a breadcrumb for each web page downloaded to a web browser associated with a client from a web server associated with the Website, the generated breadcrumb including navigation information for each downloaded web page;

(b) storing breadcrumbs associated with web pages downloaded to the web browser at the client;

(c) updating the stored breadcrumbs with the generated breadcrumb to form a breadcrumb navigation trail of breadcrumbs associated with navigation of the web pages at the Website; and

(d) displaying the breadcrumb navigation trail on each downloaded web page for user selection.

23. The program storage device according toclaim 22, wherein the navigation information includes a title and a uniform resource locator for each downloaded web page.

24. The program storage device according toclaim 22, the method further comprising creating a client-side cookie to store breadcrumbs associated with web pages downloaded to the web browser.

25. The program storage device according toclaim 23, the method further comprising a step of providing the title associated each downloaded web page within each download web page.

26. The program storage device according toclaim 22, wherein a web server associated with the Website embeds a breadcrumbing engine into each web page before each web page is downloaded to the web browser, the breadcrumbing engine enabled for performing step (a)-(d).

27. The program storage device according toclaim 22, wherein the web browser executes the breadcrumbing engine embedded into each web page after downloading each web page.

28. The program storage device according toclaim 22, wherein the method step of updating stored breadcrumbs further comprises a step of determining whether the breadcrumb for each downloaded web page is already stored at the client.

29. The program storage device according toclaim 28, wherein the method step of updating the stored breadcrumbs further comprises a step of removing the breadcrumb and subsequent breadcrumbs from the stored breadcrumbs if the breadcrumb is determined to be stored at the client.

30. The program storage device according toclaim 29, wherein the method step of updating the stored breadcrumbs further comprises a step of appending the breadcrumb to existing breadcrumbs stored at the client to form the breadcrumb navigation trail if the breadcrumb is determined not to be stored at the client,

31. The program storage device according toclaim 24, wherein the step of creating farther comprises the steps of:

determining whether the client has a client-side cookie and creating the client-side cookie if the client does not have it; and

setting a breadcrumb generated for a downloaded web page into the client side cookie.

32. The program storage device according toclaim 22, wherein the method step of displaying the navigation trail further comprises the following steps:

iterating thru the breadcrumbs in the breadcrumb navigation trail; and

displaying a last breadcrumb in the breadcrumb navigation trail as plain HyperText Markup Language (HTML) and displaying preceding breadcrumbs as HTML links to corresponding web pages.

33. A breadcrumbing engine to be embedded into a plurality of web pages within a Website for execution at a client web browser for improving navigation of the plurality of web pages within the Website, the breadcrumbing engine comprising:

(a) mechanism for generating a breadcrumb for each web page downloaded to a web browser associated with a client from a web server associated with the Website, the generated breadcrumb including navigation information for each downloaded web page;

(b) mechanism for storing breadcrumbs associated with web pages downloaded to the web browser at the client;

(c) mechanism for updating the stored breadcrumbs with the generated breadcrumb to form a breadcrumb navigation trail of breadcrumbs associated with navigation of the web pages at the Website; and

(d) mechanism for displaying the breadcrumb navigation trail on each downloaded web page for user selection.

Images