Information display method and device
By displaying overview information and multi-level title jump function in long pages, the problem that users find it difficult to understand the page content module and its hierarchy is solved, and the efficiency of browsing and information search for long pages is significantly improved.
Patent Information
- Application Number
- CN202411899407.2
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-12-20
- Publication Date
- 2025-04-15
- Estimated Expiration
- Not applicable · inactive patent
AI Technical Summary
The existing long page design makes it difficult for users to understand the page content module and its hierarchy, thereby reducing the efficiency of browsing and information search.
It provides an information display method, which displays overview information of the page by responding to the page opening instructions and the first event, including multi-level titles corresponding to the multi-level content module, and supports the jump or positioning function of multi-level titles.
Users can quickly understand the page content module and hierarchy, improve the efficiency of browsing and information search for long pages, especially the efficiency of repeated search for multi-level content modules.
Smart Images

Figure CN119829853A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the field of Internet application technology, and in particular to an information display method and device. Background Art
[0002] With the development of the Internet and mobile terminal technology, users are increasingly using applications to browse a variety of pages. For example, users often browse shopping pages through shopping applications, or browse pages showing song information through music applications. Currently, most pages are designed as long pages. Long pages usually contain more content modules, so how to improve the browsing and information search efficiency of long pages is a problem that needs to be solved. Summary of the invention
[0003] The present application provides an information display method and device to improve the efficiency of browsing long pages and searching for information.
[0004] In a first aspect, an information display method is provided, comprising: in response to an opening instruction of a page, displaying part of the content of the page, the page comprising a multi-level content module; in response to a first event for the page, displaying overview information of the page, the overview information comprising multi-level titles corresponding to the multi-level content modules.
[0005] Based on the overview information of the page, users can quickly understand what content modules the page contains and the hierarchical structure between these content modules, thereby improving the efficiency of browsing and information searching on long pages.
[0006] In some implementations, the multi-level title includes a target title, and the target title corresponds to a target content module in the multi-level content module. The method also includes: in response to a selection operation on the target title, jumping to a target page position in the page, and the target page position is a page position where the target content module is located.
[0007] Setting page jump or positioning functions for multi-level titles can help users quickly locate the content modules they are interested in, further improving the efficiency of browsing and information search on long pages. In addition, if users need to search for a certain content module multiple times, the jump or positioning function can significantly improve the efficiency of repeated searches for the same content module.
[0008] In some implementations, the method further includes: displaying a first page element corresponding to the target title, wherein the first page element is used to indicate that the target title supports a jump operation, and the jump operation is used to jump to the target page location.
[0009] By displaying the first page element, the user can be reminded that the title in the overview information supports the jump function, thereby preventing the user from always browsing the page manually.
[0010] In some implementations, the multi-level title includes a first-level title and a second-level title under the first-level title, and the target title is the first-level title or the second-level title.
[0011] In some implementations, the operation of selecting the target title includes a click operation on the target title.
[0012] In some implementations, the first event includes: an event triggered based on a second page element, an event triggered based on a gesture, or an event triggered based on a voice command.
[0013] In some implementations, the method further includes: in response to a browsing operation of the page, displaying different contents of the page on a display interface, and maintaining a display position of the second page element in the display interface unchanged.
[0014] Displaying the second page element at a fixed position on the display interface instead of embedding it in the page allows users to use the second page element to trigger page overview information at any time without having to return to the fixed position of the page to trigger the page overview information, thereby further improving the efficiency of browsing and information searching of long pages.
[0015] In some implementations, the display position of the second page element is fixed at the top, bottom, or side of the display interface.
[0016] In some implementations, the method further includes: in response to a browsing operation of the page, displaying a navigation bar of the page, wherein the second page element is located in the navigation bar.
[0017] Integrating the second page element with the navigation bar can simplify the design of the page element. In addition, the second page element and the navigation bar are both used to display the page layout or achieve page positioning, so integrating the two can also help users quickly understand the role of the second page element.
[0018] In some implementations, the second page element is located at a side edge of the navigation bar.
[0019] In some implementations, the second page element is used to trigger display of a third page element, and the third page element is used to display the multi-level title.
[0020] In some implementations, displaying overview information of the page in response to a first event for the page includes: displaying a third page element in response to the first event, the third page element being used to display the multi-level title.
[0021] In some implementations, the third page element includes: a drawer panel, a drop-down box, a side frame, or a pop-up box.
[0022] In a second aspect, an information display device is provided, comprising: an event detection unit, configured to detect an opening instruction of a page and a first event for the page; an interface display unit, configured to: display part of the content of the page in response to the opening instruction of the page, wherein the page includes a multi-level content module; and display overview information of the page in response to the first event for the page; wherein the overview information includes multi-level titles corresponding to the multi-level content modules.
[0023] According to a third aspect, a computer-readable storage medium is provided, on which a computer program is stored. When the program is executed by a processor, the method described in the first aspect or any one of the implementations of the first aspect is implemented.
[0024] In a fourth aspect, an electronic device is provided, comprising: one or more processors; and a memory associated with the one or more processors, the memory being used to store program instructions, and the program instructions, when read and executed by the one or more processors, execute the method described in the first aspect or any one of the implementation methods of the first aspect.
[0025] According to a fifth aspect, a computer program product is provided, comprising a computer program, which, when executed by a processor, implements the method described in the first aspect or any one of the implementations of the first aspect. BRIEF DESCRIPTION OF THE DRAWINGS
[0026] In order to more clearly illustrate the technical solutions in the embodiments of the present application or related technologies, the following briefly introduces the drawings required for use in the embodiments. It should be understood that the drawings described below are only some embodiments of the present application, and for those of ordinary skill in the art, other drawings can also be obtained based on these drawings.
[0027] Figure 1 A system architecture diagram applicable to the embodiments of the present application.
[0028] Figure 2 This is an example image of a shopping page.
[0029] Figure 3 This is an example image of a ceiling navigation bar.
[0030] Figure 4A schematic flowchart of an information display method provided in an embodiment of the present application.
[0031] Figure 5 An example diagram of page overview information provided in an embodiment of the present application.
[0032] Figure 6 An example diagram of page jump results provided in an embodiment of the present application.
[0033] Figure 7 This is an example diagram of a method for triggering page overview information provided in an embodiment of the present application.
[0034] Figure 8 An example diagram of the page browsing process provided in an embodiment of the present application.
[0035] Fig. 9 A schematic block diagram of an information display device provided in an embodiment of the present application.
[0036] Fig.10 A schematic block diagram of an electronic device provided in an embodiment of the present application. DETAILED DESCRIPTION
[0037] The following will be combined with the drawings in the embodiments of the present application to clearly and completely describe the technical solutions in the embodiments of the present application. Obviously, the described embodiments are only part of the embodiments of the present application, not all of the embodiments. All other embodiments obtained by ordinary technicians in this field based on the embodiments in the present application belong to the scope of protection of this application.
[0038] In order to facilitate understanding of the embodiments of the present application, a system architecture to which the embodiments of the present application can be applied is first described by way of example. Figure 1 An exemplary system architecture to which the embodiments of the present application can be applied is shown. Figure 1 As shown in , the system architecture may include: a terminal device 110 and a server 120. The terminal device 110 may be connected to the server 120 via a wireless network or a wired network. It should be understood that Figure 1 The number of terminal devices 110 and servers 120 in the embodiment is only for illustration. According to the implementation requirements, the system architecture based on the embodiment of the present application can have any number of terminal devices 110 and servers 120.
[0039] The terminal device 110 may include, but is not limited to, a smart mobile terminal, a wearable device, a personal computer (PC), a smart home device, etc. Among them, smart mobile devices may include, for example, mobile phones, tablet computers, laptop computers, personal digital assistants (PDA), Internet car terminals, etc. Wearable devices may include, for example, smart watches, smart glasses, smart bracelets, virtual reality (VR) devices, augmented reality (AR) devices, mixed reality devices (i.e., devices that can support virtual reality and augmented reality), etc. Smart home devices may include, for example, smart TVs, smart refrigerators with display screens, etc.
[0040] The terminal device 110 may be provided with a client 112. The client 112 involved in the embodiment of the present application may be an application (app), a small program, or a web program running through a browser running on the terminal device. The client 112 may interact with the server 120 through a network, request and obtain media resources from the server 120, and play them.
[0041] The server 120 may be a single server, a server group consisting of multiple servers, or a cloud server. A cloud server, also known as a cloud computing server or cloud host, is a host product in a cloud computing service system that solves the defects of difficult management and weak service scalability in traditional physical hosts and virtual private servers (VPS) services.
[0042] The server 120 may be a background server that provides services to the client 112. For example, the server 120 may maintain a certain type of page that can be used to provide a certain service to the user. After the client 112 is started, it can log in to the page maintained by the server 120 and obtain the corresponding service by browsing the page. As an example, the client 112 is a shopping application, and the server 120 is used to maintain the shopping page displayed on the client. When the user wants to shop, he can log in to the shopping page through the client 112, and send a shopping request to the server through the shopping page to buy his favorite items. As another example, the client 112 is a song listening application, and the server 120 is used to maintain the song display page displayed on the client 112. When the user wants to listen to a song, he can log in to the song display page through the client 112, and send a song play request to the server through the song display page to play his favorite song.
[0043] As the page content increases, it is difficult for the display screen to display all the content in the page through one screen. Therefore, most pages currently adopt a long page design. When browsing a long page, users can find the content they want in the long page by sliding up and down or scrolling up and down. However, when the page contains a large number of content modules, it is difficult for users to understand how many content modules the current page contains, and it is also difficult to understand the relationship between these content modules, so they cannot quickly find a specific content module that meets their needs, which leads to low efficiency in browsing long pages and poor user experience.
[0044] In order to improve the browsing efficiency of long pages, a possible solution is to design a ceiling navigation bar for long pages. Multiple labels (or options) can be set in the ceiling navigation bar, where each label can correspond to a content module in the long page. By clicking a label in the ceiling navigation bar, the user can quickly jump to the corresponding position in the long page (that is, the position of the content module corresponding to the label). In the process of browsing a long page, the ceiling navigation bar can be displayed at the top of the display interface first. Then, as the page slides or scrolls, the display position of the ceiling navigation bar in the display interface can remain unchanged, that is, it is always fixed at the top of the display interface. In this way, in the process of browsing the page, the user can use the ceiling navigation bar to navigate and locate the page content at any time, and there is no need to return to the starting position of the long page. Taking the long page as a shopping page in a shopping application as an example, when the user opens the shopping page of a certain shoe, the content contained in the starting position of the long page can be displayed first, such as Figure 2 As the user scrolls down the shopping page, Figure 3 As shown, a ceiling navigation bar 22 will appear on the shopping page. The ceiling navigation bar 22 includes 5 tags: Products, Outfits, Sizes, Details, and Recommendations, where each tag corresponds to a content module in the long page. When a user clicks on a tag, the user can jump to the location of the long page containing the corresponding content module. In addition, while the user continues to browse the page by sliding down, the ceiling navigation bar 22 can always be displayed at the top of the display interface, so that the user can jump and locate the page position at any time.
[0045] Although the implementation method based on the ceiling navigation bar can help users understand the content modules of a long page as a whole, the ceiling navigation bar has certain limitations. First of all, the number of tags that can be displayed by the ceiling navigation bar is limited. Even if the ceiling navigation bar can display more tags by sliding horizontally, the number of tags that can be displayed on one screen is still limited. More importantly, the content modules in a long page often have multiple hierarchical relationships. In other words, a large content module often contains many sub-content modules. Figures 2 to 3 Take the shopping page shown as an example. Figure 3The "Details" in the page may further include the following sub-content modules (not shown in the figure): "Product Introduction", "Product Display", "Brand Story", "Shopping Tips", "FAQ", etc. The ceiling navigation bar can often only display the content modules at the highest level in the long page, but cannot display the sub-content modules under the highest-level content modules, nor can it display the hierarchical relationship between these different content modules. When the content module in the long page contains a lot of content, the user can only browse the information in the content module by sliding, resulting in low browsing and information search efficiency of the long page.
[0046] In view of the above problems, the embodiment of the present application can display the overview information of the page to the user after the user opens the page. The overview information includes the multi-level titles corresponding to the multi-level content modules in the page. Based on the overview information of the page, the user can quickly understand which content modules the page contains and the hierarchical structure between these content modules, thereby improving the browsing and information search efficiency of long pages.
[0047] For ease of understanding, the following Figure 4 , the embodiments of the present application are illustrated in more detail.
[0048] Figure 4 A schematic flowchart of an information display method provided in an embodiment of the present application. Figure 4 The method may be executed by a terminal device, which may be Figure 1 As a more specific example, Figure 4 The method can be executed by a client installed on the terminal device. The client can be an application (APP), a small program, or a web program running through a browser running on the terminal device. Figure 4 Each step in is described in detail.
[0049] See also Figure 4, in step S410, in response to the page opening instruction, part of the page content is displayed. There are many ways to generate the page opening instruction. Taking the listening application as an example, when the user wants to listen to music, the listening application can be started by the voice assistant. After the listening application is started, the homepage of the listening application will be displayed. In this example, the voice assistant's instruction to call the listening application can be understood as the page opening instruction, and the instruction opens the homepage of the listening application. Taking the shopping application as an example, when the user browses items in the shopping mall page provided by the shopping application, if the user sees an item he likes, he can open the shopping page containing the complete introduction information of the item by clicking the icon of the item. In this example, the click operation of the item icon can be understood as the page opening instruction, and the instruction opens the shopping page of the item. It is mentioned in step S410 that when the page opening instruction is received, part of the content in the page is displayed. This is because the page is a long page with more content, and the display interface cannot display all the content of the page through one screen.
[0050] In step S420, in response to the first event for the page, overview information of the page is displayed. The overview information can introduce the content modules contained in the page as a whole, so that the user can perceive the content in the page as a whole. For example, the page contains multi-level content modules, and accordingly, the overview information can include multi-level titles corresponding to the multi-level content modules. In other words, the multi-level titles are used to indicate the multi-level content modules.
[0051] Still Figures 2 to 3 Take the shopping page shown as an example. Figure 5 An example of the overview information of the shopping page is shown. Figure 5 The shopping page generally includes 5 first-level content modules, namely "Products", "Outfits", "Sizes", "Details", and "Recommendations". In addition, the shopping page also includes 9 second-level content modules, namely "Recent Purchases", "Good Product Reviews", "Ask Everyone", "Related Recommendations", "Product Introduction", "Product Display", "Brand Story", "Shopping Tips", and "Frequently Asked Questions". In addition to the 5 first-level content modules and 9 second-level content modules, Figure 5 The hierarchical relationship (or affiliation) between the five primary content modules and the nine secondary content modules is also shown. Figure 5As shown, there is a secondary content module, namely "Recent Purchases", under the first-level content module "Products"; there are three secondary content modules, namely "Good Product Reviews", "Ask Everyone", and "Related Recommendations" under the first-level content module "Outfits"; there is no secondary content module under the first-level content module "Size"; there are 5 secondary content modules under the first-level content module "Details", namely "Product Introduction", "Product Display", "Brand Story", "Shopping Tips", and "Frequently Asked Questions"; there is no secondary content module under the first-level content module "Recommendations".
[0052] It should be noted that Figure 5 The hierarchical relationship between different content modules is displayed by combining paragraph indentation with font size. In addition, other methods can also be used to display the hierarchical relationship between different content modules. For example, the font colors of content modules at different levels can be set to different colors. For another example, the hierarchical relationship between content modules can be represented by a tree diagram.
[0053] according to Figure 4 As can be seen from the introduction, the present application embodiment introduces overview information of a page. Based on the overview information, the user can quickly understand which content modules the page contains and the hierarchical structure between these content modules, thereby improving the browsing and information search efficiency of long pages.
[0054] In addition to displaying the multi-level titles corresponding to the multi-level content modules in the page, in some implementations, a page jump or positioning function can also be set for the multi-level titles, thereby facilitating users to quickly locate the content modules they are interested in, further improving the browsing and information search efficiency of long pages.
[0055] Take the example of a multi-level title including a target title (the target title mentioned here can be any title in the multi-level title. In addition, for the convenience of description, the content module corresponding to the target title in the multi-level content module is referred to as the target content module below). After detecting a selection operation for the target title (the target title can be clicked, or the target title can be selected through gestures or voice commands), in response to the selection operation, jump to the target page position in the page. The target page position mentioned here is the page position where the target content module is located (that is, the content in the target page position includes part or all of the content in the target content module).
[0056] In some implementations, some of the multi-level titles support jump operations. For example, the multi-level titles include first-level titles and second-level titles. Among them, the second-level titles support jump operations, while the first-level titles do not support jump operations (the jump operation of the first-level titles can be performed by Figure 3In some other implementations, all multi-level titles support jump operations. For example, the multi-level titles include first-level titles and second-level titles, and both first-level titles and second-level titles support jump operations. In this way, users can not only locate content modules with higher levels in the page, but also locate content modules with lower levels in the page. In other words, by introducing the jump operations corresponding to multi-level titles, the positioning accuracy of long pages is improved, thereby improving the browsing and information search efficiency of long pages.
[0057] The target title is Figure 5 Take the second level title "Brand Story" as an example. Figure 5 After the page overview information is shown, if the user is interested in the history of the brand, they can select "Brand Story". After "Brand Story" is selected, they can jump to Figure 6 The page location shown. Figure 6 It can be seen that the page content displayed in this page position includes "Brand Story".
[0058] In order to facilitate users to understand that the target title supports page jump operations, in some implementations, a first page element corresponding to the target title can be displayed. The first page element can be used to indicate that the target title supports jump operations. That is, the first page element indicates that by selecting the target title, you can jump to the content module corresponding to the target title in the page. Figure 5 For example, from Figure 5 It can be seen that a downward arrow is displayed on the right side of each title in the multi-level title, and the downward arrow can be understood as the first page element mentioned above. After seeing the downward arrow, the user can understand that the multi-level title supports the jump function. Therefore, when the user wants to view the content module corresponding to a certain title, he can select the title to jump to the corresponding content module.
[0059] In step S420 above, it is mentioned that "in response to the first event for the page, the overview information of the page is displayed". The embodiment of the present application does not specifically limit the first event mentioned here (i.e., the method of triggering the overview information). The first event may include: an event triggered by a page element, an event triggered by a gesture, or an event triggered by a voice command. For example, a second page element may be set in the page, and after the second page element is triggered, the overview information of the page is displayed. For another example, when it is detected that the user has input a certain gesture (such as a double-click gesture), the overview information of the page can be displayed. For another example, when the user inputs a voice command to display the overview information of the page, the overview information of the page can be displayed.
[0060] Taking the display of overview information triggered by the second page element as an example, the second page element can be embedded in a certain position in the page (the relative position between other elements in the page remains unchanged). For example, the second page element can be set at the top position of the page (hereinafter referred to as an example). After the user enters the page, the second page element can be seen at the top position of the page. Then, the user can display the overview information of the page by triggering the second page element. However, since the second page element is fixed in the page, as the user browses the page downward by sliding or scrolling, once the upper edge of the display interface passes the position where the second page element is located, the display interface cannot see the second page element. In the process of browsing the page, if the user wants to use the overview information again to understand the position of the current page content in the entire page, or use the overview information to switch between different content modules, the user needs to return to the top of the page again, which will reduce the browsing efficiency of the page.
[0061] In response to the above problems, in some implementations, as the page is browsed (such as sliding or scrolling the page), the embodiment of the present application can keep the second page element visible in the display interface. For example, the embodiment of the present application can fix the second page element at a certain position in the display interface, and as the content of the page changes, the display position of the second page element in the display interface remains unchanged. In this way, even if the user switches between different contents in the page, the second page element can always be seen. When the user wants to trigger the overview information through the second page element, there is no need to return to the top of the page as mentioned above, but the second page element can be triggered directly, thereby improving the browsing efficiency of the page.
[0062] The embodiment of the present application does not limit the display position of the second page element in the display interface, as long as the second page element can be seen in the display interface. For example, the second page element can be fixed at the top, bottom or side of the display interface.
[0063] Combination of the above Figure 3 , the ceiling navigation bar is introduced. Once the ceiling navigation bar is triggered, as the page is browsed, the ceiling navigation bar will be fixed at the top of the display interface, so that the user can use it at any time. Of course, in addition to the ceiling navigation bar, some navigation bars will be fixed to the side or bottom of the display interface. In some implementations, if a navigation bar is set for the page, the second page element mentioned above can be set in the navigation bar, which can simplify the implementation. That is, after the user triggers the navigation bar, the second page element can be seen in the navigation bar. Since the second page element and the navigation bar can both realize the function of page overview or navigation, integrating the two together can also help users quickly understand the role of the second page element.
[0064] The embodiment of the present application does not specifically limit the position of the second page element in the navigation bar. For example, the second page element can be set at the top, middle, bottom or side edge of the navigation bar. Since the labels in the navigation bar can display the highest-level information modules of the page, setting the second page element on the side edge of the navigation bar is equivalent to notifying the user that if the labels in the navigation bar cannot meet the user's needs, more overview information can be obtained by triggering the page elements on the side edge, which is more in line with the user's information acquisition habits. Figure 7 For example, the navigation bar 72 includes labels such as "product", "outfit", "size", "details", "recommendation", etc. In addition, the side edge of the navigation bar 72 also includes a second page element 722. By triggering the second page element, you can see Figure 5 Overview of the page shown.
[0065] The first event or the second page element mentioned above can be used to trigger the third page element. The third page element can be used to display page overview information (including multi-level titles). The embodiment of the present application does not specifically limit the type of the third page element, which can be a drawer panel, a drop-down box, a side frame, or a pop-up box. Figure 5 and Figure 7 For example, Figure 7 The second page element 722 in is used to trigger Figure 5 The third page element shown is a drawer panel 54 , in which overview information of the page is displayed.
[0066] As mentioned above, in the process of browsing the page, the display position of the second page element in the display interface can be kept unchanged. It should be understood that the "keeping the display position of the second page element in the display interface unchanged" described here can refer to always keeping the display position of the second page element in the display interface unchanged after opening the page, and can also refer to: keeping the display position of the second page element in the display interface unchanged within a certain page position range. For example, similar to the principle of the ceiling navigation bar, after entering the page, the second page element may not be displayed first. The second page element is only displayed when the page is slid down to a certain page position (such as a position that exceeds a certain threshold from the top of the page, hereinafter referred to as page position 1). If the page continues to slide down, the display position of the second page element in the display interface can be kept unchanged. However, if the page slides up again to exceed page position 1, the second page element may no longer be displayed.
[0067] It should be noted that the limitations such as "first" and "second" involved in the embodiments of the present application do not have limitations in terms of size, order, and quantity, and are only used to distinguish them in name. For example, "first event" and "second event" are used to distinguish two events in name. For another example, "first page element", "second page element", and "third page element" are used to distinguish different interface elements in name.
[0068] It should also be noted that in order to detect the occurrence of an event, the client can pre-register a callback function or method for the event to be detected, and the function or method contains the logic code that needs to be executed in response to the event. Once the event is triggered, the client can automatically call the corresponding callback function or method. For example, a callback function is pre-registered for the first event, and the callback function triggers the display interface to display the overview information of the page. The response to the event in the embodiment of the present application can be implemented in this way, and will not be described in detail later.
[0069] The terms used in the embodiments of the present application are only for the purpose of describing specific embodiments, and are not intended to limit the scope of protection of the present application. The singular forms of "a", "said" and "the" used in the embodiments of the present application and the appended claims are also intended to include plural forms, unless the context clearly indicates other meanings.
[0070] It should be understood that the term "and / or" used in this article is only a description of the association relationship of associated objects, indicating that there can be three relationships. For example, A and / or B can represent: A exists alone, A and B exist at the same time, and B exists alone. In addition, the character " / " in this article generally indicates that the associated objects before and after are in an "or" relationship.
[0071] The word "if" as used herein may be interpreted as "at the time of" or "when" or "in response to" depending on the context. Similarly, the phrases "if it is determined" or "if (stated condition or event) is detected" may be interpreted as "when determining" or "in response to determining" or "when detecting (stated condition or event)" or "in response to detecting (stated condition or event)", depending on the context.
[0072] It should also be noted that the page elements involved in the embodiments of the present application generally refer to visual elements on the display interface, which may include text, icons, images, videos, components, etc. The so-called component refers to an object obtained by simply encapsulating data and methods, which may also be called a control. It may include buttons, input boxes, drop-down menus, dialog boxes, navigation bars, cards, icons that can generate interactions, etc.
[0073] The following describes the embodiments of the present application in more detail with reference to specific examples. Figure 8The examples are only intended to help those skilled in the art understand the embodiments of the present application, and are not intended to limit the embodiments of the present application to the specific values or specific scenarios illustrated. Figure 8 It is obvious that various equivalent modifications or changes can be made, and such modifications or changes also fall within the scope of the embodiments of the present application.
[0074] While browsing the shopping app, the user sees a pair of sneakers that he likes. To learn more about the sneakers, the user clicks on the icon of the sneakers, which opens a page that provides detailed information about the sneakers. This page is long. Figure 8 The A in the figure shows the top of the long page A, which contains the picture and price of the sports shoes. The user continues to browse the long page by sliding down. When the user slides to a certain position on a long page, the display interface appears. Figure 8 The ceiling navigation bar 82 shown in B in FIG. 1 and the side edge of the ceiling navigation bar 82 includes an icon 84 (corresponding to the second page element in the previous text). After the user clicks the icon 84, as shown in FIG. Figure 8 As shown in C in the figure, a drawer panel 86 (corresponding to the third page element in the previous text) appears in the display interface. The drawer panel 86 displays the overview information of the long page. From the overview information, it can be seen that the long page generally includes 5 primary content modules, namely "Products", "Outfits", "Sizes", "Details", and "Recommendations". In addition, the long page also includes 9 secondary content modules, namely "Recent Purchases", "Good Product Reviews", "Ask Everyone", "Related Recommendations", "Product Introduction", "Product Display", "Brand Story", "Shopping Tips", and "Frequently Asked Questions". In addition to the 5 primary content modules and 9 secondary content modules, Figure 8 The hierarchical relationship (or affiliation) between the five primary content modules and the nine secondary content modules is also shown. Figure 8 As shown, there is a secondary content module, namely, “Recent Purchases”, under the primary content module “Products”; there are three secondary content modules, namely, “Good Product Reviews”, “Ask Everyone”, and “Related Recommendations”, under the primary content module “Outfits”; there is no secondary content module under the primary content module “Sizes”; there are five secondary content modules, namely, “Product Introduction”, “Product Display”, “Brand Story”, “Shopping Notes”, and “Frequently Asked Questions”, under the primary content module “Details”; there is no secondary content module under the primary content module “Recommendations”. Based on the overview information on the drawer panel 86, the user quickly understands the overall layout of the long page.
[0075] After understanding the overall layout of the long page, the user becomes interested in the "Brand Story" in the secondary content module. The user sees a downward arrow on the right side of "Brand Story" (corresponding to the first page element in the previous text), which means that clicking "Brand Story" can achieve page jump and positioning. After clicking "Brand Story", the user enters Figure 8 The D in the long page refers to the page location where the "Brand Story" is displayed.
[0076] Combination of the above Figures 1 to 8 , describes the method embodiment of the present application in detail, and the following is combined with Figures 9 and 10 , describes the device embodiment of the present application in detail. It should be understood that the description of the method embodiment corresponds to the description of the device embodiment, so the parts not described in detail can refer to the previous method embodiment.
[0077] Fig. 9 A schematic diagram of the structure of an information display device provided in an embodiment of the present application. The device 900 includes an event detection unit 910 and an interface display unit 920. The event detection unit 910 is configured to detect an opening instruction of a page and a first event for the page. The interface display unit 920 is configured to: in response to an opening instruction of the page, display a portion of the content of the page, the page including a multi-level content module; in response to a first event for the page, display overview information of the page; wherein the overview information includes multi-level titles corresponding to the multi-level content modules.
[0078] In some implementations, the multi-level title includes a target title, and the target title corresponds to a target content module in the multi-level content module. The interface display unit 920 is also configured to: in response to a selection operation on the target title, jump to a target page position in the page, and the target page position is the page position where the target content module is located.
[0079] In some implementations, the interface display unit 920 is further configured to: display a first page element corresponding to the target title, wherein the first page element is used to indicate that the target title supports a jump operation, and the jump operation is used to jump to the target page location.
[0080] In some implementations, the multi-level title includes a first-level title and a second-level title under the first-level title, and the target title is the first-level title or the second-level title.
[0081] In some implementations, the operation of selecting the target title includes a click operation on the target title.
[0082] In some implementations, the first event includes: an event triggered based on a second page element, an event triggered based on a gesture, or an event triggered based on a voice command.
[0083] In some implementations, the interface display unit 920 is further configured to: in response to a browsing operation of the page, display different contents of the page on the display interface, and keep the display position of the second page element in the display interface unchanged.
[0084] In some implementations, the display position of the second page element is fixed at the top, bottom, or side of the display interface.
[0085] In some implementations, the interface display unit 920 is further configured to: in response to a browsing operation of the page, display a navigation bar of the page, and the second page element is located in the navigation bar.
[0086] In some implementations, the second page element is located at a side edge of the navigation bar.
[0087] In some implementations, the second page element is used to trigger display of a third page element, and the third page element is used to display the multi-level title.
[0088] In some implementations, the third page element includes: a drawer panel, a drop-down box, a side frame, or a pop-up box.
[0089] Each embodiment in this specification is described in a progressive manner, and the same or similar parts between the embodiments can be referred to each other, and each embodiment focuses on the differences from other embodiments. In particular, for the system or device embodiment, since it is basically similar to the method embodiment, the description is relatively simple, and the relevant parts can be referred to the partial description of the method embodiment. The system and device embodiments described above are merely schematic, wherein the units described as separate components may or may not be physically separated, and the components displayed as units may or may not be physical units, that is, they may be located in one place, or they may be distributed on multiple network units. Some or all of the modules may be selected according to actual needs to achieve the purpose of the scheme of this embodiment. Ordinary technicians in this field can understand and implement it without paying creative labor.
[0090] It should be noted that the user information (including but not limited to user device information, user personal information, etc.) and data (including but not limited to data used for analysis, stored data, displayed data, etc.) involved in this application are all information and data authorized by the user or fully authorized by all parties, and the collection, use and processing of relevant data must comply with the relevant laws, regulations and standards of the relevant countries and regions, and provide corresponding operation entrances for users to choose to authorize or refuse.
[0091] In addition, an embodiment of the present application further provides a computer-readable storage medium on which a computer program is stored, and when the program is executed by a processor, the method described in any one of the aforementioned method embodiments is implemented.
[0092] The present application also provides an electronic device, including:
[0093] one or more processors; and
[0094] A memory associated with the one or more processors, the memory being used to store program instructions, wherein the program instructions, when read and executed by the one or more processors, execute any of the methods described in the foregoing method embodiments.
[0095] The present application also provides a computer program product, including a computer program, which implements any one of the methods described in the aforementioned method embodiments when executed by a processor.
[0096] in, Fig.10 The electronic device architecture is shown as an example, which may include a processor 1010, a video display adapter 1011, a disk drive 1012, an input / output interface 1013, a network interface 1014, and a memory 1020. The processor 1010, the video display adapter 1011, the disk drive 1012, the input / output interface 1013, the network interface 1014, and the memory 1020 may be communicatively connected via a communication bus 1030.
[0097] Among them, the processor 1010 can be implemented by a general-purpose CPU, a microprocessor, an application specific integrated circuit (ASIC), or one or more integrated circuits, etc., to execute relevant programs to implement the technical solution provided in this application.
[0098] The memory 1020 can be implemented in the form of a read-only memory (ROM), a random access memory (RAM), a static storage device, a dynamic storage device, etc. The memory 1020 can store an operating system 1021 for controlling the operation of the electronic device 1000, and a basic input output system (BIOS) 1022 for controlling the low-level operation of the electronic device 1000. In addition, a web browser 1023, a data storage management system 1024, and a playback processing device 1025 for media files can also be stored. The playback processing device 1025 for the above-mentioned media files can be an application program that specifically implements the operations of the aforementioned steps in the embodiment of the present application. In short, when the technical solution provided by the present application is implemented by software or firmware, the relevant program code is stored in the memory 1020 and is called and executed by the processor 1010.
[0099] The input / output interface 1013 is used to connect the input / output module to realize information input and output. The input / output module can be configured in the device as a component (not shown in the figure), or it can be externally connected to the device to provide corresponding functions. The input device may include a keyboard, a mouse, a touch screen, a microphone, various sensors, etc., and the output device may include a display, a speaker, a vibrator, an indicator light, etc.
[0100] The network interface 1014 is used to connect to a communication module (not shown) to realize communication interaction between the device and other devices. The communication module can realize communication through a wired mode (such as USB, network cable, etc.) or a wireless mode (such as mobile network, WIFI, Bluetooth, etc.).
[0101] The bus 1030 comprises a pathway for transmitting information between the various components of the device (eg, the processor 1010, the video display adapter 1011, the disk drive 1012, the input / output interface 1013, the network interface 1014, and the memory 1020).
[0102] It should be noted that, although the above device only shows a processor 1010, a video display adapter 1011, a disk drive 1012, an input / output interface 1013, a network interface 1014, a memory 1020, a bus 1030, etc., in the specific implementation process, the device may also include other components necessary for normal operation. In addition, it can be understood by those skilled in the art that the above device may also only include components necessary for implementing the solution of the present application, and does not necessarily include all the components shown in the figure.
[0103] It can be known from the description of the above implementation methods that those skilled in the art can clearly understand that the present application can be implemented by means of software plus a necessary general hardware platform. Based on such an understanding, the technical solution of the present application can be essentially or partly contributed to the prior art in the form of a computer program product, which can be stored in a storage medium such as ROM / RAM, a magnetic disk, an optical disk, etc., and includes several instructions for enabling a computer device (which can be a personal computer, a server, or a network device, etc.) to execute the methods described in the various embodiments of the present application or certain parts of the embodiments.
[0104] The technical solution provided by the present application is described in detail above. The principle and implementation method of the present application are described in detail using specific examples. The description of the above embodiments is only used to help understand the method and core idea of the present application. At the same time, for those skilled in the art, according to the idea of the present application, there will be changes in the specific implementation method and application scope. In summary, the content of this specification should not be understood as limiting the present application.
Claims
1. An information display method, characterized in that: include: In response to an opening instruction of a page, a portion of the content of the page is displayed, wherein the page includes a multi-level content module; In response to a first event for the page, overview information of the page is displayed, the overview information including multi-level titles corresponding to the multi-level content modules.
2. The method according to claim 1, characterized in that The multi-level title includes a target title, and the target title corresponds to a target content module in the multi-level content module. The method further includes: In response to a selection operation on the target title, the page is jumped to a target page position in the page, where the target page position is a page position where the target content module is located.
3. The method according to claim 2, characterized in that The method further comprises: A first page element corresponding to the target title is displayed, where the first page element is used to indicate that the target title supports a jump operation, and the jump operation is used to jump to the target page position.
4. The method according to claim 2, characterized in that: The multi-level title includes a first-level title and a second-level title under the first-level title, and the target title is the first-level title or the second-level title.
5. The method according to any one of claims 1 to 4, characterized in that The first event includes: an event triggered based on a second page element, an event triggered based on a gesture, or an event triggered based on a voice command.
6. The method according to claim 5, characterized in that The method further comprises: In response to a browsing operation of the page, different contents of the page are displayed on a display interface, and a display position of the second page element in the display interface is kept unchanged.
7. The method according to claim 6, characterized in that The method further comprises: In response to a browsing operation of the page, a navigation bar of the page is displayed, and the second page element is located in the navigation bar.
8. The method according to any one of claims 1 to 4, characterized in that The step of displaying overview information of the page in response to the first event on the page includes: In response to the first event, a third page element is displayed, where the third page element is a drawer panel, a drop-down box, a side frame, or a pop-up box, and the third page element is used to display the multi-level title.
9. An information display device, characterized in that: include: An event detection unit, configured to detect an opening instruction of a page and a first event for the page; An interface display unit is configured to: in response to an opening instruction of the page, display a portion of the content of the page, wherein the page includes a multi-level content module; In response to a first event for the page, overview information of the page is displayed; wherein the overview information includes multi-level titles corresponding to the multi-level content modules.
10. A computer-readable storage medium having a computer program stored thereon, characterized in that: When the program is executed by a processor, the method according to any one of claims 1 to 8 is implemented.
11. An electronic device, characterized in that: include: one or more processors; as well as A memory associated with the one or more processors, the memory being used to store program instructions, wherein when the program instructions are read and executed by the one or more processors, the method according to any one of claims 1 to 8 is executed.
12. A computer program product, comprising a computer program, characterized in that When the computer program is executed by a processor, the method according to any one of claims 1 to 8 is implemented.
Citation Information
Patent Citations
Information processing method and electronic equipment
CN104462101A
System and method for simplified navigation
US20090044150A1
Cited By
Content display method, device and equipment, computer readable storage medium and product
CN120578319A