Theme recommendation method and device for Web interface and medium
By obtaining the initial topic ID list and user input information to match, determining the target topic and recommending it, the problem of insufficient user adaptive adjustment in the existing web interface technology is solved, and the user experience is improved.
Patent Information
- Application Number
- CN202510342863.5
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-03-21
- Publication Date
- 2025-06-20
AI Technical Summary
The existing web interface technology has failed to implement an interface that is adaptively adjusted according to the user, resulting in poor user experience.
By obtaining the initial topic ID list and user input information, match to determine the target topic and recommend the topic to the user based on the matching results.
Improve users' experience of the web interface and meet users' personalized needs through adaptive recommendations.
Smart Images
Figure CN120179910A_ABST
Abstract
Description
Technical Field
[0001] The present invention relates to the field of computer science and technology, and particularly to a theme recommendation method, device, and medium for a Web interface. Background Art
[0002] A Web interface refers to a graphical interactive interface presented to users through a browser based on Web technology, which is widely used in websites, Web applications, etc. The constituent elements of a Web interface include a navigation bar, a content area, a form, buttons, a footer, etc.; the layout types of a Web interface usually include a fluid layout, a fixed layout, a flexible layout, etc. In a fluid layout, the width of page elements is automatically adjusted according to the size of the browser window, and the elements are arranged in sequence one by one, capable of adapting to different screen widths and having a good display effect on mobile devices; in a fixed layout, the width of the page is fixed, usually set in pixels, and the layout of the page does not change regardless of how the browser window size changes, which is suitable for websites with high requirements for page design and typesetting and relatively fixed content; the flexible layout combines the characteristics of the fluid layout and the fixed layout, and some elements in the page can change elastically according to the window size, while other elements remain fixed, capable of maintaining a good visual effect and user experience under different screen sizes. However, there is no Web interface that adapts according to users. Summary of the Invention
[0003] For the above technical problems, the technical solution adopted by the present invention is: a theme recommendation method for a Web interface, the method comprising the following steps:
[0004] S100, obtaining an initial theme ID list A = {A1, A2,..., A i ,..., A m}, where the value range of i is from 1 to m, and m is the number of initial themes; the initial theme information corresponding to the i-th initial theme ID A i includes: a first sub-theme list D i = {D i1 , D i2 ,..., D ig ,..., D iz(i)}, D ig is the first sub-theme information of the g-th first sub-theme corresponding to A i , and the value range of g is from 1 to z(i), where z(i) is the number of first sub-themes included in the i-th skin;
[0005] The first sub-theme information at least includes: the position of the first sub-theme and the number of pixels occupied by the first sub-theme; among them, the number of pixels occupied by the g-th first sub-theme is not less than the number of pixels occupied by the g + 1-th first sub-theme;
[0006] S200, obtain the input information of the user, where the input information at least includes: the second sub-topic list C = {C1, C2, …, C r , …, C s}, the value range of r is from 1 to s, s is the number of second sub-topics, and the r-th second sub-topic C r includes the number of pixels occupied by the second sub-topic. Among them, the number of pixels occupied by the r-th second sub-topic is not less than the number of pixels occupied by the (r + 1)-th second sub-topic;
[0007] S300, obtain the matching result of the input information and the initial topic information, and determine the target topic based on the matching result, where the target topic is used for recommendation to the user.
[0008] According to another aspect of the present invention, there is provided a non-transitory computer-readable storage medium, in which at least one instruction or at least one program segment is stored, and the at least one instruction or the at least one program segment is loaded and executed by a processor to implement the foregoing method.
[0009] According to still another aspect of the present invention, there is provided an electronic device, including a processor and the foregoing non-transitory computer-readable storage medium.
[0010] The present invention has at least the following beneficial effects: In summary, obtain the initial topic ID list, obtain the input information of the user, obtain the matching result of the input information and the initial topic information, and determine the target topic based on the matching result for recommendation to the user. The present invention matches the input information with the initial topic information and adaptively recommends to the user, thereby improving the user experience of using the Web interface. BRIEF DESCRIPTION OF THE DRAWINGS
[0011] In order to more clearly illustrate the technical solutions in the embodiments of the present invention, the following will briefly introduce the drawings required for the description of the embodiments. Obviously, the following drawings are only some embodiments of the present invention. For those of ordinary skill in the art, other drawings can be obtained based on these drawings without creative efforts.
[0012] Figure 1 It is a flowchart of a method for recommending topics for a Web interface provided by an embodiment of the present invention. DETAILED DESCRIPTION OF THE EMBODIMENTS
[0013] The following will clearly and completely describe the technical solutions in the embodiments of the present invention with reference to the accompanying drawings in the embodiments of the present invention. Obviously, the described embodiments are only a part of the embodiments of the present invention, rather than all the embodiments. All other embodiments obtained by those skilled in the art based on the embodiments of the present invention without creative efforts belong to the scope of protection of the present invention.
[0014] An embodiment of the present invention provides a theme recommendation method for a Web interface, as Figure 1 shown, the method includes the following steps:
[0015] S100. Obtain an initial theme ID list A = {A1, A2,..., A i ,..., A m}, where the value range of i is from 1 to m, and m is the number of initial themes; the initial theme information corresponding to the i-th initial theme ID A i includes: a first sub-theme list D i = {D i1 , D i2 ,..., D ig ,..., D iz(i)}, and D ig is the first sub-theme information of the g-th first sub-theme corresponding to A i , where the value range of g is from 1 to z(i), and z(i) is the number of first sub-themes included in the i-th theme.
[0016] The first sub-theme information at least includes: the position of the first sub-theme and the number of pixels occupied by the first sub-theme; among them, the number of pixels occupied by the g-th first sub-theme is not less than the number of pixels occupied by the g + 1-th first sub-theme. The first sub-theme information further includes: resolution.
[0017] Specifically, the initial theme ID is the unique identifier of the initial theme.
[0018] Specifically, the first sub-themes include a navigation bar, a first content area, a second content area, etc.
[0019] S200. Obtain the input information of the user, where the input information at least includes: a second sub-theme list C = {C1, C2,..., C r ,..., C s}, where the value range of r is from 1 to s, and s is the number of second sub-themes. The r-th second sub-theme C r includes the number of pixels occupied by the second sub-theme, and among them, the number of pixels occupied by the r-th second sub-theme is not less than the number of pixels occupied by the r + 1-th second sub-theme.
[0020] Specifically, the second sub-topic list is the number of sub-topics desired by the user and the size of each sub-topic.
[0021] S300. Obtain the matching result of the input information and the initial topic information, and determine the target topic based on the matching result, where the target topic is used for recommendation to the user.
[0022] In summary, obtain the initial topic ID list, obtain the input information of the user, obtain the matching result of the input information and the initial topic information, and determine the target topic based on the matching result for recommendation to the user. The present invention matches the input information with the initial topic information and adaptively recommends to the user, thereby improving the user experience of using the Web interface.
[0023] Specifically, the initial topic information further includes: a preset topic color; the input information further includes: an input topic color. Specifically, the input topic color can be obtained by allowing the user to select on a preset color palette.
[0024] Further, in S300, obtaining the matching result of the input information and the initial topic information, and determining the target topic based on the matching result further includes:
[0025] S310. Traverse A, match the input information with A i to obtain the matching result H i = α1 × H i1 + α2 × H i2 , where α1 is a first weight factor greater than 0, and α2 is a second weight factor greater than 0.
[0026] Specifically, if s is greater than z(i), assign 0 to both H i1 and H i2 ; if s is not greater than z(i), the first matching value H i1 = ∑ s r＝1 H ir1 , H ir1 is the matching degree of the r-th first sub-topic in C r and D i , and the second matching value H i2 is the similarity between the input topic color and the preset topic color. It can be understood that if s is greater than z(i), the number of sub-topics required by the user, the initial topic corresponding to the i-th initial topic ID cannot meet the requirements. Therefore, assign 0 to both H i1 and H i2 to give up the selection of this initial topic.
[0027] Those skilled in the art know that any method of obtaining the similarity of two colors in the prior art falls within the scope of protection of the present invention and will not be described in detail here. The more similar the user's input theme color is to the preset theme color, the more suitable the theme is for the user's use. Therefore, the higher the similarity, the greater the second matching value, and the easier it is for the theme to be recommended.
[0028] Specifically, if the number of pixels occupied by the rth second sub-subject is not greater than the sum D i The number of pixels occupied by the first sub-topic in H ir1 Assign a first fixed value, if the number of pixels occupied by the rth second sub-subject is greater than D i The number of pixels occupied by the first sub-topic in H ir1 The first fixed value is greater than the second fixed value. It can be understood that if the number of pixels occupied by the rth second sub-subject is not greater than D i If the number of pixels occupied by the rth first sub-subject in D is greater than the number of pixels occupied by the rth first sub-subject, then the rth first sub-subject can accommodate the rth second sub-subject, and the match is considered successful, and the first fixed value is assigned; if the number of pixels occupied by the rth second sub-subject is greater than D i If the number of pixels occupied by the rth first sub-subject in , then the rth first sub-subject cannot accommodate the rth second sub-subject, it can be considered that the matching fails and is assigned the second fixed value.
[0029] In one embodiment of the present invention, the first fixed value is 1, and the second fixed value is -1. In another embodiment of the present invention, the first fixed value is 1, and the second fixed value is 0.
[0030] S320, matching result H i Sort them in descending order, obtain the initial topic IDs corresponding to the first q matching results and record them as intermediate topic IDs, thereby obtaining the intermediate topic ID list E = {E1, E2, ..., E x ,…,E q}, E x is the xth intermediate topic ID, where x ranges from 1 to q.
[0031] S330, traverse E, based on the input information and E x Generate preview theme F x Screenshot image corresponding to the preview theme PF x , thereby obtaining a preview topic list F, and determining the target topic based on the preview topic list F.
[0032] Specifically, based on the input information and E x Generating a preview theme can be understood as converting E xThe corresponding intermediate theme is adaptively modified based on the input information. For example, redundant first sub-themes are deleted. For example, if the number of pixels occupied by the first sub-theme is insufficient, the number of pixels occupied by the first sub-theme is increased.
[0033] In summary, traverse A, match the input information with A i to obtain the matching result, and sort the matching result H i in descending order, and obtain the initial theme IDs corresponding to the top q matching results, which are recorded as intermediate theme IDs, so as to obtain the intermediate theme ID list E. Traverse E, and generate a preview theme F based on the input information and E x and the screenshot image PF corresponding to the preview theme x to obtain the preview theme list F, and determine the target theme based on the preview theme list F. The present invention sorts the initial themes based on the occupied pixel quantity and color matching, so as to more accurately obtain the target theme. x
[0034]
[0035] Furthermore, S330 further includes:
[0036] S331, input the screenshot image PF x into the target anomaly detection model to obtain the initial anomaly result list corresponding to F x The initial anomaly result list includes several initial anomaly results.
[0037] S332, obtain the priority level of each initial anomaly result, and process the initial anomaly result corresponding to the highest priority level to generate a new theme and the screenshot image corresponding to the new theme. Specifically, obtain the preset anomaly type of the initial anomaly result, obtain the corresponding relationship between the preset anomaly type and the priority level, so as to obtain the priority level corresponding to the initial anomaly result. It can be understood that the preset anomaly type and the priority level correspond to each other.
[0038] Specifically, based on the preset anomaly type corresponding to the initial anomaly result, use the corresponding preset processing method for processing. It can be understood that the preset anomaly type and the preset processing method correspond to each other. For example, if the preset anomaly type is: occluded picture; the preset processing method corresponding to the preset anomaly type is: adjust the position of the occluded picture, and adjust the positions of other pictures having a relevant positional relationship with the occluded picture; the pictures having a relevant positional relationship with the occluded picture can be set in advance, such as pictures having the same height as the occluded picture, pictures having the same width as the occluded picture. S333, input the screenshot image corresponding to the new theme into the target anomaly detection model to obtain the intermediate anomaly result. If the intermediate anomaly result meets the preset recommendation condition, use the new theme as the recommended theme, and determine the target theme based on the recommended theme.
[0039] Specifically, determining the target theme based on the recommended theme includes: sending the recommended theme to the user and determining the target theme based on the user's selection.
[0040] Wherein, the preset recommendation condition is that the intermediate abnormal result is a null value, or the adjustment time period is not less than the preset user waiting time period; wherein, the adjustment time period is the time from the acquisition time of the user's input information to the time of determining whether the intermediate abnormal result meets the preset recommendation condition. It can be understood that; the intermediate abnormal result is a null value, that is, there is no intermediate abnormal result; the adjustment time period is not less than the preset user waiting time period, that is, the preset user waiting time period is specified. If there is always an intermediate abnormal result, it cannot loop continuously. Therefore, the preset user waiting time period is set. If the user waiting time period is exceeded, the loop is no longer performed and it ends directly.
[0041] The preset user waiting time period can be determined according to the actual situation, for example, it is 1 second. In an embodiment of the present invention, the preset user waiting time is the time period during which the user can perceive the change of the Web page. Those skilled in the art know that any method for obtaining the time period during which the user can perceive the change of the Web page in the prior art belongs to the protection scope of the present invention and will not be elaborated here.
[0042] S334, if the intermediate abnormal result does not meet the preset recommendation condition, use the intermediate abnormal result as the initial abnormal result and execute S332.
[0043] In summary, the screenshot picture PF x is input into the target abnormal detection model to obtain F x corresponding initial abnormal result list, obtain the priority level of each initial abnormal result, process the initial abnormal result corresponding to the highest priority level to generate a new theme and a screenshot picture corresponding to the new theme, input the screenshot picture corresponding to the new theme into the target abnormal detection model to obtain the intermediate abnormal result. If the intermediate abnormal result meets the preset recommendation condition, use the new theme as the recommended theme and determine the target theme based on the recommended theme. If the intermediate abnormal result does not meet the preset recommendation condition, use the intermediate abnormal result as the initial abnormal result and loop to execute. By processing the intermediate abnormal result, the recommended theme can be obtained more accurately for recommendation.
[0044] Furthermore, the present invention further includes obtaining the target abnormal detection model through the following steps:
[0045] S001, obtain the training screenshot information list K = {K1, K2,..., K a ,..., K c}, the a-th training screenshot information Ka includes the a-th training screenshot and the training abnormal result corresponding to the a-th training screenshot, and the value range of a is from 1 to c, where c is the number of training screenshot information.
[0046] The abnormal results for training include: normal, and preset abnormal types. The preset abnormal types include occluded pictures, incomplete display, etc.
[0047] S002. Build an anomaly detection model, use the list K of training screenshot information to train the built anomaly detection model, obtain the training result. If the training result meets the preset training conditions, use the trained anomaly detection model as the target anomaly detection model.
[0048] An embodiment of the present invention also provides a non-transitory computer-readable storage medium, which can be set in an electronic device to store at least one instruction or at least one segment of a program related to a method in the method embodiment. The at least one instruction or the at least one segment of the program is loaded and executed by the processor to implement the method provided in the above embodiment.
[0049] An embodiment of the present invention also provides an electronic device, including a processor and the aforementioned non-transitory computer-readable storage medium.
[0050] Although some specific embodiments of the present invention have been described in detail by way of examples, those skilled in the art should understand that the above examples are only for illustration and not for limiting the scope of the present invention. Those skilled in the art should also understand that various modifications can be made to the embodiments without departing from the scope and spirit of the present invention.
Claims
1. A topic recommendation method for a Web interface, characterized in that: The method comprises the following steps: S100, obtain an initial topic ID list A = {A1, A2, ..., A i , …, A m }, i ranges from 1 to m, and m is the number of initial topics; The i-th initial topic ID A i The corresponding initial topic information includes: the first sub-topic list D i ={D i1 , D i2 , …, D ig , …, D iz(i) }, D ig Yes A i The first sub-topic information of the corresponding g-th first sub-topic, where the value of g ranges from 1 to z(i), and z(i) is the number of first sub-topics contained in the i-th skin; The first sub-theme information at least includes: the position of the first sub-theme, the number of pixels occupied by the first sub-theme; wherein the number of pixels occupied by the g-th first sub-theme is not less than the number of pixels occupied by the g+1-th first sub-theme; S200, obtaining user input information, the input information at least including: a second sub-topic list C = {C1, C2, ..., C r , …, C s }, r ranges from 1 to s, s is the number of second subtopics, the rth second subtopic C r Including the number of pixels occupied by the second sub-subject, wherein the number of pixels occupied by the r-th second sub-subject is not less than the number of pixels occupied by the r+1-th second sub-subject; S300, obtaining a matching result of input information and initial topic information, and determining a target topic based on the matching result, wherein the target topic is used for recommendation to the user.
2. The method for recommending a topic for a Web interface according to claim 1, characterized in that: The initial theme information also includes: a preset theme color.
3. The method for recommending a topic for a Web interface according to claim 2, characterized in that: The input information also includes: inputting a theme color.
4. The method for recommending a topic for a Web interface according to claim 3, characterized in that: In S300, the matching result of the input information and the initial topic information is obtained, and the target topic is determined based on the matching result, which also includes: S310, traverse A, and combine the input information and A i Perform matching and obtain matching result H i =α1×H i1 +α2×H i2 , α1 is a first weight factor greater than 0, and α2 is a second weight factor greater than 0; Specifically, if s is greater than z(i), H i1 and H i2 are assigned a value of 0; if s is not greater than z(i), the first matching value H i1 =∑ s r＝ 1H ir1 , H ir1 It is C r and D i The matching degree of the first sub-topic in the rth sub-topic, the second matching value H i2 The similarity between the input theme color and the preset theme color; S320, matching result H i Sort them in descending order, obtain the initial topic IDs corresponding to the first q matching results and record them as intermediate topic IDs, thereby obtaining the intermediate topic ID list E = {E1, E2, ..., E x ,…,E q }, E x is the xth intermediate topic ID, where x ranges from 1 to q; S330, traverse E, based on the input information and E x Generate preview theme F x Screenshot image corresponding to the preview theme PF x , thereby obtaining a preview topic list F, and determining the target topic based on the preview topic list F.
5. The method for recommending a topic for a Web interface according to claim 4, characterized in that: The S330 also includes: S331, take the screenshot PF x Input the target anomaly detection model and obtain F x a corresponding initial abnormal result list, wherein the initial abnormal result list includes a plurality of initial abnormal results; S332, obtaining the priority level of each initial abnormal result, processing the initial abnormal result corresponding to the highest priority level, and generating a new topic and a screenshot image corresponding to the new topic; S333, inputting the screenshot corresponding to the new topic into the target anomaly detection model to obtain an intermediate anomaly result. If the intermediate anomaly result meets the preset recommendation condition, the new topic is used as the recommended topic, and the target topic is determined based on the recommended topic; S334: If the intermediate abnormal result does not meet the preset recommendation condition, the intermediate abnormal result is used as the initial abnormal result and S332 is executed.
6. The method for recommending a topic for a Web interface according to claim 5, characterized in that: Determining the target topic based on the recommended topic includes: sending the recommended topic to the user, and determining the target topic based on the user's selection.
7. The method for recommending a theme for a Web interface according to claim 5, characterized in that: The preset recommendation condition is: the intermediate abnormal result is null, or the adjustment time period is not less than the preset user waiting time period; wherein, the adjustment time period is the target abnormal detection model for the screenshot image PF x The time from the start of the test to the time when the intermediate abnormal results are judged to meet the preset recommended conditions.
8. The method for recommending a theme for a Web interface according to claim 1, characterized in that: The initial topic ID is a unique identifier of the initial topic.
9. A non-transitory computer-readable storage medium, wherein at least one instruction or at least one program is stored in the storage medium, characterized in that: The at least one instruction or the at least one program is loaded and executed by the processor to implement the theme recommendation method for a Web interface as described in any one of claims 1-8.
10. An electronic device, characterized in that: The invention comprises a processor and the non-transitory computer-readable storage medium as claimed in claim 9.