Page layout method and device, electronic equipment and readable storage medium

By acquiring and analyzing user operation information, the layout of webpage menu options is automatically adjusted, solving the problem of low efficiency in manual modifications by developers and achieving more efficient layout adjustments and a better user experience.

CN116244537BActive Publication Date: 2026-04-14SHANGHAI ZHONG YUAN NETWORK CO LTD
View PDF 4 Cites 0 Cited by

Patent Information

Authority / Receiving Office
CN · China
Patent Type
Patents(China)
Current Assignee / Owner
Filing Date
2022-12-29
Publication Date
2026-04-14

AI Technical Summary

Technical Problem

In existing technologies, the layout of webpage menu options requires developers to modify it manually, which is inefficient.

Method used

By obtaining the menu list of the webpage, detecting user operation information, determining the user's attention and familiarity with each menu option, and automatically adjusting the layout of the menu options based on this information.

Benefits of technology

It improves the efficiency of modifying webpage layouts, making the layout more in line with user habits and enhancing the user experience.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN116244537B_ABST
    Figure CN116244537B_ABST
Patent Text Reader

Abstract

The application provides a page layout method and device, electronic equipment and readable storage medium, and belongs to the technical field of Internet. The application obtains a menu list of a webpage, wherein the menu list records at least one menu option contained on the webpage; detects operation information acting on the webpage, and determines user attention and user familiarity corresponding to each menu option based on the operation information; determines layout information corresponding to the webpage based on the user attention and the user familiarity; and arranges at least one menu option contained on the webpage based on the layout information. According to the application, the layout of the webpage can be intelligently modified according to the operation of the user on the webpage, and the efficiency of modifying the layout of the webpage is improved.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] This application relates to the field of Internet technology, and in particular to a page layout method, apparatus, electronic device, and readable storage medium. Background Technology

[0002] With the continuous development of the internet, all industries have participated in the internetization process to varying degrees, resulting in a proliferation of websites. Web pages are the basic element of a website, serving as a platform for various website applications. Web pages typically contain menu options (mostly command buttons or anchor text), which, when clicked, trigger corresponding functions.

[0003] For example, clicking the "Login" menu option on a webpage will bring up a login interface where users can log in to their account information; clicking the "Download" menu option on a webpage will download the corresponding online resource; and clicking the "Next Page" menu option on a webpage will jump to the next page of the currently displayed page.

[0004] Currently, the layout of these menu options on web pages is generally fixed. If you want to modify the menu option layout, you need to manually modify it, which is inefficient. Summary of the Invention

[0005] To address the inefficient technical problem of requiring developers to manually modify menu option layouts, this application provides a page layout method, apparatus, electronic device, and readable storage medium.

[0006] Firstly, a page layout method is provided, the method comprising:

[0007] Obtain the menu list of the web page, wherein the menu list records at least one menu option contained on the web page;

[0008] The system detects the operation information applied to the webpage and determines the user attention and user familiarity corresponding to each menu option based on the operation information.

[0009] Based on the user attention and the user familiarity, the layout information corresponding to the webpage is determined;

[0010] The layout information is used to lay out at least one of the menu options contained on the webpage.

[0011] In one possible implementation, the layout information includes: the layout position corresponding to each menu option, the layout position being used to arrange the corresponding menu option.

[0012] The step of determining the layout information corresponding to the webpage based on the user attention and the user familiarity includes:

[0013] Obtain at least one option position corresponding to the webpage and the priority of each option position;

[0014] For each menu option, a corresponding layout score is determined based on the user attention and user familiarity with the menu option, wherein the higher the user attention and the lower the user familiarity, the higher the layout score.

[0015] Based on the layout score corresponding to each menu option and the priority corresponding to each option position, the correspondence between menu options and option positions is determined, wherein the menu option with the higher layout score corresponds to the option position with the higher priority.

[0016] For each menu option, the position of the option corresponding to the menu option is determined as the layout position of the menu option.

[0017] In one possible implementation, the method further includes:

[0018] Sort all the menu options in descending order of their layout scores;

[0019] The menu options that are ranked first are designated as the first option, and the menu options other than the first option are designated as the second option.

[0020] The first option is rendered according to preset first rendering information, and the second option is rendered according to preset second rendering information, wherein the first rendering information and the second rendering information are different.

[0021] In one possible implementation, the operation information includes: the number of operations corresponding to each menu option, and determining the user attention level corresponding to each menu option based on the operation information includes:

[0022] For each menu option, the user attention level is determined based on the number of operations corresponding to that menu option, wherein the more operations, the higher the user attention level.

[0023] In one possible implementation, the operation information includes: the operation trajectory corresponding to each menu option, and determining the user familiarity corresponding to each menu option based on the operation information includes:

[0024] For each menu option, determine whether the operation trajectory corresponding to the menu option is a preset trajectory;

[0025] If the operation trajectory is a preset trajectory, the first level of familiarity is determined as the user familiarity.

[0026] If the operation trajectory is not a preset trajectory, the second familiarity is determined as the user familiarity, wherein the second familiarity is higher than the first familiarity.

[0027] In one possible implementation, the operation information includes: the operation trajectory and operation duration corresponding to each menu option, and determining the user familiarity with each menu option based on the operation information includes:

[0028] For each menu option, determine whether the operation trajectory corresponding to the menu option is a preset trajectory;

[0029] When the operation trajectory is a preset trajectory, the user familiarity is determined based on the operation time corresponding to the menu option within a preset familiarity range. The longer the operation time, the lower the user familiarity.

[0030] When the operation trajectory is not a preset trajectory, the preset familiarity is determined as the user familiarity, wherein the preset familiarity is higher than the upper limit of the preset familiarity range.

[0031] Secondly, a page layout apparatus is provided, the apparatus comprising:

[0032] The acquisition module is used to acquire the menu list of a webpage, wherein the menu list records at least one menu option contained on the webpage;

[0033] The first determining module is used to detect the operation information applied to the web page, and determine the user attention and user familiarity corresponding to each menu option based on the operation information;

[0034] The second determining module is used to determine the layout information corresponding to the webpage based on the user attention and the user familiarity.

[0035] A layout module is used to lay out at least one of the menu options contained on the webpage based on the layout information.

[0036] In one possible implementation, the layout information includes: the layout position corresponding to each menu option, the layout position being used to arrange the corresponding menu option.

[0037] The second determining module is specifically used for:

[0038] Obtain at least one option position corresponding to the webpage and the priority of each option position;

[0039] For each menu option, a corresponding layout score is determined based on the user attention and user familiarity with the menu option, wherein the higher the user attention and the lower the user familiarity, the higher the layout score.

[0040] Based on the layout score corresponding to each menu option and the priority corresponding to each option position, the correspondence between menu options and option positions is determined, wherein the menu option with the higher layout score corresponds to the option position with the higher priority.

[0041] For each menu option, the position of the option corresponding to the menu option is determined as the layout position of the menu option.

[0042] In one possible implementation, the device further includes:

[0043] The sorting module is used to sort all the menu options in descending order of their layout scores;

[0044] The third determining module is used to determine the preset number of menu options that are ranked first as the first option, and to determine the menu options other than the first option as the second option;

[0045] The rendering module is used to render the first option according to preset first rendering information, and to render the second option according to preset second rendering information, wherein the first rendering information and the second rendering information are different.

[0046] In one possible implementation, the operation information includes: the number of operations corresponding to each menu option, and the first determining module is specifically used for:

[0047] For each menu option, the user attention level is determined based on the number of operations corresponding to that menu option, wherein the more operations, the higher the user attention level.

[0048] In one possible implementation, the operation information includes: the operation trajectory corresponding to each menu option, and the first determining module is further configured to:

[0049] For each menu option, determine whether the operation trajectory corresponding to the menu option is a preset trajectory;

[0050] If the operation trajectory is a preset trajectory, the first level of familiarity is determined as the user familiarity.

[0051] If the operation trajectory is not a preset trajectory, the second familiarity is determined as the user familiarity, wherein the second familiarity is higher than the first familiarity.

[0052] In one possible implementation, the operation information includes: the operation trajectory and operation duration corresponding to each menu option, and the first determining module is further configured to:

[0053] For each menu option, determine whether the operation trajectory corresponding to the menu option is a preset trajectory;

[0054] When the operation trajectory is a preset trajectory, the user familiarity is determined based on the operation time corresponding to the menu option within a preset familiarity range. The longer the operation time, the lower the user familiarity.

[0055] When the operation trajectory is not a preset trajectory, the preset familiarity is determined as the user familiarity, wherein the preset familiarity is higher than the upper limit of the preset familiarity range.

[0056] Thirdly, an electronic device is provided, including a processor, a communication interface, a memory, and a communication bus, wherein the processor, the communication interface, and the memory communicate with each other through the communication bus;

[0057] Memory, used to store computer programs;

[0058] When a processor executes a program stored in memory, it implements any of the steps described in the first aspect.

[0059] Fourthly, a computer-readable storage medium is provided, characterized in that the computer-readable storage medium stores a computer program, which, when executed by a processor, implements the steps of any of the methods described in the first aspect.

[0060] Fifthly, a computer program product containing instructions is provided that, when run on a computer, causes the computer to perform any of the page layout methods described above.

[0061] Beneficial effects of the embodiments in this application:

[0062] This application provides a page layout method, apparatus, electronic device, and readable storage medium. The method involves: first, obtaining a menu list of a webpage, wherein the menu list records at least one menu option included on the webpage; then, detecting operation information applied to the webpage, and determining the user attention and familiarity corresponding to each menu option based on the operation information; furthermore, determining the layout information corresponding to the webpage based on the user attention and familiarity; and finally, laying out the at least one menu option included on the webpage based on the layout information. This application allows for intelligent modification of the webpage layout based on user actions, eliminating the need for manual modifications by developers and thus improving the efficiency of webpage layout modification. Furthermore, since the layout is modified based on user actions, the modified layout better suits user habits, thereby improving the user experience.

[0063] Of course, implementing any product or method of this application does not necessarily require achieving all of the advantages described above at the same time. Attached Figure Description

[0064] The accompanying drawings, which are incorporated in and form part of this specification, illustrate embodiments consistent with this application and, together with the description, serve to explain the principles of this application.

[0065] To more clearly illustrate the technical solutions in the embodiments of this application or the prior art, the drawings used in the description of the embodiments or the prior art will be briefly introduced below. Obviously, for those skilled in the art, other drawings can be obtained based on these drawings without creative effort.

[0066] Figure 1 A flowchart illustrating a page layout method provided in an embodiment of this application;

[0067] Figure 2 A flowchart illustrating another page layout method provided in this application embodiment;

[0068] Figure 3 This is a schematic diagram of the structure of a page layout device provided in an embodiment of this application;

[0069] Figure 4 This is a schematic diagram of the structure of an electronic device provided in an embodiment of this application. Detailed Implementation

[0070] To make the objectives, technical solutions, and advantages of the embodiments of this application clearer, the technical solutions of the embodiments of this application will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some embodiments of this application, not all embodiments. Based on the embodiments of this application, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this application.

[0071] The page layout method provided in this application will be explained and described below with reference to the accompanying drawings and specific embodiments. The embodiments do not constitute a limitation on the embodiments of this application.

[0072] See Figure 1 This is a flowchart illustrating an embodiment of a page layout method provided in this application. Figure 1 As shown, the process may include the following steps:

[0073] S101, Obtain the menu list of the webpage, wherein the menu list records at least one menu option contained on the webpage.

[0074] This application provides a page layout method for adjusting the layout of each menu option on a webpage. In practical applications, a webpage contains at least one menu option, such as a "Register" menu option, which pops up a registration interface through which a user can register as a member; a "Login" menu option, which pops up a login interface through which a user can log in with their account information; a "Shopping Cart" menu option, which displays the items added to the user's shopping cart; a "Favorites" menu option, which displays the items saved by the user; and so on.

[0075] The menu list mentioned above is a detailed table pre-created based on the menu options contained in the webpage, recording at least one menu option included on the webpage. In practical applications, this menu list can also record the index, name, URL (Uniform Resource Locator) to which each menu option is redirected, and coordinate location routing.

[0076] S102, detect the operation information applied to the webpage, and determine the user attention and user familiarity corresponding to each menu option based on the operation information.

[0077] Operation information refers to the information about actions taken by the user on the webpage.

[0078] In one embodiment, the operation information includes: the number of operations corresponding to each menu option. The specific implementation of determining the user attention corresponding to each menu option based on the operation information includes: for each menu option, determining the corresponding user attention based on the number of operations corresponding to the menu option, wherein the more operations, the higher the user attention.

[0079] The number of operations refers to the number of times a user selects a menu option within a certain period of time. For example, for a mouse-controlled device (such as a computer), the number of times the user clicks the location of the menu option with the mouse can be detected to obtain the number of operations; similarly, for a touchscreen-controlled device (such as a mobile phone), the number of times the user touches the location of the menu option with their finger can be detected to obtain the number of operations.

[0080] In this embodiment, the correspondence between different number of operations and different levels of attention can be preset. Generally, the more operations, the higher the user's attention.

[0081] In another embodiment, the operation information includes: the operation trajectory corresponding to each menu option. The specific implementation of determining the user familiarity corresponding to each menu option based on the operation information may include: for each menu option, determining whether the operation trajectory corresponding to the menu option is a preset trajectory; if the operation trajectory is a preset trajectory, determining a first familiarity as the user familiarity; if the operation trajectory is not a preset trajectory, determining a second familiarity as the user familiarity, wherein the second familiarity is higher than the first familiarity.

[0082] For mouse-controlled devices, the operation trajectory refers to the movement of the cursor on the webpage; for touchscreen-controlled devices, the operation trajectory refers to the movement of the user's finger on the device screen.

[0083] Taking mouse-controlled devices as an example, when users are unfamiliar with the layout of a webpage, they usually move the mouse aimlessly across the webpage, creating an elliptical trajectory.

[0084] Based on this, in this embodiment, it is possible to determine whether a user is familiar with the layout of a webpage based on the operation trajectory. Specifically, when the operation trajectory is a preset trajectory, a first level of familiarity is determined as the user's familiarity; when the operation trajectory is not a preset trajectory, a second level of familiarity is determined as the user's familiarity, wherein the second level of familiarity is higher than the first level of familiarity. The first level of familiarity indicates that the user is familiar with the location of the corresponding menu option on the webpage, while the second level of familiarity indicates that the user is not familiar with the location of the corresponding menu option on the webpage.

[0085] It should be noted that the preset trajectory can be determined based on the user's historical usage data.

[0086] Taking an elliptical trajectory as an example, the mathematical formula |PF1|+|PF2|=2a (2a>|F1F2|) can be used to determine whether the operation trajectory is an elliptical trajectory. Here, PF1 is the distance from any point (point P) on the operation trajectory to the focus F1, PF2 is the distance from point P to the focus F2, and 2a is a constant.

[0087] In another embodiment, the operation information includes: the operation trajectory and operation duration corresponding to each menu option. A specific implementation of determining the user familiarity corresponding to each menu option based on the operation information may include: for each menu option, determining whether the operation trajectory corresponding to the menu option is a preset trajectory; if the operation trajectory is a preset trajectory, determining the corresponding user familiarity within a preset familiarity range based on the operation duration corresponding to the menu option, wherein the longer the operation duration, the lower the user familiarity; if the operation trajectory is not a preset trajectory, determining the preset familiarity as the user familiarity, wherein the preset familiarity is higher than the upper limit of the preset familiarity range.

[0088] Operation duration refers to the time elapsed before a user selects a menu option. In other words, it is the time interval between the moment the current menu option is selected and the moment the previous menu option was selected. For the first selection of a menu option after opening a webpage, the operation duration is the time interval between the moment the current menu option is selected and the moment the webpage is opened.

[0089] In this embodiment, based on the preset operation trajectory, user familiarity is further determined according to the operation duration; that is, the longer the operation duration, the lower the user familiarity. However, if the operation trajectory is not a preset trajectory, the operation duration can be disregarded, and the preset familiarity can be directly determined as the user familiarity. Here, the preset familiarity is used to characterize the user's familiarity with the location of the corresponding menu option on the webpage.

[0090] S103, Based on the user attention and the user familiarity, determine the layout information corresponding to the webpage.

[0091] S104, Based on the layout information, at least one of the menu options contained on the webpage is laid out.

[0092] The following provides a unified explanation of S103 and S104:

[0093] The layout information mentioned above includes: the layout position corresponding to each menu option, and the layout position is used to arrange the corresponding menu option.

[0094] In this embodiment, after determining user attention and user familiarity, the layout information of the webpage can be determined based on these metrics. Specifically, this involves determining the layout position of each menu option on the webpage. Menu options with high user attention but low user familiarity are positioned in locations that are easier for users to select. Furthermore, the positions of the corresponding menu options are adjusted based on their determined layout positions. This allows menu options with high user attention but low user familiarity to be placed in positions that are easier for users to select, thereby improving user convenience and enhancing the user experience.

[0095] In this embodiment, firstly, a menu list of a webpage is obtained, wherein the menu list records at least one menu option contained on the webpage. Then, operation information applied to the webpage is detected, and user attention and familiarity corresponding to each menu option are determined based on the operation information. Next, based on the user attention and familiarity, layout information corresponding to the webpage is determined. Finally, the at least one menu option contained on the webpage is laid out based on the layout information. This application allows for intelligent modification of the webpage layout based on user actions, eliminating the need for manual modification by developers and thus improving the efficiency of webpage layout modification. Furthermore, since this application modifies the layout based on user actions, the modified layout is more in line with user habits, thereby improving the user experience.

[0096] See Figure 2 This is a flowchart illustrating an embodiment of another page layout method provided in this application. Figure 2 The process shown above Figure 1 Based on the illustrated process, this section describes how to determine the layout information corresponding to the webpage based on the user's attention level and user familiarity. For example... Figure 2 As shown, the process may include the following steps:

[0097] S201, obtain at least one option position corresponding to the webpage and the priority corresponding to each option position.

[0098] Option location refers to the position on the webpage where the corresponding menu options are placed.

[0099] In this embodiment of the application, the priority of each option position on the webpage can be preset, wherein the higher the priority of the option position, the easier it is for the user to select it.

[0100] For example, options located in the center of a webpage have higher priority, while those in the corners (such as the top right corner) have lower priority. Similarly, a webpage may contain multiple levels, with some menu options at the top level. For top-level options, users can directly select them, while for options not at the top, users must first navigate to the corresponding level. Therefore, top-level options are more convenient and have higher priority, while options further down the hierarchy have lower priority.

[0101] S202, for each menu option, a corresponding layout score is determined based on the user attention and user familiarity corresponding to the menu option, wherein the higher the user attention and the lower the user familiarity, the higher the layout score.

[0102] In this embodiment of the application, the weights of user attention and user familiarity can be preset. For each menu option, the corresponding layout score is calculated based on the user attention and user familiarity and the corresponding weights of the menu option. The higher the user attention and the lower the user familiarity, the higher the layout score.

[0103] For example, if the weights of user attention and user familiarity are a and b (a+b=1) respectively, the layout score can be calculated using the following formula: Layout score = User attention * a + User familiarity * b.

[0104] S203, based on the layout score corresponding to each menu option and the priority corresponding to each option position, determine the correspondence between menu options and option positions, wherein the menu option with the higher layout score corresponds to the option position with the higher priority.

[0105] S204, for each menu option, determine the option position corresponding to the menu option as the layout position corresponding to the menu option.

[0106] The following provides a unified explanation of S203-S204:

[0107] In this embodiment, the number of menu options and the number of option positions are the same. After calculating the layout score of each menu option, a correspondence between menu options and option positions is established based on the layout score and the priority of the option position. The menu option with the higher layout score has a higher priority for its corresponding option position. Then, the option position corresponding to each menu option is determined as the layout position corresponding to that menu option. The layout position corresponding to each menu option is the layout information of the web page.

[0108] For example, there are 3 menu options: Option 1, Option 2, and Option 3, with corresponding layout scores of 8, 9, and 10 points respectively. There are also 3 option positions: Position 1, Position 2, and Position 3, with corresponding priorities of Position 1 < Position 2 < Position 3. The correspondence between menu options and option positions is as follows: Option 1 corresponds to Position 1, Option 2 corresponds to Position 2, and Option 3 corresponds to Position 3. That is, Option 3, with the highest score, corresponds to Position 3, with the highest priority; Option 2, with the second highest score, corresponds to Position 2, with the second highest priority; and Option 1, with the lowest score, corresponds to Position 1, with the lowest priority.

[0109] pass Figure 2 The process shown creates a correspondence between menu options and their positions based on their layout scores and priority. This allows menu options with higher layout scores to be placed in positions corresponding to higher-priority options. In this way, menu options that are frequently used but less familiar to users are adjusted to more easily selectable locations based on user habits, thus improving the user experience.

[0110] In another embodiment, the method may further include the following steps: sorting all the menu options in descending order of the layout score, determining a preset number of menu options at the top of the sort as first options, determining the menu options other than the first options as second options, rendering the first options according to preset first rendering information, and rendering the second options according to preset second rendering information, wherein the first rendering information is different from the second rendering information.

[0111] In this embodiment, first rendering information and second rendering information can be preset. The second rendering information is generally the default rendering information, while the first rendering information is enhanced based on the second rendering information. For example, it might darken the color of the menu option icons on the webpage, increase the rendering area of ​​the menu option icons on the webpage, or thicken the borders of the menu option icons. This further facilitates users in finding menu options with higher layout scores, thereby improving the user experience.

[0112] Based on the same technical concept, embodiments of this application also provide a page layout device, such as... Figure 3 As shown, the device includes:

[0113] The acquisition module 301 is used to acquire the menu list of a web page, wherein the menu list records at least one menu option contained on the web page;

[0114] The first determining module 302 is used to detect operation information applied to the web page and determine the user attention and user familiarity corresponding to each menu option based on the operation information.

[0115] The second determining module 303 is used to determine the layout information corresponding to the webpage based on the user attention and the user familiarity.

[0116] The layout module 304 is used to lay out at least one of the menu options contained on the web page based on the layout information.

[0117] In one possible implementation, the layout information includes: the layout position corresponding to each menu option, the layout position being used to arrange the corresponding menu option.

[0118] The second determining module is specifically used for:

[0119] Obtain at least one option position corresponding to the webpage and the priority of each option position;

[0120] For each menu option, a corresponding layout score is determined based on the user attention and user familiarity with the menu option, wherein the higher the user attention and the lower the user familiarity, the higher the layout score.

[0121] Based on the layout score corresponding to each menu option and the priority corresponding to each option position, the correspondence between menu options and option positions is determined, wherein the menu option with the higher layout score corresponds to the option position with the higher priority.

[0122] For each menu option, the position of the option corresponding to the menu option is determined as the layout position of the menu option.

[0123] In one possible implementation, the device further includes:

[0124] The sorting module is used to sort all the menu options in descending order of their layout scores;

[0125] The third determining module is used to determine the preset number of menu options that are ranked first as the first option, and to determine the menu options other than the first option as the second option;

[0126] The rendering module is used to render the first option according to preset first rendering information, and to render the second option according to preset second rendering information, wherein the first rendering information and the second rendering information are different.

[0127] In one possible implementation, the operation information includes: the number of operations corresponding to each menu option, and the first determining module is specifically used for:

[0128] For each menu option, the user attention level is determined based on the number of operations corresponding to that menu option, wherein the more operations, the higher the user attention level.

[0129] In one possible implementation, the operation information includes: the operation trajectory corresponding to each menu option, and the first determining module is further configured to:

[0130] For each menu option, determine whether the operation trajectory corresponding to the menu option is a preset trajectory;

[0131] If the operation trajectory is a preset trajectory, the first level of familiarity is determined as the user familiarity.

[0132] If the operation trajectory is not a preset trajectory, the second familiarity is determined as the user familiarity, wherein the second familiarity is higher than the first familiarity.

[0133] In one possible implementation, the operation information includes: the operation trajectory and operation duration corresponding to each menu option, and the first determining module is further configured to:

[0134] For each menu option, determine whether the operation trajectory corresponding to the menu option is a preset trajectory;

[0135] When the operation trajectory is a preset trajectory, the user familiarity is determined based on the operation time corresponding to the menu option within a preset familiarity range. The longer the operation time, the lower the user familiarity.

[0136] When the operation trajectory is not a preset trajectory, the preset familiarity is determined as the user familiarity, wherein the preset familiarity is higher than the upper limit of the preset familiarity range.

[0137] In this embodiment, firstly, a menu list of a webpage is obtained, wherein the menu list records at least one menu option contained on the webpage. Then, operation information applied to the webpage is detected, and user attention and familiarity corresponding to each menu option are determined based on the operation information. Next, based on the user attention and familiarity, layout information corresponding to the webpage is determined. Finally, the at least one menu option contained on the webpage is laid out based on the layout information. This application allows for intelligent modification of the webpage layout based on user actions, eliminating the need for manual modification by developers and thus improving the efficiency of webpage layout modification. Furthermore, since this application modifies the layout based on user actions, the modified layout is more in line with user habits, thereby improving the user experience.

[0138] Based on the same technical concept, embodiments of this application also provide an electronic device, such as... Figure 4 As shown, it includes a processor 111, a communication interface 112, a memory 113, and a communication bus 114, wherein the processor 111, the communication interface 112, and the memory 113 communicate with each other through the communication bus 114.

[0139] Memory 113 is used to store computer programs;

[0140] When processor 111 executes a program stored in memory 113, it performs the following steps:

[0141] Obtain the menu list of the web page, wherein the menu list records at least one menu option contained on the web page;

[0142] The system detects the operation information applied to the webpage and determines the user attention and user familiarity corresponding to each menu option based on the operation information.

[0143] Based on the user attention and the user familiarity, the layout information corresponding to the webpage is determined;

[0144] The layout information is used to lay out at least one of the menu options contained on the webpage.

[0145] The communication bus mentioned in the above electronic devices can be a Peripheral Component Interconnect (PCI) bus or an Extended Industry Standard Architecture (EISA) bus, etc. This communication bus can be divided into address bus, data bus, control bus, etc. For ease of illustration, only one thick line is used to represent it in the diagram, but this does not indicate that there is only one bus or one type of bus.

[0146] The communication interface is used for communication between the aforementioned electronic devices and other devices.

[0147] The memory may include random access memory (RAM) or non-volatile memory (NVM), such as at least one disk storage device. Optionally, the memory may also be at least one storage device located remotely from the aforementioned processor.

[0148] The processors mentioned above can be general-purpose processors, including central processing units (CPUs), network processors (NPs), etc.; they can also be digital signal processors (DSPs), application-specific integrated circuits (ASICs), field-programmable gate arrays (FPGAs), or other programmable logic devices, discrete gate or transistor logic devices, or discrete hardware components.

[0149] In another embodiment provided in this application, a computer-readable storage medium is also provided, which stores a computer program that, when executed by a processor, implements the steps of any of the above-described page layout methods.

[0150] In another embodiment provided in this application, a computer program product containing instructions is also provided, which, when run on a computer, causes the computer to execute any of the page layout methods described above.

[0151] In the above embodiments, implementation can be achieved entirely or partially through software, hardware, firmware, or any combination thereof. When implemented using software, it can be implemented entirely or partially in the form of a computer program product. The computer program product includes one or more computer instructions. When the computer program instructions are loaded and executed on a computer, all or part of the processes or functions described in the embodiments of this application are generated. The computer can be a general-purpose computer, a special-purpose computer, a computer network, or other programmable device. The computer instructions can be stored in a computer-readable storage medium or transmitted from one computer-readable storage medium to another. For example, the computer instructions can be transmitted from one website, computer, server, or data center to another website, computer, server, or data center via wired (e.g., coaxial cable, fiber optic, digital subscriber line (DSL)) or wireless (e.g., infrared, wireless, microwave, etc.) means. The computer-readable storage medium can be any available medium that a computer can access or a data storage device such as a server or data center that integrates one or more available media. The available medium can be a magnetic medium (e.g., floppy disk, hard disk, magnetic tape), an optical medium (e.g., DVD), or a semiconductor medium (e.g., solid state disk (SSD)).

[0152] It should be noted that, in this document, relational terms such as "first" and "second" are used merely to distinguish one entity or operation from another, and do not necessarily require or imply any such actual relationship or order between these entities or operations. Furthermore, the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Without further limitations, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes said element.

[0153] The above description is merely a specific embodiment of this application, enabling those skilled in the art to understand or implement this application. Various modifications to these embodiments will be readily apparent to those skilled in the art, and the general principles defined herein may be implemented in other embodiments without departing from the spirit or scope of this application. Therefore, this application is not to be limited to the embodiments shown herein, but is to be accorded the widest scope consistent with the principles and novel features claimed herein.

Claims

1. A page layout method, characterized in that, The method includes: Obtain the menu list of the web page, wherein the menu list records at least one menu option contained on the web page, and is a detailed table created in advance based on the menu option contained on the web page; The system detects operation information applied to the webpage and determines user attention and familiarity for each menu option based on the operation information. The operation information includes the operation trajectory for each menu option. Determining user familiarity for each menu option based on the operation information includes: for each menu option, determining whether the operation trajectory is a preset trajectory; if the operation trajectory is a preset trajectory, determining user familiarity within a preset familiarity range based on the operation duration of the menu option, wherein a longer operation duration results in lower user familiarity; if the operation trajectory is not a preset trajectory, determining the preset familiarity as the user familiarity, wherein the preset familiarity is higher than the upper limit of the preset familiarity range, and the preset familiarity is used to characterize user familiarity with the position of the corresponding menu option on the webpage. Based on the user attention and the user familiarity, the layout information corresponding to the webpage is determined; The layout information is used to lay out at least one of the menu options contained on the webpage.

2. The method according to claim 1, characterized in that, The layout information includes: the layout position corresponding to each menu option, where the layout position is used to arrange the corresponding menu option. The step of determining the layout information corresponding to the webpage based on the user attention and the user familiarity includes: Obtain at least one option position corresponding to the webpage and the priority of each option position; For each menu option, a corresponding layout score is determined based on the user attention and user familiarity with the menu option, wherein the higher the user attention and the lower the user familiarity, the higher the layout score. Based on the layout score corresponding to each menu option and the priority corresponding to each option position, the correspondence between menu options and option positions is determined, wherein the menu option with the higher layout score corresponds to the option position with the higher priority. For each menu option, the position of the option corresponding to the menu option is determined as the layout position of the menu option.

3. The method according to claim 2, characterized in that, The method further includes: Sort all the menu options in descending order of their layout scores; The menu options that are ranked first are designated as the first option, and the menu options other than the first option are designated as the second option. The first option is rendered according to preset first rendering information, and the second option is rendered according to preset second rendering information, wherein the first rendering information and the second rendering information are different.

4. The method according to claim 1, characterized in that, The operation information includes: the number of operations corresponding to each menu option; determining the user attention level corresponding to each menu option based on the operation information includes: For each menu option, the user attention level is determined based on the number of operations corresponding to that menu option, wherein the more operations, the higher the user attention level.

5. A page layout device, characterized in that, The device includes: The acquisition module is used to acquire the menu list of a web page, wherein the menu list records at least one menu option contained on the web page, and is a detailed table created in advance based on the menu option contained on the web page; The first determining module is used to detect operation information applied to the webpage and determine the user attention and user familiarity corresponding to each menu option based on the operation information. The operation information includes: the operation trajectory corresponding to each menu option. Determining the user familiarity corresponding to each menu option based on the operation information includes: for each menu option, determining whether the operation trajectory corresponding to the menu option is a preset trajectory; if the operation trajectory is a preset trajectory, determining the corresponding user familiarity based on the operation duration corresponding to the menu option within a preset familiarity range, wherein the longer the operation duration, the lower the user familiarity; if the operation trajectory is not a preset trajectory, determining the preset familiarity as the user familiarity, wherein the preset familiarity is higher than the upper limit of the preset familiarity range, and the preset familiarity is used to characterize the user's familiarity with the position of the corresponding menu option on the webpage. The second determining module is used to determine the layout information corresponding to the webpage based on the user attention and the user familiarity. A layout module is used to lay out at least one of the menu options contained on the webpage based on the layout information.

6. The apparatus according to claim 5, characterized in that, The layout information includes: the layout position corresponding to each menu option, where the layout position is used to arrange the corresponding menu option. The second determining module is specifically used for: Obtain at least one option position corresponding to the webpage and the priority of each option position; For each menu option, a corresponding layout score is determined based on the user attention and user familiarity with the menu option, wherein the higher the user attention and the lower the user familiarity, the higher the layout score. Based on the layout score corresponding to each menu option and the priority corresponding to each option position, the correspondence between menu options and option positions is determined, wherein the menu option with the higher layout score corresponds to the option position with the higher priority. For each menu option, the position of the option corresponding to the menu option is determined as the layout position of the menu option.

7. An electronic device, characterized in that, It includes a processor, a communication interface, a memory, and a communication bus, wherein the processor, the communication interface, and the memory communicate with each other through the communication bus; Memory, used to store computer programs; A processor, when executing a program stored in memory, implements the steps of the method described in any one of claims 1-4.

8. A computer-readable storage medium, characterized in that, The computer-readable storage medium stores a computer program that, when executed by a processor, implements the steps of the method described in any one of claims 1-4.

Citation Information

Patent Citations

  • Function menu display method and system and related device

    CN109933402A

  • Operation proficiency identification method and device and storage medium

    CN111046739A

  • Method and device for dynamically changing menu layout based on user behavior analysis and medium

    CN114968028A

  • Information processor, menu generating method, and program

    JP2008310791A