Page layout optimization method and device based on responsive design, electronic equipment and storage medium

Abstract

The invention discloses a page layout optimization method and device based on responsive design, electronic equipment and a storage medium. The method comprises the following steps: collecting current user behavior data and current equipment characteristic data; outputting corresponding current optimal layout configuration information by utilizing a layout optimization model according to the current user behavior data and the current equipment characteristic data; and performing layout adaptive adjustment on the target page according to the current optimal layout configuration information. Based on the current user behavior data and the current equipment characteristic data, dynamic page layout adaptive adjustment can be achieved, intelligent page layout optimization is completed, page layout optimization efficiency and accuracy are improved, user experience is improved, and the method can be widely applied to the technical field of front-end development.

Description

Technical Field

[0001] This application relates to the field of front-end development technology, and in particular to a method, apparatus, electronic device and storage medium for optimizing page layout based on responsive design. Background Technology

[0002] With the development of the internet and the widespread use of mobile devices, users are accessing web pages more frequently on various devices. This trend has prompted developers to increasingly emphasize responsive design to ensure a good user experience across different screen sizes and resolutions. The basic concept of responsive design is to use flexible grid layouts, images, and CSS media queries to allow web pages to automatically adjust their display based on the user's device.

[0003] However, traditional responsive design techniques still have some shortcomings. First, responsive design often relies on static layouts and style definitions, making it difficult to quickly adapt to specific user needs and behaviors. For example, when users frequently switch between different devices, traditional responsive design cannot capture these changes in a timely manner and make corresponding adjustments. Second, traditional responsive design often only considers device parameters (such as screen size and resolution) while ignoring user interaction behaviors and habits, making it difficult to provide the best user experience. Summary of the Invention

[0004] The main objective of this application is to propose a page layout optimization method, apparatus, electronic device, and storage medium based on responsive design, which can achieve adaptive adjustment of page layout and improve the efficiency and accuracy of page layout optimization.

[0005] On the one hand, embodiments of this application propose a page layout optimization method based on responsive design, the method comprising the following steps:

[0006] Collect current user behavior data and current device characteristic data;

[0007] Using a layout optimization model, based on the current user behavior data and the current device characteristic data, the corresponding current optimal layout configuration information is output;

[0008] Based on the current optimal layout configuration information, the target page is adaptively adjusted in terms of layout.

[0009] In some embodiments, the collection of current user behavior data and current device characteristic data specifically includes:

[0010] According to a preset time interval, the current user behavior data is collected, including multiple user interaction events and multiple user interaction behaviors. The user interaction behaviors are determined by several user interaction events that are related.

[0011] Monitor device update operations and collect current device characteristic data, including device hardware characteristics, device software characteristics, device network characteristics, and user behavior-derived characteristics.

[0012] In some embodiments, the layout optimization model includes a layout analysis module and a layout selection module. The step of using the layout optimization model to output corresponding current optimal layout configuration information based on the current user behavior data and the current device characteristic data specifically includes:

[0013] The current user behavior data and the current device characteristic data are input into the layout analysis module, and the layout analysis module is used to perform data analysis and generate layout configuration analysis information.

[0014] The layout configuration analysis information is input into the layout selection module. Using the layout selection module, a probabilistic exploration strategy is employed to select a layout based on the layout configuration information and reward value calculation rules. The current optimal layout configuration information with the highest reward value is output. The layout configuration information includes multiple layout options, which include predefined page components and their corresponding component positions, style parameters, and interaction response rules. The current optimal layout configuration information includes the current optimal component position, current optimal component style, and current optimal component interaction response rules for each page component.

[0015] In some embodiments, the step of adaptively adjusting the layout of the target page based on the current optimal layout configuration information specifically includes:

[0016] Based on the current optimal layout configuration information, generate the corresponding optimal layout model;

[0017] The optimal layout model is obtained as the current page layout corresponding to the target page.

[0018] In some embodiments, the method further includes:

[0019] Obtain current layout option information and user history feedback information, wherein the user history feedback information includes user satisfaction feedback results for each historical page layout;

[0020] The layout optimization model is optimized based on the current layout options and the user's historical feedback information.

[0021] In some embodiments, optimizing the layout optimization model based on the current layout option information and the user's historical feedback information specifically includes:

[0022] The current layout option information is preprocessed, and the preprocessed current layout option information is used as the layout configuration information.

[0023] Data analysis is performed on the historical user feedback information to determine the layout satisfaction analysis results;

[0024] Based on the layout satisfaction analysis results, the reward value calculation rules are optimized.

[0025] In some embodiments, the method further includes:

[0026] Receive a data update instruction for the current layout option information and determine the updated current layout option information;

[0027] The updated current layout option information is obtained as the current layout option information.

[0028] On the other hand, embodiments of this application propose a page layout optimization device based on responsive design, the device comprising:

[0029] The first module is used to collect current user behavior data and current device characteristic data;

[0030] The second module is used to utilize the layout optimization model to output the corresponding current optimal layout configuration information based on the current user behavior data and the current device characteristic data.

[0031] The third module is used to adaptively adjust the layout of the target page based on the current optimal layout configuration information.

[0032] On the other hand, embodiments of this application propose an electronic device, which includes a memory and a processor. The memory stores a computer program, and the processor executes the computer program to implement the page layout optimization method described above.

[0033] On the other hand, embodiments of this application propose a computer-readable storage medium storing a computer program that, when executed by a processor, implements the page layout optimization method described above.

[0034] The embodiments of this application include at least the following beneficial effects: This application provides a page layout optimization method, apparatus, electronic device, and storage medium based on responsive design. It collects current user behavior data and current device characteristic data, utilizes a layout optimization model, and outputs corresponding current optimal layout configuration information based on the current user behavior data and current device characteristic data. Based on the current optimal layout configuration information, it adaptively adjusts the layout of the target page. This application can achieve dynamic adaptive adjustment of the page layout based on current user behavior data and current device characteristic data, completing intelligent page layout optimization, improving the efficiency and accuracy of page layout optimization, and enhancing the user experience. Attached Figure Description

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

[0036] In order to more clearly illustrate the embodiments of the present invention or the technical solutions in the prior art, the following briefly introduces the drawings required for use in the embodiments or the description of the prior art. Obviously, for ordinary technicians in this field, other drawings can be obtained based on these drawings without any creative work.

[0037] Figure 1 This is a flowchart of a page layout optimization method based on responsive design provided in an embodiment of this application;

[0038] Figure 2 This is a schematic diagram of a page layout optimization device based on responsive design provided in an embodiment of this application;

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

[0040] To make the objectives, technical solutions, and advantages of this application clearer, the following detailed description is provided in conjunction with the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are merely illustrative of this application and are not intended to limit it. In the following description, when referring to the accompanying drawings, unless otherwise indicated, the same numbers in different drawings represent the same or similar elements. The embodiments described in the following exemplary embodiments do not represent all embodiments consistent with those of this application; they are merely examples of apparatuses and methods consistent with some aspects of the embodiments of this application as detailed in the appended claims.

[0041] It is understood that the terms “first,” “second,” etc., used in this application may be used herein to describe various concepts, but unless otherwise stated, these concepts are not limited by these terms. These terms are only used to distinguish one concept from another. For example, without departing from the scope of the embodiments of this application, first information may also be referred to as second information, and similarly, second information may also be referred to as first information. Depending on the context, the words “if,” “when,” or “in response to a determination” as used herein may be interpreted as “when…” or “when…” or “in response to a determination.”

[0042] As used in this application, the terms "at least one", "multiple", "each", "any", etc., "at least one" includes one, two or more, "multiple" includes two or more, "each" refers to each of the corresponding multiples, and "any" refers to any one of the multiples.

[0043] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as commonly understood by one of ordinary skill in the art to which this application belongs. The terminology used herein is for the purpose of describing embodiments of this application only and is not intended to limit this application.

[0044] Reference Figure 1 , Figure 1 This is a flowchart of a page layout optimization method based on responsive design provided in an embodiment of this application. The method may include, but is not limited to, steps S101 to S103:

[0045] Step S101: Collect current user behavior data and current device characteristic data;

[0046] Step S102: Using the layout optimization model, output the corresponding current optimal layout configuration information based on the current user behavior data and the current device characteristic data;

[0047] Step S103: Adjust the layout of the target page adaptively based on the current optimal layout configuration information.

[0048] In step S101 of some embodiments, current user behavior data is collected according to a preset time interval, including multiple user interaction events and multiple user interaction behaviors. The user interaction behaviors are determined by several user interaction events that are related. The user interaction events are captured using an event listener, such as clicks, swipes, page dwell time, etc. The user interaction behavior corresponds to one or more user interaction events. For example, the user interaction behavior of "payment successful" on the page may include, but is not limited to, multiple user interaction events such as "click the payment button", "enter password", and "confirm order".

[0049] Monitor device update operations and collect current device characteristic data, including device hardware characteristics, device software characteristics, device network characteristics, and user behavior-derived characteristics. For example, by listening to the resize event, dynamically update the current device characteristic data. The resize event is a JavaScript event triggered in the browser when the window or element size changes.

[0050] Optionally, device hardware characteristics include device type, device model, hardware configuration, screen information (including resolution, screen size, and pixel density, etc.) and sensor support information, device software characteristics include operating system information (including type and version, etc.), browser information (including browser type and browser version, etc.), device network characteristics include network type, device operator, and network connection quality, and user behavior-derived characteristics include device usage habits (including average daily usage time and high-frequency usage periods, etc.) and device unique identifier, etc.

[0051] In some embodiments, the layout optimization model includes a layout analysis module and a layout selection module, and step S102 may include, but is not limited to, steps S201 to S202:

[0052] Step S201: Input the current user behavior data and the current device characteristic data into the layout analysis module, and use the layout analysis module to perform data analysis and generate layout configuration analysis information;

[0053] Step S202: Input the layout configuration analysis information into the layout selection module. Using the layout selection module, a probabilistic exploration strategy is adopted to select a layout based on the layout configuration information and the reward value calculation rules, and output the current optimal layout configuration information with the highest reward value.

[0054] In some embodiments, the layout configuration information includes multiple layout options. Each layout option includes predefined page components and the corresponding component positions, style parameters (including size, color, and animation effects, etc.) and interaction response rules (such as click-to-jump logic, etc.). The current optimal layout configuration information includes the current optimal component position, current optimal component style, and current optimal component interaction response rules for each page component.

[0055] For example, layout option A is layoutA: a large image is displayed in the center, and the button is located at the bottom (suitable for mobile devices); layout option B is layoutB: a multi-column grid layout, with the button floating on the side, and so on.

[0056] In some embodiments, the layout optimization model is built on a multi-armed bandit model, which can be used to explore and utilize multiple layout options provided by the layout configuration information in order to maximize user satisfaction.

[0057] Optionally, current user behavior data and current device characteristic data are input into the layout analysis module to perform data analysis. Specifically, by analyzing the current device characteristic data, the basic adaptation direction of the page layout is determined (e.g., mobile devices prioritize single-column navigation, while desktop devices prioritize multi-column navigation). By analyzing the current user behavior data, the priority of layout elements is determined (e.g., enlarging and fixing the position of frequently clicked component buttons). The layout configuration analysis information includes the aforementioned basic adaptation direction of the page layout and the priority of layout elements.

[0058] In some embodiments, the probabilistic exploration strategy using the layout selection module includes the ε-greedy strategy, etc. The ε-greedy strategy is used to select the current optimal layout. Specifically, the ε-greedy strategy performs random exploration according to a set exploration rate (epsilon) ε. Based on the exploration rate ε and the reward value of each layout option, the optimal layout option combination with the highest current reward value is determined. For example, if ε is 10%, there is a 10% probability of randomly selecting a layout option combination, and the remaining 90% probability of selecting the optimal layout option combination with the highest current reward value. The optimal layout option combination includes multiple optimal layout options selected from the layout configuration information. All optimal layout options are combined to generate the optimal layout configuration information.

[0059] Optionally, the reward value of a layout option can be dynamically adjusted based on the priority of layout elements contained in the layout configuration analysis information or user historical feedback information. The higher the reward value, the higher the user's satisfaction with the layout option. For example, if the user click frequency and dwell time of a component button corresponding to a certain layout option increase, the reward value of the layout option will be increased. If the user click frequency and dwell time of a component button corresponding to a certain layout option decrease, the reward value of the layout option will be decreased.

[0060] By analyzing the priority of layout elements or user history feedback information contained in the layout configuration analysis information, the reward value of layout options is continuously updated to improve the accuracy of layout selection and user satisfaction.

[0061] In step S103 of some embodiments, a corresponding optimal layout model is generated based on the current optimal layout configuration information, and the optimal layout model is obtained as the current page layout corresponding to the target page.

[0062] Optionally, multiple optimal layout options are obtained from the current optimal layout configuration information. Based on each optimal layout option, the page structure and configuration information of each page component (including component position, style parameters, and interaction response rules) are determined. Based on the page structure and configuration information of each page component, a corresponding optimal layout model is generated. This optimal layout model is then applied as the current page layout when the user browses the target page on the current device.

[0063] In some embodiments, the above-described page layout optimization method may also include, but is not limited to, steps S301 to S302:

[0064] Step S301: Obtain current layout option information and user history feedback information, wherein the user history feedback information includes the user's satisfaction feedback results for each historical page layout.

[0065] Step S302: Optimize the layout optimization model based on the current layout option information and user historical feedback information.

[0066] In some embodiments, step S302 may include, but is not limited to, steps S401 to S403:

[0067] Step S401: Preprocess the current layout option information and use the preprocessed current layout option information as layout configuration information;

[0068] Step S402: Perform data analysis on historical user feedback information to determine the layout satisfaction analysis results;

[0069] Step S403: Optimize the reward value calculation rules based on the layout satisfaction analysis results.

[0070] In some embodiments, each layout option in the current layout option information is formatted, the formatted layout options are combined to generate layout configuration information and stored, and the layout optimization model dynamically obtains the layout configuration information.

[0071] In some embodiments, optionally, statistical analysis methods (such as A / B testing, regression analysis, etc.) are used to analyze historical user feedback data. By analyzing historical user feedback data, user satisfaction with different page layouts at different time periods is obtained, i.e., the above-mentioned layout satisfaction analysis results. Data visualization tools are used to visualize the layout satisfaction analysis results and generate corresponding visualization charts. These visualization charts are used to show the changing trends of user satisfaction with each page layout at different time periods.

[0072] In some embodiments, the above-described page layout optimization method may also include, but is not limited to, steps S501 to S502:

[0073] Step S501: Receive a data update instruction for the current layout option information and determine the updated current layout option information;

[0074] Step S502: Obtain the updated current layout option information as the current layout option information.

[0075] In some embodiments, in response to a user's update operation on any layout option in the current layout option information, including data deletion, data addition, and data modification, a corresponding data update instruction is received, and any layout option in the current layout option information is dynamically updated according to the data update instruction.

[0076] Reference Figure 2 , Figure 2 This is an optional structural diagram of a page layout optimization device based on responsive design provided in an embodiment of this application. The device is used to implement the above-described page layout optimization method and may include:

[0077] The first module is used to collect current user behavior data and current device characteristic data;

[0078] The second module is used to utilize the layout optimization model to output the corresponding current optimal layout configuration information based on current user behavior data and current device characteristic data.

[0079] The third module is used to adaptively adjust the layout of the target page based on the current optimal layout configuration information.

[0080] It is understood that the content of the above method embodiments is applicable to the present device embodiments. The specific functions implemented by the present device embodiments are the same as those of the above method embodiments, and the beneficial effects achieved are also the same as those achieved by the above method embodiments.

[0081] This application also provides an electronic device, which includes a memory and a processor. The memory stores a computer program, and the processor executes the computer program to implement the above-described page layout optimization method. This electronic device can be any smart terminal, including tablet computers.

[0082] It is understood that the content of the above method embodiments is applicable to this device embodiment. The specific functions implemented by this device embodiment are the same as those of the above method embodiments, and the beneficial effects achieved are also the same as those achieved by the above method embodiments.

[0083] Please see Figure 3 , Figure 3The hardware structure of an electronic device according to another embodiment is illustrated. The electronic device includes:

[0084] The processor 901 can be implemented using a general-purpose CPU (Central Processing Unit), microprocessor, application-specific integrated circuit (ASIC), or one or more integrated circuits, and is used to execute relevant programs to implement the technical solutions provided in the embodiments of this application.

[0085] The memory 902 can be implemented as a read-only memory (ROM), static storage device, dynamic storage device, or random access memory (RAM). The memory 902 can store the operating system and other applications. When the technical solutions provided in the embodiments of this specification are implemented through software or firmware, the relevant program code is stored in the memory 902 and is called and executed by the processor 901 using the page layout optimization method of the embodiments of this application.

[0086] The input / output interface 903 is used to implement information input and output;

[0087] The communication interface 904 is used to enable communication and interaction between this device and other devices. Communication can be achieved through wired means (such as USB, Ethernet cable, etc.) or wireless means (such as mobile network, WIFI, Bluetooth, etc.).

[0088] Bus 905 transmits information between various components of the device (e.g., processor 901, memory 902, input / output interface 903, and communication interface 904);

[0089] The processor 901, memory 902, input / output interface 903, and communication interface 904 are connected to each other within the device via bus 905.

[0090] This application also provides a computer-readable storage medium storing a computer program that, when executed by a processor, implements the above-described page layout optimization method.

[0091] It is understood that the content of the above method embodiments is applicable to this storage medium embodiment. The specific functions implemented in this storage medium embodiment are the same as those in the above method embodiments, and the beneficial effects achieved are also the same as those achieved in the above method embodiments.

[0092] The memory, as a non-transient computer-readable storage medium, can be used to store non-transient software programs and non-transient computer executable programs. In addition, the memory may include a high-speed random access memory and may also include a non-transient memory, such as at least one disk storage device, a flash memory device, or other non-transient solid-state storage device. In some embodiments, the memory may optionally include a memory remotely arranged relative to the processor, and these remote memories may be connected to the processor via a network. Examples of the above-mentioned network include, but are not limited to, the Internet, an intranet, a local area network, a mobile communication network, and combinations thereof.

[0093] This application provides a page layout optimization method, apparatus, electronic device, and storage medium based on responsive design. It can dynamically and adaptively adjust the page layout based on current user behavior data and current device characteristic data, thereby achieving intelligent page layout optimization, improving the efficiency and accuracy of page layout optimization, and enhancing user experience.

[0094] The embodiments described in this application are for the purpose of more clearly illustrating the technical solutions of the embodiments of this application, and do not constitute a limitation on the technical solutions provided by the embodiments of this application. As those skilled in the art will know, with the evolution of technology and the emergence of new application scenarios, the technical solutions provided by the embodiments of this application are also applicable to similar technical problems.

[0095] Those skilled in the art will understand that the technical solutions shown in the figures do not constitute a limitation on the embodiments of the present application, and may include more or fewer steps than shown in the figures, or a combination of certain steps, or different steps.

[0096] The device embodiments described above are merely illustrative. The units described as separate components may or may not be physically separate, i.e., they may be located in one place or distributed across multiple network units. Some or all of the modules may be selected based on actual needs to achieve the objectives of this embodiment.

[0097] Those skilled in the art will appreciate that all or some of the steps in the methods, systems, and functional modules / units in the devices disclosed above may be implemented as software, firmware, hardware, or appropriate combinations thereof.

[0098] The terms “first,” “second,” “third,” “fourth,” etc. (if present) in the specification and accompanying drawings of this application are used to distinguish similar objects and are not necessarily used to describe a specific order or sequence. It should be understood that such data can be interchanged where appropriate so that the embodiments of this application described herein can be implemented in orders other than those illustrated or described herein. Furthermore, the terms “comprising” and “having,” and any variations thereof, are intended to cover non-exclusive inclusion; for example, a process, method, system, product, or apparatus that comprises a series of steps or units is not necessarily limited to those steps or units explicitly listed, but may include other steps or units not explicitly listed or inherent to such processes, methods, products, or apparatus.

[0099] It should be understood that in this application, "at least one (item)" means one or more, and "plurality" means two or more. "And / or" is used to describe the association relationship of associated objects, indicating that three relationships may exist. For example, "A and / or B" can mean: only A exists, only B exists, and A and B exist at the same time, where A and B can be singular or plural. The character " / " generally indicates that the previous and next associated objects are in an "or" relationship. "At least one of the following items" or similar expressions refers to any combination of these items, including any combination of single items or plural items. For example, at least one of a, b or c can mean: a, b, c, "a and b", "a and c", "b and c", or "a and b and c", where a, b, c can be single or multiple.

[0100] In the several embodiments provided in this application, it should be understood that the disclosed devices and methods can be implemented in other ways. For example, the device embodiments described above are merely schematic. For example, the division of the above-mentioned units is only a logical function division. In actual implementation, there may be other division methods, such as multiple units or components can be combined or integrated into another system, or some features can be ignored or not executed. Another point is that the mutual coupling or direct coupling or communication connection shown or discussed can be through some interfaces, indirect coupling or communication connection of devices or units, which can be electrical, mechanical or other forms.

[0101] The units described above as separate components may or may not be physically separate. The components shown as units may or may not be physical units; that is, they may be located in one place or distributed across multiple network units. Some or all of the units can be selected to achieve the purpose of this embodiment according to actual needs.

[0102] In addition, the functional units in the various embodiments of the present application may be integrated into a single processing unit, or each unit may exist physically separately, or two or more units may be integrated into a single unit. The aforementioned integrated units may be implemented in the form of hardware or software functional units.

[0103] It should be recognized that embodiments of the present invention can be implemented or carried out by computer hardware, a combination of hardware and software, or by computer instructions stored in a non-transitory computer-readable storage medium. The method can be implemented in a computer program using standard programming techniques, including a non-transitory computer-readable storage medium configured with a computer program, wherein the storage medium is configured such that the computer operates in a specific and predefined manner—according to the methods and drawings described in the specific embodiments. Each program can be implemented in a high-level procedural or object-oriented programming language to communicate with the computer system. However, if desired, the program can be implemented in assembly or machine language. In any case, the language can be a compiled or interpreted language. Furthermore, for this purpose, the program can run on a programmed application-specific integrated circuit (ASIC).

[0104] If the integrated unit is implemented as a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of this application, in essence, or the part that contributes to the prior art, or all or part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes multiple instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) to execute all or part of the steps of the methods of the various embodiments of this application. The aforementioned storage medium includes various media capable of storing programs, such as USB flash drives, portable hard drives, read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks.

[0105] The preferred embodiments of the present application have been described above with reference to the accompanying drawings, but this does not limit the scope of the claims of the present application. Any modifications, equivalent substitutions, and improvements made by those skilled in the art without departing from the scope and substance of the embodiments of the present application shall be within the scope of the claims of the present application.

Claims

1. A page layout optimization method based on responsive design, characterized in that, The method includes the following steps: Collect current user behavior data and current device characteristic data; Using a layout optimization model, based on the current user behavior data and the current device characteristic data, the corresponding current optimal layout configuration information is output; Based on the current optimal layout configuration information, the target page is adaptively adjusted in terms of layout.

2. The page layout optimization method according to claim 1, characterized in that, The collection of current user behavior data and current device characteristic data specifically includes: According to a preset time interval, the current user behavior data is collected, including multiple user interaction events and multiple user interaction behaviors. The user interaction behaviors are determined by several user interaction events that are related. Monitor device update operations and collect current device characteristic data, including device hardware characteristics, device software characteristics, device network characteristics, and user behavior-derived characteristics.

3. The page layout optimization method according to claim 1, characterized in that, The layout optimization model includes a layout analysis module and a layout selection module. The layout optimization model, based on the current user behavior data and the current device characteristic data, outputs the corresponding current optimal layout configuration information, specifically including: The current user behavior data and the current device characteristic data are input into the layout analysis module, and the layout analysis module is used to perform data analysis and generate layout configuration analysis information. The layout configuration analysis information is input into the layout selection module. Using the layout selection module, a probabilistic exploration strategy is employed to select a layout based on the layout configuration information and reward value calculation rules. The current optimal layout configuration information with the highest reward value is output. The layout configuration information includes multiple layout options, which include predefined page components and their corresponding component positions, style parameters, and interaction response rules. The current optimal layout configuration information includes the current optimal component position, current optimal component style, and current optimal component interaction response rules for each page component.

4. The page layout optimization method according to claim 1, characterized in that, The step of adaptively adjusting the layout of the target page based on the current optimal layout configuration information specifically includes: Based on the current optimal layout configuration information, generate the corresponding optimal layout model; The optimal layout model is obtained as the current page layout corresponding to the target page.

5. The page layout optimization method according to claim 3, characterized in that, The method further includes: Obtain current layout option information and user history feedback information, wherein the user history feedback information includes user satisfaction feedback results for each historical page layout; The layout optimization model is optimized based on the current layout options and the user's historical feedback information.

6. The page layout optimization method according to claim 5, characterized in that, The optimization of the layout optimization model based on the current layout option information and the user's historical feedback information specifically includes: The current layout option information is preprocessed, and the preprocessed current layout option information is used as the layout configuration information. Data analysis is performed on the historical user feedback information to determine the layout satisfaction analysis results; Based on the layout satisfaction analysis results, the reward value calculation rules are optimized.

7. The page layout optimization method according to claim 5, characterized in that, The method further includes: Receive a data update instruction for the current layout option information and determine the updated current layout option information; The updated current layout option information is obtained as the current layout option information.

8. A page layout optimization device based on responsive design, characterized in that, The device includes: The first module is used to collect current user behavior data and current device characteristic data; The second module is used to utilize the layout optimization model to output the corresponding current optimal layout configuration information based on the current user behavior data and the current device characteristic data. The third module is used to adaptively adjust the layout of the target page based on the current optimal layout configuration information.

9. An electronic device, characterized in that, The electronic device includes a memory and a processor, the memory storing a computer program, and the processor executing the computer program to implement the page layout optimization method according to any one of claims 1 to 7.

10. A computer-readable storage medium storing a computer program, characterized in that, When the computer program is executed by a processor, it implements the page layout optimization method according to any one of claims 1 to 7.

Images