Automatic web page thumbnail generation

[0002] The present application is related to copending U.S. patent application Ser. No. 09/364,696 entitled “Navigation Assistant—Method and Apparatus for Providing User Configured Complementary Information for Data Browsing in a Viewer Context”), U.S. patent application Ser. No. 09/364,740 entitled “Web Page Thumbnails and User Configured Complementary Information Provided from a Server”), U.S. patent application Ser. No. 09/364,693 entitled “Method and System for Providing a Graphical Tree View of Web Pages”), and U.S. patent application Ser. No. 09/364,695 entitled “Web Page Thumbnails with Active Hot Links”) filed even date herewith. The above mentioned patent applications are assigned to the assignee of and share the same inventors as the present invention. The content of the cross referenced copending applications are hereby incorporated herein by reference.

[0003] 1. Technical Field

[0004] The invention relates generally to the field of computer software and, more specifically, to Internet related computer software.

[0005] 2. Description of Related Art

[0006] The “Internet” is a globally accessible network of computers that collectively provide a large amount and variety of information to users. From services of the Internet such as the World Wide Web (or simply, the “web”), users may retrieve or “download” data from Internet network sites and display the data that includes information presented as text in various fonts, graphics, images, and the like having an appearance intended by the publisher. As the information revolution has exploded, more and more information is available through the internet. However, finding particular pieces of information out of the millions of “web sites” available can be daunting.

[0007] One way of sorting through this mass of information to find what is of interest for a particular user is through the use of “search engines”. Search engines are software written to search, among the millions of web sites, for certain key words or criteria entered by a user, and to return to the user a list of links (references to other HTML pages) to the sites that the search engine determines to be relevant to the criteria entered by the user. Different search engines use different methods of determining the relevance of web sites, but most use some sort of quantitative method that determines the relevance of a site based on how many times the key words appear in that particular site.

[0008] Search engines typically return a list of links to relevant sites with perhaps a short verbal description of the site. A typical example of a screen image returned by a search engine is illustrated in FIG. 1. Notice that each link is represented only with a textual name followed by a short textual description of the linked page. Often times, this does not provide sufficient information to enable one to make an intelligent decision as to whether to follow the link. Thus, the user is left with the time consuming task of sorting through the links returned by the search engine to determine which of these is the best match. Furthermore, there is no way for a user to determine based on the search engine results whether the site or web page is still active or if it has been removed.

[0009] Similar problems exist with regard to following links from one web page to another (sometimes referred to as “web surfing”). Often times, users find the information they are looking for by following links on web pages, but the same problem exists here as with search engines. Many times, the links will have only short descriptions about the contents of the web page to which they link—usually, just a highlighted word. Furthermore, a web page will often contain a dead link and there is no way the user can determine this except by trial and error. Therefore, it would be beneficial for Internet users to have a tool to enable them to make more informed decisions about which links to follow.

[0010] The present invention provides a method for presenting content from the page in a distributed database. In a preferred embodiments a page of data from the database is presented to a user. The page has a plurality of links to linked pages in the database. A set of thumbnail images of the linked pages in the database is presented to the user near the links to the linked pages.

[0011] The novel features believed characteristic of the invention are set forth in the appended claims. The invention itself, however, as well as a preferred mode of use, further objectives and advantages thereof, will best be understood by reference to the following detailed description of an illustrative embodiment when read in conjunction with the accompanying drawings, wherein:

[0012] FIG. 1 shows a typical screen image result for current Internet search engines;

[0013] FIG. 2 shows a pictorial representation of a distributed data processing system in which the present invention may be implemented;

[0014] FIG. 3 shows a block diagram of a data processing system which may be implemented as a server in accordance with the present invention;

[0015] FIG. 4 shows a block diagram of a data processing system in which the present invention may be implemented;

[0016] FIG. 5 depicts a block diagram of a browser program in accordance with a preferred embodiment of the present invention;

[0017] FIG. 6 shows a flowchart for an overview of a preferred embodiment of the present invention;

[0018] FIG. 7 shows a more detailed flow chart for a preferred embodiment of the present invention;

[0019] FIG. 8 shows a screen image for search results with thumbnails placed in-line near a respective link;

[0020] FIG. 9 shows a screen image for search results from a search engine with some thumbnails having a border;

[0021] FIG. 10 shows a screen image for search results from a search engine with modified thumbnails;

[0022] FIG. 11 shows a flowchart for a preferred embodiment of the present invention using pup-up thumbnails;

[0023] FIG. 12 shows a screen image of search results from a search engine illustrating pup-up thumbnails;

[0024] FIG. 13 shows a flowchart for a preferred embodiment of the present invention using a thumbnail palette; and

[0025] FIG. 14 shows a screen image of search results with thumbnails of links displayed in a separate window.

[0026] With reference now to the figures, and in particular with reference to FIG. 2, a pictorial representation of a distributed data processing system is depicted in which the present invention may be implemented.

[0027] Distributed data processing system 200 is a network of computers in which the present invention may be implemented. Distributed data processing system 200 contains network 202, which is the medium used to provide communications links between various devices and computers connected within distributed data processing system 200. Network 202 may include permanent connections, such as wire or fiber optic cables, or temporary connections made through telephone connections. In the depicted example, server 204 is connected to network 202, along with storage unit 206. In addition, clients 208, 210 and 212 are also connected to network 202. These clients, 208, 210 and 212, may be, for example, personal computers or network computers. For purposes of this application, a network computer is any computer coupled to a network which receives a program or other application from another computer coupled to the network. In the depicted example, server 204 provides data, such as boot files, operating system images and applications, to clients 208-212. Clients 208, 210 and 212 are clients to server 204. Distributed data processing system 200 may include additional servers, clients, and other devices not shown.

[0028] In the depicted example, distributed data processing system 200 is the Internet, with network 202 representing a worldwide collection of networks and gateways that use the TCP/IP suite of protocols to communicate with one another. At the heart of the Internet is a backbone of high-speed data communication lines between major nodes or host computers consisting of thousands of commercial, government, education, and other computer systems that route data and messages. Of course, distributed data processing system 200 also may be implemented as a number of different types of networks such as, for example, an Intranet, the World Wide Web (“WWW”), or a local area network.

[0029] FIG. 2 is intended as an example and not as an architectural limitation for the processes of the present invention.

[0030] Referring to FIG. 3, a block diagram of a data processing system which may be implemented as a server, such as server 204 in FIG. 2, is depicted in accordance with the present invention. Data processing system 300 may be a symmetric multiprocessor (SMP) system including a plurality of processors 302 and 304 connected to system bus 306. Alternatively, a single processor system may be employed. Also connected to system bus 306 is memory controller/cache 308, which provides an interface to local memory 309. I/O bus bridge 310 is connected to system bus 306 and provides an interface to I/O bus 312. Memory controller/cache 308 and I/O bus bridge 310 may be integrated as depicted.

[0031] Peripheral component interconnect (PCI) bus bridge 314 connected to I/O bus 312 provides an interface to PCI local bus 316. A number of modems 318-320 may be connected to PCI bus 316. Typical PCI bus implementations will support four PCI expansion slots or add-in connectors. Communications links to network computers 208-212 in FIG. 2 may be provided through modem 318 and network adapter 320 connected to PCI local bus 316 through add-in boards.

[0032] Additional PCI bus bridges 322 and 324 provide interfaces for additional PCI buses 326 and 328, from which additional modems or network adapters may be supported. In this manner, server 300 allows connections to multiple network computers. A memory mapped graphics adapter 330 and hard disk 332 may also be connected to I/O bus 312 as depicted, either directly or indirectly.

[0033] Those of ordinary skill in the art will appreciate that the hardware depicted in FIG. 3 may vary. For example, other peripheral devices, such as optical disk drives and the like, also may be used in addition to or in place of the hardware depicted. The depicted example is not meant to imply architectural limitations with respect to the present invention.

[0034] The data processing system depicted in FIG. 3 may be, for example, an IBM RS/6000 workstation, a product of International Business Machines Corporation in Armonk, N.Y., running the Advanced Interactive Executive (AIX) operating system.

[0035] With reference now to FIG. 4, a block diagram of a data processing system in which the present invention may be implemented is illustrated. Data processing system 400 is an example of a client computer. Data processing system 400 employs a peripheral component interconnect (PCI) local bus architecture. Although the depicted example employs a PCI bus, other bus architectures, such as Micro Channel and ISA, may be used. Processor 402 and main memory 404 are connected to PCI local bus 406 through PCI bridge 408. PCI bridge 408 may also include an integrated memory controller and cache memory for processor 402. Additional connections to PCI local bus 406 may be made through direct component interconnection or through add-in boards. In the depicted example, local area network (LAN) adapter 410, SCSI host bus adapter 412, and expansion bus interface 414 are connected to PCI local bus 406 by direct component connection. In contrast, audio adapter 416, graphics adapter 418, and audio/video adapter (A/V) 419 are connected to PCI local bus 406 by add-in boards inserted into expansion slots. Expansion bus interface 414 provides a connection for a keyboard and mouse adapter 420, modem 422, and additional memory 424. In the depicted example, SCSI host bus adapter 412 provides a connection for hard disk drive 426, tape drive 428, CD-ROM drive 430, and digital video disc read only memory drive (DVD-ROM) 432. Typical PCI local bus implementations will support three or four PCI expansion slots or add-in connectors.

[0036] An operating system runs on processor 402 and is used to coordinate and provide control of various components within data processing system 400 in FIG. 4. The operating system may be a commercially available operating system, such as OS/2, which is available from International Business Machines Corporation. “OS/2” is a trademark of International Business Machines Corporation. An object oriented programming system, such as Java, may run in conjunction with the operating system, providing calls to the operating system from Java programs or applications executing on data processing system 400. Instructions for the operating system, the object-oriented operating system, and applications or programs are located on a storage device, such as hard disk drive 426, and may be loaded into main memory 404 for execution by processor 402.

[0037] Those of ordinary skill in the art will appreciate that the hardware in FIG. 4 may vary depending on the implementation. For example, other peripheral devices, such as optical disk drives and the like, may be used in addition to or in place of the hardware depicted in FIG. 4. The depicted example is not meant to imply architectural limitations with respect to the present invention. For example, the processes of the present invention may be applied to multiprocessor data processing systems.

[0038] Turning next to FIG. 5, a block diagram of a browser program is depicted in accordance with a preferred embodiment of the present invention. Browser 500 includes a user interface 502, which is a graphical user interface (GUI) that allows the user to interface or communicate with browser 500. This interface provides for selection of various functions through menus 504 and allows for navigation through navigation 506. For example, menu 504 may allow a user to perform various functions, such as saving a file, opening a new window, displaying a history, and entering a URL. Navigation 506 allows for a user to navigate various pages and to select web sites for viewing. For example, navigation 506 may allow a user to see a previous page or a subsequent page relative to the present page. Preferences may be set through preferences 508.

[0039] Communications block 510 is the mechanism with which browser 500 receives documents and other resources from a network such as the Internet. Further, communications 510 is used to send or upload documents and resources onto a network. Thumbnail Assistant 516 intercepts and parses documents after communications 510 receives documents, but prior to processing by language interpretation 512. After parsing documents, thumbnail assistant 516 generates thumbnail images of linked pages to a loaded web page and displays these thumbnails to a user on a client machine. In the depicted example, communication 510 uses HTTP. Documents that are received by browser 500 are processed by language interpretation 512, which includes an HTML unit 514. Language interpretation 512 will process a document for presentation on graphical display 518. In particular, HTML statements are processed by HTML unit 514 for presentation. Alternatively, and preferably, parsing can be performed once and the result then passed to the thumbnail assistant 516 to generate the thumbnails and then the thumbnails are passed to the graphical display.

[0040] Graphical display 518 includes layout unit 520, rendering unit 522, and window management 524. These units are involved in presenting web pages to a user based on results from language interpretation 512.

[0041] In the present example, thumbnail assistant 516 is depicted as a “plug-in” module to browser 500. Plug-in refers to a file containing data or application software used to alter, enhance, or extend the operation of a parent application program. For example, the Netscape Navigator World-Wide Web browser supports plug-ins. However, although the “plug-in” module is the preferred embodiment, thumbnail assistant 516 could be incorporated into browser 500 as a direct modification of code.

[0042] Furthermore, thumbnail assistant 516 could be utilized on a proxy server, wherein thumbnail assistant 516 pre-generates web pages on a web server prior to receipt by browser 500. In this instance, which would be preferred for legacy browsers, the server would modify the stream sent to the user and place references to the thumbnails in that stream. Another method would be to send the information in a separate stream, provided the user is prepared to expect a separate stream. The user would then overlay this additional information and place it somewhere else, such as in a separate window, or simply ignore it, depending on the user's preference.

[0043] Browser 500 is presented as an example of a browser program in which the present invention may be embodied.

[0044] Browser 500 is not meant to imply architectural limitations to the present invention. Presently available browsers may include additional functions not shown or may omit functions shown in browser 500.

[0045] Turning now to FIG. 6, a flowchart illustrating an overview of a preferred embodiment of the present invention is shown. As a user opens a first web page (step 610) with web browser 500, thumbnail assistant 516 parses the web page for links to other web pages (step 615). Thumbnail assistant 516 then prefetches the web pages associated with the links found in the first web page (step 620). Thumbnail assistant 516 then generates thumbnail images for each linked web page (step 625) and determines the appropriate placement of the thumbnail images (step 630). These thumbnails are then displayed to the user (step 635).

[0046] A more detailed understanding of a preferred embodiment of the present invention is disclosed with reference to the flowchart illustrated in FIG. 7. As web browser 500 opens a web page (step 710), thumbnail assistant 516 determines whether the user has selected the thumbnail option (step 715). If the thumbnail option has not been selected, then web browser 500 displays the web page without thumbnails in the customary fashion (step 720).

[0047] If the thumbnail option has been selected, then thumbnail assistant 516 parses the web page for links to other web pages (step 725). Thumbnail assistant 516 then checks the cache for linked pages and prefetches the linked pages that are not in the cache (step 730) using the prefetch mechanism associated with web browser 516. Thumbnail assistant 516 then generates thumbnails of each linked page that does not already have a thumbnail in the cache (step 735) and then stores the newly generated thumbnails in the cache (step 740).

[0048] Next, thumbnail assistant 516 determines whether a filtering program such as Net-Nanny or Digital Assistant is being used in conjunction with the thumbnail assistant (step 745). If no filtering program is being used, then thumbnail assistant displays, via the browsers display mechanism, the thumbnails to the user (step 750). In one preferred embodiment, the thumbnails are displayed in-line (that is each thumbnail is placed below the preceding thumbnail in a vertical line) near the corresponding link on the currently displayed web page as illustrated in FIG. 8.

[0049] Placement of thumbnails by the browser is largely dependent upon the configuration of the user. In some cases, such as with a legacy browser, placement may not be optional or, perhaps, the browser may not even be aware of the thumbnails. In a preferred embodiment of the present invention, thumbnails are automatically displayed in-line near the corresponding link on the currently displayed web page. Alternatively, the user might be queried for placement preferences, such as maximum distance from the link or preferred placement in terms of top, right, left, below, above, separate, etc.

[0050] Also illustrated in FIG. 8 is a pointer 800 that allows a user to select various areas of a display. Pointer 800 may be manipulated, for example, by means of a mouse, a stylus pen, a joystick, or arrow keys. However, these are just a few methods of manipulating a pointer. Other examples are well known to those skilled in the art.

[0051] If a filtering program is being used, then thumbnail assistant 516 waits while the filtering program parses the prefetched linked page for user configured preferences (step 755). If user configured preferences are not found, then the thumbnails are displayed unmodified (step 750). However, if preferences are found, then the thumbnails corresponding to linked pages that match user configured preferences are modified in a user configured manner (step 765) and then the modified thumbnails are displayed to the user (step 770). Steps 745 through 770 are preferably performed while the thumbnails are being generated (step 735), but can be performed after the thumbnails have been generated (step 735) as well.

[0052] An example of using a filtering program in conjunction with the thumbnail generation is a user configuring a preference to flag any page containing the words “Shania Twain”, “49er's”, “Java Programming”, etc. While the user was viewing one page, for example, the results of a search from a search engine, the thumbnails would be built and placed inline. While the thumbnails were being built, the filter program would scan the source of the thumbnails, discover the words, and change the image border around the thumbnails corresponding to linked pages that match the criteria.

[0053] Refresh of the search page once the thumbnails are built can be achieved several ways. The first way is to place the highlighting around the thumbnail image as it is being built. That is, make it part of the thumbnail image itself. In this way, the source can be delivered, parsed and rendered, with a location held open for the loading of the thumbnail as it becomes available. The second method is to update the source to draw the box before it is sent to the user. This would require that the links be parsed prior to sending the source page to the user. Better methods include causing a live update to the page. This might be achieved in several different ways, including triggering scripting, that is, sending the information to the client, and having the browser act on it by drawing the box itself, that is, forcing a reload of the page and, therefore, allowing one of the first two methods to occur.

[0054] An example illustrating this method of display is shown in FIG. 9 wherein links 1 and 4 have a border around their respective thumbnails. The thumbnail borders could be colored. For example, if the linked page contained some of the words, the thumbnail image border could be green, whereas, if more than a threshold of word(s) were encountered, the border could be changed to yellow or red. This could be achieved in several ways.

[0055] In another example illustrating the combination of filtering programs with thumbnail generation is shown in FIG. 10. In this example, the filtering program has detected undesirable content on the first linked page displayed in the search results. Thus, the thumbnail has been modified to have a diamond with “do not enter” written on it placed over the thumbnail image. These are but a few examples of modifications that can be made to the thumbnails and are not meant to be exhaustive. Other modifications to the thumbnail images, such as to indicate the presence of a dead link, will be obvious to those skilled in the art.

[0056] Turning now to FIG. 11, a flow chart depicting another preferred embodiment of the present invention using pop-up thumbnails is shown. As web browser 500 downloads a web page (step 1110), thumbnail assistant 516 parses the web page for links to other web pages (step 1115). The prefetch mechanism of web browser 500 then prefetches these linked web pages (step 1120). Thumbnail assistant 1125 then generates thumbnails for each of the linked pages and stores them in the cache (step 1125).

[0057] Thumbnail assistant 516 monitors the pointer location (step 1130) to determine if the pointer is located over a link on the currently viewed web page (step 1135). If the pointer is not over a link, then thumbnail assistant 516 continues to monitor the pointer (step 1130). However, if the pointer is over an active area associated with a link (step 1135), then thumbnail assistant 516 displays the thumbnail associated with that link. Preferably, the thumbnail is displayed near the link. An example of a pop-up is illustrated in FIG. 12 where the pointer is over link number 2 and a thumbnail image of that linked page is displayed near the pointer.

[0058] Thumbnail assistant 516 monitors user input (step 1145) to determine if the user has selected the linked web page whose thumbnail is currently displayed. If yes, then web browser 500 opens and displays the new page and then the process continues with the new page being parsed for links (step 1115) as before.

[0059] If the user has not selected the link (step 1150), thumbnail assistant 516 determines if the pointer has moved off of the area of the link (step 1160). If the pointer has not moved away from the active area, thumbnail assistant 516 continues to display the thumbnail and continues to monitor user input (step 1145). If the pointer has moved away from the active area (step 1160), then thumbnail assistant removes the thumbnail from the display (step 1165) and starts to monitor the pointer location (step 1130) again.

[0060] In another embodiment of the pop-up thumbnails, rather than generating and displaying thumbnails of the web pages associated with links, an icon representing the domain of that link could be generated and displayed next to the text representing the link. For example, if the domain is associated with Yahoo, then an icon displaying the Yahoo logo might be displayed next to the link. Furthermore, the icon could be assigned by the user or by the domain itself, and picked up automatically by the browser. This icon would then pop-up next to the link as the pointer moves over the link, just as the thumbnail does in the example depicted in FIG. 12.

[0061] Three methods might be implemented in order to produce these iconic representations of web page links. In the first case, this information could be embedded in the source. In the second instance, assuming the user recognizes the icon as a link, the user would then check the associated domain location, as opposed to a database (local or remote or both), and retrieve the icon. This would be the preferred method, given that the source would not have to be modified. Finally, the third alternative method for producing these icons is to send the information via a separate protocol/communication with the server.

[0062] In a further modification, the icon could be presented along with the thumbnail image of the associated linked page.

[0063] Turning now to FIG. 13, a flow chart illustrating another preferred embodiment of the present invention is shown, in which the thumbnails are displayed in a separate frame window. As web browser 500 opens and loads a web page (step 1305), thumbnail assistant 516 parses the web page for links to other web pages (step 1310). Thumbnail assistant 516 then checks the cache to determine if any of the linked pages have been previously loaded, whether thumbnail images have already been generated, and then prefetches linked pages that have not been cached (step 1315). Thumbnail assistant 516 then generates thumbnails for each linked page for which a thumbnail has not previously been generated (step 1320). Next, a new frame window is opened, and a thumbnail for each page is displayed in a vertically scrollable list in the new frame window (step 1325).

[0064] An example of a new, or second frame window with thumbnails arranged in a vertically scrollable list is illustrated in FIG. 14. FIG. 14 shows search results returned by a search engine, displayed in a two page view with search results on the left and thumbnails representing the first page of each linked page displayed in a vertically scrollable list on the right. Depending upon user configurations, one example of how this might work would be for the user to notify the secondary window of primary window mouse movements (i.e., to indicate which element/link the mouse is over) and to set secondary window preferences to match the link in the first window by automatically scrolling to the associated link in the secondary window. Further, the user might also select a setting to cause both the original link and the secondary link to be highlighted, forming a visual association between the two for the user.

[0065] Although described as presented to the user as a vertically scrollable list in a two page view, the thumbnails could be presented to the user in other manners. Some examples of other display options include, but are not limited to, a horizontally scrollable list in the same frame window, as a vertically scrollable list in the same frame window, arranged around the perimeter of the browser frame, in a dragable palette that can be torn off from the owning frame and then resized, and in a separate frame window. Other equivalent examples of displaying the thumbnails will be obvious to one skilled in the art.

[0066] As used to describe the present invention, the term thumbnail has been used to describe a small picture representing a visual summary of a bigger picture which is typically of a web page. Furthermore, the thumbnails can be of arbitrary size. Also, the thumbnails could be resizable. Methods of generating thumbnails are well known to those skilled in the art.

[0067] Although described in the context of and is particularly applicable to the Internet, the present invention is equally applicable to displaying linked documents on an Intranet, Local Area Networks (“LANs”), and Wide Area Networks (“WANs”) as well.

[0068] The present invention has been described primarily with reference to a hyperlinked database. It should be noted, however, that the term “hyperlinked database” as used herein includes the Internet and the World Wide Web. However, other hyperlinked documents are known to the art.

[0069] It is important to note that a set of thumbnails, as described herein, may refer to one or to a plurality of thumbnails. It is also important to note that the thumbnail images may be resizable to allow a user to customize the display to taste.

[0070] Although the present invention has been described primarily with reference to HTML documents, the present invention applies to other document formats and markup languages as well. For example, such other markup languages include, but are not limited to, Extensible Markup Language (XML), Vector Markup Language (VML), Virtual Reality Markup Language (VRML), Dynamic Hypertext Markup Language (DHTML), and Extended Hypertext Markup Language (XHTML). An example of other document formats includes, but is not limited, to a Postscript Document Format (PDF).

[0071] It is important to note that while the present invention has been described in the context of a fully functioning data processing system, those of ordinary skill in the art will appreciate that the processes of the present invention are capable of being distributed in the form of a computer readable medium of instructions and a variety of forms and that the present invention applies equally regardless of the particular type of signal bearing media actually used to carry out the distribution. Examples of computer readable media include recordable-type media such a floppy disc, a hard disk drive, a RAM, and CD-ROMs and transmission-type media such as digital and analog communications links.

[0072] The description of the present invention has been presented for purposes of illustration and description, but is not intended to be exhaustive or limited to the invention in the form disclosed. Many modifications and variations will be apparent to those of ordinary skill in the art. The embodiment was chosen and described in order to best explain the principles of the invention, the practical application, and to enable others of ordinary skill in the art to understand the invention for various embodiments with various modifications as are suited to the particular use contemplated.