Program, storage medium, information processing device, and display control method

The mechanism adjusts display content based on screen size, ensuring visibility and accessibility of categorized information by using tabs and expanding/collapsing sections, addressing visibility issues in varying display areas.

JP2025008414APending Publication Date: 2025-01-20CANON KK
View PDF 1 Cites 0 Cited by

Patent Information

Application Number
JP2023110580
Authority / Receiving Office
JP · JP
Patent Type
Applications
Current Assignee / Owner
Filing Date
2023-07-05
Publication Date
2025-01-20

AI Technical Summary

Technical Problem

Existing display methods struggle with visibility issues when displaying content classified into categories on web pages with varying display areas, as reducing images to fit smaller areas reduces visibility, while enlarging them compromises visibility in larger areas.

Method used

A mechanism that adjusts the display of content based on the size of the display area, showing a limited number of items at a suitable size, using tabs or pull-down menus, and expanding or collapsing sections to maintain visibility and usability across different screen sizes.

Benefits of technology

Ensures good visibility and ease of access to categorized content regardless of display area size, enhancing user experience by maintaining clarity and accessibility of information.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure 2025008414000001_ABST
    Figure 2025008414000001_ABST
Patent Text Reader

Abstract

To provide a pull for displaying more suitably with better visibility a content classified into a plurality of categories depending on a size of a display region.SOLUTION: Provided is screen display processing for: acquiring information indicating a size of a display region whose size is changeable; displaying, in the display region, display items corresponding to a first number of contents classified into categories corresponding to a plurality of areas corresponding respectively to the plurality of categories on the basis of the acquired information, when the size of the display region is a first size; displaying, in the display region, a plurality of operation items corresponding to the plurality of categories when the size of the display region is a second size smaller than the first size; and displaying a display item corresponding to the content classified into categories corresponding to a selected operation item, while not displaying a display item corresponding to the content classified into categories corresponding to an unselected operation item, out of the plurality of operation items.SELECTED DRAWING: Figure 9
Need to check novelty before this filing date? Find Prior Art

Description

[Technical field]

[0001] The present disclosure relates to a technique for displaying content for users with various purposes in accordance with the size of a display area. [Background technology]

[0002] Conventionally, general web browsers have a function for displaying web pages in a layout suitable for various screen sizes, and there are many web pages that use this function. Furthermore, many web pages have descriptions of contents classified by category in order to provide users with information tailored to their various needs. Then, the web page displays a list of contents (e.g., topics) that belong to a category selected by the user.

[0003] Patent Document 1 proposes a technique for displaying a representative image from among a plurality of images belonging to each of a plurality of categories by category, making it easier for a user to grasp the information contained in each category. [Prior art documents] [Patent documents]

[0004] [Patent Document 1] JP 2009-123020 A Summary of the Invention [Problem to be solved by the invention]

[0005] However, the display method as disclosed in Patent Document 1 has a problem that it is difficult for the user to grasp the displayed contents when the display area is small. In other words, when the image, which is the content, is not reduced to fit the display area, the visibility of the image itself is reduced when the image is reduced to fit the display area.

[0006] In view of the above-mentioned problems, the present disclosure has an object to provide a mechanism that can display content classified into multiple categories more suitably and with good visibility according to the size of the display area. [Means for solving the problem]

[0007] At least one program according to one embodiment of the present disclosure is characterized in that it causes at least one computer to function as: an acquisition means for acquiring information indicating the size of a resizable display area; and a display control means for controlling, based on the information acquired by the acquisition means, when the size of the display area is a first size, to display display items corresponding to a first number of contents classified into corresponding categories in each of a plurality of areas corresponding to each of a plurality of categories in the display area, and when the size of the display area is a second size smaller than the first size, to display a plurality of operation items corresponding to each of a plurality of categories in the display area, and to display display items corresponding to content classified into the category corresponding to a selected operation item without displaying display items corresponding to content classified into a category corresponding to an unselected operation item among the plurality of operation items. Effect of the Invention

[0008] According to the present disclosure, content classified into a plurality of categories can be displayed more suitably and with good visibility according to the size of the display area. [Brief description of the drawings]

[0009] [Figure 1] FIG. 1 illustrates an example of a system configuration. [Diagram 2] FIG. 11 is a sequence diagram illustrating an example of information acquisition processing of a web browser. [Diagram 3] FIG. 13 is a diagram showing an example of a display screen (large layout) of a WEB page. [Figure 4]FIG. 13 is a diagram showing an example of a display screen of a WEB page (large layout, accordion open). [Diagram 5] FIG. 13 is a diagram showing an example of a display screen (during layout) of a WEB page. [Figure 6] FIG. 13 is a diagram showing an example of a display screen (small layout) of a WEB page. [Figure 7] FIG. 13 is a diagram showing an example of a display screen of a WEB page (small layout, different tab selection). [Figure 8] FIG. 13 is a diagram showing an example of a display screen (topic details) of a WEB page. [Figure 9] 13 is a flowchart showing an example of a screen display process of the WEB browser 201 according to the embodiment. DETAILED DESCRIPTION OF THE PREFERRED EMBODIMENTS

[0010] Preferred embodiments of the present disclosure will be described in detail below with reference to the accompanying drawings. Note that the following embodiments do not limit the subject matter of the present disclosure, and not all of the combinations of features described in the present embodiments are necessarily essential to the solution of the present disclosure. Note that the same components will be described with the same reference numerals.

[0011] Fig. 1 is a diagram showing an example of the configuration of a system including an information processing device 100 and a server 110. The configuration of the system according to this embodiment will be described with reference to Fig. 1.

[0012] The information processing device 100 includes a CPU (Central Processing Unit) 101, a ROM (Read only memory) 102, and a RAM (Random access memory) 103. The information processing device 100 includes a display device 104, an input interface (hereinafter referred to as an I / F (Interface)) 105, and a network I / F 106. The CPU 101 is a central processing unit that reads and executes a program 107 stored in the ROM 102. The ROM 102 is a non-volatile storage medium, and stores a program 107 such as a WEB browser 201 described later. The RAM 103 is a system memory of the CPU 101, and is used as a storage area such as a work area. The display device 104 is a device that displays image information output from the information processing device 100. The input I / F 105 is an interface for inputting data and / or control information to the information processing device 100. The network I / F 106 is an interface for connecting the information processing device 100 to a network via a network connection 121. The information processing device 100 can be connected to the Internet 122 via a network connection 121 by an Ethernet (registered trademark) cable and / or Wi-Fi (registered trademark). The server 110 has a CPU 111, a ROM 112, a RAM 113, an input I / F 114, and a network I / F 115. The CPU 111, the RAM 113, the input I / F 114, and the network I / F 115 have the same functions as the CPU 101, the RAM 103, the input I / F 105, and the network I / F 106, respectively, and therefore their description will be omitted. The ROM 112 stores a WEB page 116 and a program 117 such as JavaScript and CSS. The program 117 has a description regarding the operation of the WEB browser 201 when the WEB browser 201 receives an operation by a user, and a description regarding the layout of the WEB page according to the size of the display area described later. In other words, the program 117 is a program for realizing the desired appearance of the WEB page 116. The web page 116 has a URL corresponding to the program 117 .The server 110 can be connected to the Internet 122 via a network connection 123. The information processing device 100 and the server 110 can communicate with each other over the Internet 122.

[0013] Here, the WEB browser 201 will be described. The WEB browser 201 is software for connecting to the server 110. The WEB browser 201 is a general browser for displaying WEB pages. In order to realize a desired appearance by a general browser, the server 110 stores a program 117 for that appearance. A user can browse a WEB page by using the WEB browser 201. The WEB browser 201 can be executed by the CPU 101 when its program code is read from the ROM 102 by the CPU 101 and expanded in the RAM 103. The WEB browser 201 that has been made executable by the CPU 101 secures a storage area in the RAM 103 for holding the WEB page 116 and the program 117 such as JavaScript and CSS. The WEB browser 201 that has been made executable by the CPU 101 can execute a screen display process shown in FIG. 9, which will be described later, using the program stored in the RAM 103. The WEB browser 201 that has been made executable by the CPU 101 can be operated by a user via the input I / F 105. The RAM 103 stores the size of the display area of ​​the Web browser 201 on the display device 104 (hereinafter, referred to as the window size) in addition to the storage area of ​​the Web browser 201 that has been enabled to be executed by the CPU 101.

[0014] Fig. 2 is a sequence diagram showing an example of information acquisition processing executed by the WEB browser 201. The flow of the information acquisition processing executed by the WEB browser 201 will be described with reference to Fig. 2. Note that the symbol "S" in the following description of each process refers to each process (each step) in Fig. 2.

[0015] In S211, the user inputs a URL corresponding to the WEB page 116 of the server 110 via the input I / F 105. In S212, the WEB browser 201 requests the server 110 for the WEB page 116 corresponding to the URL received in S211 via the network I / F 106. In S213, when the server 110 receives the request in S212, it responds with the WEB page 116 to the WEB browser 201 via the network I / F 115. Specifically, the WEB browser 201 receives from the server 110 the URL of the program 117 for executing the process of S217 described later, and content data (image data, etc.) for displaying the WEB page 116. In S214, when the WEB browser 201 receives the response from the server 110 in S213, it acquires the URL of the program 117 from the WEB page 116.

[0016] In S215, the WEB browser 201 requests the server 110 through the network I / F 106 for the program 117 corresponding to the URL acquired in S214. In S216, when the server 110 receives the request in S215, it responds to the WEB browser 201 with the program 117 through the network I / F 115. In this way, in S213, the server 110 embeds the program in advance (specifically, including the URL of the program 117) in the URL entered by the user in S211, and responds to the WEB browser 201. Then, the WEB browser 201 acquires the program 117 through S215 and S216 according to its own specifications. In S217, when the WEB browser 201 receives a response from the server 110 in S216, it executes a screen display process. That is, the WEB browser 201 executes a screen display process according to the acquired program 117. In this way, the WEB browser 201 acquires the URL of the program 117 from the WEB page 116 to which the server 110 responded in S213, and then acquires the program 117 through S215 and S216, but is not limited to this. For example, the WEB browser 201 may acquire the program 117 in S213 and skip the subsequent S215 and S216. The display screen displayed by the WEB browser 201 based on the program 117 will be described with reference to Figures 3 to 8.

[0017] 3 to 8 are diagrams showing an example of a display screen of a WEB page displayed by the WEB browser 201. The transition of the display screen of the WEB page will be described with reference to FIGS.

[0018] FIG. 3 is a diagram showing an example of a display screen of a WEB page displayed by a WEB browser when the window size is large (first size). With reference to FIG. 3, a WEB page displayed by a WEB browser will be described. Hereinafter, in this embodiment, the display content of the WEB page will be described as an example explaining how to use a printer (printing device), but is not limited to this. For example, the display content of the WEB page may be an explanation of how to use a camera, a camera lens, a photo book, or other products or devices. Here, the window size being large indicates that the value of the window size is equal to or larger than a first threshold value. The determination of the window size will be described with reference to FIG. 9. The window size can be changed by a user's operation. For example, the user can freely change the window size by dragging the four corners or four sides of the display area with the mouse.

[0019] FIG. 3 shows a display screen of a WEB page according to an embodiment of the present disclosure, in which display items corresponding to four (first number) contents classified into a corresponding category are displayed in each of a plurality of category areas corresponding to each of a plurality of categories. Hereinafter, in this embodiment, an example in which the first number is four will be described, but the present invention is not limited to this. For example, the first number may be a number equal to or greater than two. That is, the first number may be a number that allows a user to grasp the contents of a plurality of categories and the display items classified into the corresponding categories. The display screen 300 of FIG. 3 has a header section 310 and a content display section 320. The header section 310 has an address bar 311 for displaying a URL corresponding to the WEB page 116. That is, the address bar 311 displays the URL input by the user in S211 of FIG. 2. The content display section 320 has a category display section 330, a category display section 340, and a category display section 350.

[0020] The category display section 330 is composed of a group of a category name section 331 and a topic display section 332. The category name section 331 is an area that displays the name of a category. The category name section 331 displays a name indicating a category into which content is classified. In FIG. 3, the category name section 331 displays the category "life". When a user wants to access content related to "life", the user can search for a topic related to "life" by looking at the display in the category name section 331. The topic display section 332 has topic items 333a to 333d that belong to the category "life" and a "see more" button 334 that is an operator. The topic items 333a to 333d are display items that represent each topic (content) that belongs to the category "life". In each topic item, an image (illustration) that represents the topic is displayed at the top, and the topic name is displayed at the bottom. The user can search for a desired topic from the illustration and name displayed in the topic item. In addition, the topic display unit 332 displays 333a to 333d as representative topic items belonging to the category "life". As a display method of 333a to 333d, the representative topic items may be displayed in order of the number of times the topic items have been selected by users in the past. For example, the WEB browser may display as 333a the topic item with the largest number of clicks by users. Next, the WEB browser may display as 333b the topic item with the second largest number of clicks by users. Topic items may be displayed in the same manner in the category display unit 340 and the category display unit 350 described later. This allows the user to easily access content of high interest. The "See More" button 334 is a so-called accordion display opening button. In other words, the "See More" button 334 is a button for expanding the area displaying topic items. When the user presses the "See More" button 334, the topic display unit 332 is expanded as shown in FIG. 4 described later, and all topic items belonging to the category "life" are displayed.

[0021] Category display section 340 is a display area related to the category "Work". Hereinafter, the configuration of category display section 340 that differs from category display section 330 will be described. A description of the same configuration as category display section 330 will be omitted. The same applies to category display section 350, which will be described later. Category display section 340 is made up of a set of category name section 341 and topic display section 342. The category "Work" is displayed in category name section 341. Topic display section 342 has topic items 343a to 343d and a "See more" button 344. Topic items 343a to 343d are display items that represent each topic belonging to the category "Work".

[0022] Category display section 350 is a display area related to the category "learning". Category display section 350 is made up of a pair of category name section 351 and topic display section 352. The category "learning" is displayed in category name section 351. Topic display section 352 has topic items 353a to 353d and a "see more" button 354. Topic items 353a to 353d are display items representing each topic belonging to the category "learning".

[0023] In this way, the WEB browser according to the present embodiment displays topic items corresponding to each category display section in each category display section. As a result, since multiple category display sections are displayed at once, the user can intuitively and easily understand that there are multiple categories. At the same time, the user can intuitively and easily recognize the contents of each category by looking at multiple topic items. That is, the visibility of the WEB page can be ensured. In addition, by limiting the number of topic items displayed corresponding to each category to four, the decrease in visibility of the topic items can be suppressed. The WEB browser according to the present embodiment divides the usage of the printer into many topics, and categorizes (groups) the multiple topics and displays them. By displaying the topics in this way, the user can easily find a topic that shows a usage that suits him / her or is useful to him / her. This can stimulate the user's desire to purchase a printer or consumables, leading to an increase in sales of the printer or consumables.

[0024] Fig. 4 is a diagram showing an example of a display screen 300 of a WEB page displayed by the WEB browser when the window size is large. Specifically, Fig. 4 shows the display screen 300 displayed by the WEB browser 201 when the user presses the "View more" button 334 in Fig. 3. Configurations different from Fig. 3 will be described with reference to Fig. 4. Descriptions of configurations similar to those in Fig. 3 will be omitted. Similarly, descriptions of configurations similar to those already described will be omitted from Figs. 5 to 8 below.

[0025] The topic display section 332 in FIG. 4 has topic items 333a to 333j and a "close" button 335. That is, in FIG. 4, the topic display section 332 is expanded, and all topic items belonging to the category "life" are displayed. That is, when the user presses the "see more" button 334 on the display screen 330 in FIG. 3, the WEB browser 201 displays topic items 333e to 333j that were not displayed in FIG. 3. This allows the user to visually confirm all topics belonging to the category "life". Moreover, instead of the "see more" button 334, the WEB browser 201 displays a "close" button 335 for returning the expanded topic display section 332 to its original state. The "close" button 335 is a so-called accordion-display close button. When the user presses the "close" button 335, the WEB browser 201 returns the screen display in FIG. 4 to the screen display in FIG. 3. As the topic display section 332 expands, the category display sections 340 and 350 are displayed shifted downward by the amount of expansion of the topic display section 332. In Fig. 4, even when the topic display section 332 expands, the category display sections 340 and 350 remain visible to the user, but this is not limited to the above. For example, as the topic display section 332 expands, the category display sections 340 or 350 may be displayed such that a part or all of them cannot be viewed by the user.

[0026] Fig. 5 is a diagram showing an example of a display screen 300 of a WEB page displayed by a WEB browser when the window size is medium (third size). Specifically, Fig. 5 shows a display screen 300 displayed by a WEB browser when the window size is reduced from the display state of Fig. 3 to become "medium". A configuration different from Fig. 3 will be described with reference to Fig. 5. Here, a window size being medium means that the value of the window size is less than a first threshold value and is equal to or greater than a second threshold value.

[0027] In FIG. 5, topic display section 332 has topic items 333a to 333c and a "View more" button 334. Topic display section 342 has topic items 343a to 343c and a "View more" button 344. Topic display section 352 has topic items 353a to 353c and a "View more" button 354. That is, in FIG. 5, the number of topic items displayed in each topic display section is three (second number). On the other hand, the number of topic items displayed in each topic display section in FIG. 3 is four (first number). That is, the topic items displayed in each topic display section in FIG. 5 are displayed in fewer numbers than those in FIG. 3. In this way, the second number is smaller than the first number. If the window size is reduced, and topic items are displayed without reducing the number of topic items displayed in each topic display section, there is a risk that the visibility of the topic items themselves will decrease. That is, since the topic items are reduced and displayed small, the visibility of the topics for the user may decrease. In response to this, by displaying fewer topic items than the first number, each topic item can be displayed at a certain size or more (above a certain size), so that the visibility of the topic items can be ensured. At the same time, the WEB browser maintains each topic display section to display the topic items corresponding to each topic display section. This ensures that the WEB page can be viewed at a glance even if the window size is reduced. If the window size is further reduced from this state to become "small", a transition is made to the display state of FIG. 6, which will be described later. If the window size is increased from the state of FIG. 5 to become "large", a transition is made to the display state of FIG. 3.

[0028] Fig. 6 is a diagram showing an example of a display screen 300 of a WEB page displayed by the WEB browser when the window size is small (second size). Specifically, Fig. 6 shows the display screen 300 displayed by the WEB browser 201 when the window size is reduced from any of the display states of Figs. 3 to 5 to become "small". A configuration different from Figs. 3 to 5 will be described with reference to Fig. 6. Here, a small window size means that the value of the window size is less than a second threshold value.

[0029] The display screen 300 in FIG. 6 has a layout that is significantly different from those in FIG. 3 to FIG. 5. The content display unit 320 in FIG. 6 has a tab display unit 600 and a topic display unit 610. The tab display unit 600 has a tab 631, a tab 641, and a tab 651. The tab 631 is an operation item corresponding to the category "life". The tab 641 is an operation item corresponding to the category "work". The tab 651 is an operation item corresponding to the category "learning". In this way, the tab display unit 600 displays a plurality of tabs corresponding to each category, but is not limited to this. For example, the WEB browser 201 may display an operator for displaying a pull-down menu (drop-down list) instead of the tab display in the tab display unit 600. Then, the WEB browser 201 may display a pull-down menu in which each menu item has the same function as each tab described above in response to an operation on the operator. The topic display unit 610 is a display area for displaying topics belonging to the category of the tab selected in the tab display unit 600. FIG. 6 shows the display screen 300 in the case where the tab 631 corresponding to the category "Life" is selected. In this way, the WEB browser 201 displays the display screen 300 of FIG. 6 in a state where the tab corresponding to the category displayed at the top in the display state before the transition is selected. In other words, the tab selected first in FIG. 6 corresponds to the category displayed at the top of the display area before the change (any of the display states of FIGS. 3 to 5), but is not limited to this. For example, the WEB browser 201 may display the display screen 300 of FIG. 6 in a state where the tab corresponding to the category for which the "See More" button was last pressed in the display state before the transition is selected. In other words, the tab selected first in FIG. 6 corresponds to the category for which the "See More" button was last pressed before the change. Specifically, when the window size is reduced from the display state in which the "See More" button of the category "Life" is pressed by the user as shown in FIG. 4, the display state of FIG. 6 is displayed.As a result, in a situation where the display mode is switched according to the window size, by displaying the topic according to the display state before the transition, the user can easily access the topic of high interest, and the comfort of browsing the WEB page can be improved. The topic display unit 610 has topic items 333a to 333j. That is, all topic items belonging to the category "life" are displayed on the display screen 300 of FIG. 6. In FIG. 6, all topic items belonging to the category corresponding to the tab are displayed, but this is not limited to this. For example, when the vertical width of the window size is small, the WEB browser 201 may display a part of the topic items without displaying all the topic items at once. In this case, the WEB browser 201 may display topic items that are not displayed in response to a scroll operation by the user. In addition, the topic items in FIG. 6 are displayed in the same size as the topic items in FIGS. 3 to 5 that are assigned the same reference numerals as the topic items. This makes it possible to suppress a decrease in the visibility of each topic item. Note that the topic items in FIG. 6 may be reduced to a certain extent in response to the reduction of the display screen 300. In this case, a lower limit size of the topic items may be set so that each topic item is not displayed smaller than the lower limit size (predetermined size) even if the display screen 300 is reduced. That is, each topic item is displayed at a certain size or more. In the display screen 300 of FIG. 6, topic items other than those of the category corresponding to the selected tab 631 are not displayed. That is, when the tab 631 corresponding to the category "life" is selected, all topic items belonging to the category "life" are displayed. On the other hand, topic items belonging to the categories "work" and "learning" are not displayed. For example, when a user wants to access a topic belonging to the category "work" from the display screen 300 of FIG. 6, the user selects the tab 641. When the tab 641 is selected, all topic items belonging to the category "work" are displayed as shown in FIG. 7 described later. Also, when the window size is increased by the user's operation, the display state of FIG. 6 is changed to any one of the display states of FIG. 3 to FIG. 5.In this case, the WEB browser 201 may display the display screen 300 in a state in which the "See more" button corresponding to the category of the tab last selected in the display state of FIG. 6 is pressed. Specifically, when the window size is increased from the display state of FIG. 6, the display screen 300 transitions to a display state in which the "See more" button of the category "Life" is pressed, as shown in FIG. 4. This allows the display state before the transition in which all topics are displayed to be maintained in a situation in which the display mode is switched according to the window size, and therefore the deterioration of the visibility of topics due to the change in the window size can be suppressed. In addition, the WEB browser 201 may display the category corresponding to the tab last selected in the display state of FIG. 6 at a display position that fits within a predetermined range within any of the display areas of FIG. 3 to 6. For example, when the window size is increased from the display state of FIG. 6, the category display section 330 of the category "Life" is displayed so as to fit within the upper half of the area of ​​the display screen 300, as shown in FIG. 3. This allows the category corresponding to the tab last selected before the transition to be displayed in a position that is easy for the user to see in a situation in which the display mode is switched according to the window size, and therefore the comfort of browsing the WEB page can be improved.

[0030] FIG. 7 is a diagram showing an example of a display screen 300 of a WEB page. Specifically, when a tab 641 is selected by a user from the display state of FIG. 6, the display screen 300 is displayed by the WEB browser. With reference to FIG. 7, a configuration different from FIG. 6 will be described. The topic display unit 710 in FIG. 7 has topic items 343a to 343g belonging to the category "work" corresponding to the tab 641. That is, when the tab 641 is selected on the display screen 300 in FIG. 6, the WEB browser 201 displays the topic items 343a to 343g without displaying the topic items 333a to 333j. In this case, the user can visually recognize the topic items 343a to 343g belonging to the category "work" and can access topics related to "work". The same applies to topics belonging to the category "learning".

[0031] In this way, the web browser displays in the topic display section only topic items that belong to the category corresponding to the selected tab, without displaying topic items that belong to all categories. This makes it possible to efficiently display multiple topic items that belong to multiple categories in a limited display area without reducing the visibility of each topic item.

[0032] FIG. 8 is a diagram showing an example of a display screen of a WEB page. Specifically, FIG. 8 shows a display screen 300 displayed by the WEB browser when the topic item 333a is selected in any one of FIGS. 3 to 6. The display screen 300 will be described with reference to FIG. 8. When the user selects the topic item 333a, the WEB browser 201 accesses the URL corresponding to the topic item 333a and displays a screen that explains the details of the topic represented by the topic item 333a, as shown in FIG. 8. The window size is displayed in the same size as that of any one of FIGS. 3 to 6 before transition to FIG. 8. When the user presses the back button 801 of the browser, the display returns to any one of the display screens 300 of FIGS. 3 to 6 before transition to FIG. 8.

[0033] FIG. 9 is a flowchart showing an example of a screen display process of the WEB browser 201. Specifically, FIG. 9 is a flowchart describing in detail the process of S217 in FIG. 2 executed by the CPU 101 as a function of the WEB browser. The process of S217 will be described in detail with reference to FIG. 9. The process of the WEB browser 201 in FIG. 9 is realized by the CPU 101 expanding the program 107 stored in the ROM 102 into the RAM 103 and executing the expanded program. The CPU 101 executes the following steps based on the program of the WEB browser 201 and the program 117 acquired in the RAM 103. The flowchart in FIG. 9 is started by the WEB browser 201 receiving a response of the program 117 from the server 110 in S216. Note that the symbol "S" in the following description of each process means each process (each step) in FIG. 9.

[0034] In S900, CPU 101, as a function of WEB browser 201, refers to a setting value of the OS (operating system) and acquires a window size. The window size value is, for example, in pixels, but is not limited to this. For example, the window size value may be a value (inches) derived from the resolution. In addition, the user can freely change the window size by operating the mouse. Changing the window size in response to the user's mouse operation is a function of the OS, so a value indicating the changed window size is held in RAM 103 as a setting value of the OS. In this case, in S900, CPU 101 acquires a value indicating the changed window size.

[0035] In S901, CPU 101 determines whether the window size in RAM 103 acquired in S900 is large. Specifically, CPU 101 determines whether the value of the window size is equal to or larger than a first threshold value. For example, WEB browser 201 determines whether the width of the window size is equal to or larger than 1024 pixels. If CPU 101 determines that the window size is large (Yes), it proceeds to processing of S902, and if it determines that the window size is not large (No), it proceeds to processing of S903.

[0036] In S902, the CPU 101, as a function of the WEB browser 201, refers to a description regarding the layout of a WEB page described in the program 117 in the RAM 103, and displays the WEB page (large layout) shown in Fig. 3 on the display device 104. After that, the CPU 101 proceeds to the process of S905.

[0037] In S903, CPU 101 determines whether the window size in RAM 103 acquired in S900 is medium. Specifically, CPU 101 determines whether the window size value is less than a first threshold value and equal to or greater than a second threshold value. For example, CPU 101 determines whether the width of the window size is less than 1024 pixels and equal to or greater than 640 pixels. If CPU 101 determines that the window size is medium (Yes), it proceeds to processing of S904, and if it determines that the window size is not medium (No) (i.e., the window size is small), it proceeds to processing of S910.

[0038] In S904, the CPU 101, as a function of the WEB browser 201, refers to the description regarding the layout of the WEB page described in the program 117 in the RAM 103, and displays the WEB page (in the process of being laid out) shown in Fig. 5 on the display device 104. After that, the CPU 101 proceeds to the process of S905.

[0039] In S910, the CPU 101, as a function of the WEB browser 201, refers to the description regarding the layout of the WEB page described in the program 117 in the RAM 103, and displays the WEB page (small layout) shown in Fig. 6 on the display device 104. After that, the CPU 101 proceeds to the process of S911.

[0040] In S905, the CPU 101, as a function of the WEB browser 201, determines whether or not the "See more" button displayed on the display device 104 has been pressed by a user operation. If the CPU 101 determines that the "See more" button has been pressed (Yes), the process proceeds to S906, and if the CPU 101 determines that the "See more" button has not been pressed (No), the process proceeds to S907.

[0041] In S906, the CPU 101, as a function of the WEB browser 201, refers to the program 117 in the RAM 103 and displays all topic items belonging to the category corresponding to the topic display section including the "See more" button pressed by the user. Specifically, when the display screen 300 in Fig. 3 is displayed and the user presses the "See more" button 334, the WEB browser 201 displays the display screen 300 as shown in Fig. 4 on the display device 104. After that, the CPU 101 proceeds to the process of S907.

[0042] In S907, the CPU 101, as a function of the WEB browser 201, determines whether or not the "Close" button displayed on the display device 104 has been pressed by a user operation. If the CPU 101 determines that the "Close" button has been pressed (Yes), the process proceeds to S908, and if the CPU 101 determines that the "Close" button has not been pressed (No), the process proceeds to S909.

[0043] In S908, the CPU 101, as a function of the WEB browser 201, refers to the program 117 in the RAM 103 and displays a predetermined number of topic items belonging to a category corresponding to the category display section including the "close" button pressed in S907. In other words, the WEB browser 201 closes the accordion belonging to the category corresponding to the category display section including the pressed "close" button, and displays a predetermined number of topic items. Here, the predetermined number is four if the WEB browser 201 has executed S902 before S908. On the other hand, if the WEB browser 201 has executed S904 before S908, the predetermined number of topics is three. In other words, after S908 is executed, if the WEB browser 201 has executed S902 before S908, the WEB browser 201 displays the display screen 300 shown in FIG. 3. If the WEB browser 201 has executed S904 before S908, the WEB browser 201 displays the display screen 300 shown in FIG. 4. Thereafter, the CPU 101 proceeds to the process of S909.

[0044] In S911, the CPU 101, as a function of the WEB browser 201, determines whether or not a tab of a non-selected category being displayed on the display device 104 has been pressed by a user operation. If the CPU 101 determines that a tab of a non-selected category has been pressed (Yes), the process proceeds to S912, and if the CPU 101 determines that this has not been the case (No), the process proceeds to S909.

[0045] In S912, the CPU 101, as a function of the WEB browser 201, refers to the program 117 in the RAM 103 and displays all topic items corresponding to the tab of the category pressed by the user. Specifically, when the display screen 300 in Fig. 6 is displayed and the user presses the button 641 belonging to the category "Work", the WEB browser 201 displays the display screen 300 as shown in Fig. 7. After that, the CPU 101 proceeds to the process of S909.

[0046] In S909, the CPU 101, as a function of the WEB browser 201, determines whether or not any of the topic items displayed in the topic display section being displayed on the display device 104 has been selected by a user operation. If the CPU 101 determines that any of the topic items has been selected (Yes), the process proceeds to S913, and if the CPU 101 determines that this has not been selected (No), the process proceeds to S915.

[0047] In S913, CPU 101, as a function of WEB browser 201, requests server 110 for a WEB page describing details of the topic corresponding to the topic display section. Here, the process flow from when WEB browser 201 requests server 110 for the WEB page until the WEB page is received is the same as the process flow from S211 to S213 in Fig. 2. CPU 101 displays the WEB page received from server 110 on display device 104. Then, CPU 101 proceeds to the process of S914.

[0048] In S914, CPU 101, as a function of WEB browser 201, determines whether or not the back button displayed on display device 104 has been pressed by a user operation. Specifically, when display screen 300 of Fig. 8 is displayed, CPU 101 determines whether or not back button 801 has been pressed. If CPU 101 determines that the back button has been pressed (Yes), it proceeds to processing of S900 again, and if it determines that the back button has not been pressed (No), it proceeds to processing of S914 again.

[0049] In S915, the CPU 101, as a function of the WEB browser 201, determines whether or not the WEB page 116 has been left. Here, leaving the WEB page 116 means that the user inputs the URL of an external WEB page (a WEB page not included in this embodiment) into the WEB browser 201, or presses an end button (not shown) to end the WEB browser 201. If the CPU 101 determines that the user has left the WEB page 116 (Yes), it ends the process, and if it determines that the user has not left the WEB page 116 (No), it proceeds to the process of S900 again.

[0050] Here, the process of the WEB browser 201 when the window size is changed by the user will be described. The change in window size is detected by the OS ((Operating System) not shown), and is not detected by the program of the WEB browser 201. However, as shown in the flowchart of FIG. 9, the WEB browser 201 periodically acquires the window size as the flow continues, and determines the acquired window size as described above to display the WEB page. Specifically, if the WEB browser 201 determines in S915 that the user has not left the WEB page 116, and if it determines in S914 that the back button has been pressed, it acquires the window size again in S900. After that, if the window size has been changed, the WEB browser 201 displays the WEB page 116 based on the window size. In other words, if the window size is changed by the control of the OS, the WEB browser 201 performs a process based on the changed window size. As a result, the WEB browser 201 switches the display of the layout of the WEB page (display process of S902, S904, and S910) in response to the change in the window size.

[0051] As described above, according to this embodiment, when the window size is large or medium, the WEB browser displays representative topic items among the topic items corresponding to each category in each topic display section, as shown in FIG. 3 or FIG. 5. This ensures the visibility of the WEB page. According to this embodiment, when the window size is small, the topic items belonging to the category corresponding to the selected category tab can be displayed at a size equal to or larger than a predetermined size, as shown in FIG. 6 and FIG. 7. This makes it easier for the user to find topics classified into a category that meets his / her needs without impairing visibility even when the display area is small. Also, according to this embodiment, the WEB browser displays a WEB page according to the window size under a situation where the window size is changed. For example, when the window size is reduced from the display state of FIG. 3, the WEB browser displays the display screen of FIG. 5. Furthermore, when the window size is reduced, the WEB browser displays the display screen of FIG. 6. In this way, even when the window size is changed, the WEB browser can display the WEB page so that the user can easily grasp the categories and topics and easily access the desired topic.

[0052] The object of the present disclosure is to supply a storage medium storing the program code of the software that realizes the functions of the above-mentioned embodiment to a system and / or device. Needless to say, the object can also be achieved by having the computer (or CPU or MPU (Micro Processing Unit)) of the system and / or device read and execute the program code stored in the storage medium. In this case, the program code itself read from the storage medium realizes the functions of the above-mentioned embodiment, and the storage medium storing the program code constitutes the present disclosure. For example, a flexible disk, a hard disk, an optical disk, a magneto-optical disk, a CD (Compact disc)-ROM, a CD-R, etc. can be used as a storage medium for supplying the program code. In addition, a magnetic tape, a non-volatile memory card, a ROM, a DVD (Digital Versatile Disk), etc. can be used as a storage medium for supplying the program code.

[0053] Furthermore, the functions of the above-mentioned embodiments are realized by a computer executing the read program code. Needless to say, this also includes cases where an OS running on a computer performs part or all of the actual processing based on the instructions of the program code, and the functions of the above-mentioned embodiments are realized by that processing.

[0054] Furthermore, the program code read from the storage medium is written into a memory provided in a function expansion board inserted into the computer and / or a function expansion unit connected to the computer, and then, based on the instructions of the program code, a CPU provided in the function expansion board and the function expansion unit performs part or all of the actual processing, and it goes without saying that the above-mentioned embodiment functions are realized by the processing.

[0055] Furthermore, the program code can be supplied to the information processing device via communication means such as a LAN (Local Area Network) and / or a dedicated line in addition to the Internet.

[0056] The disclosure of the present embodiment includes configurations typified by the following program examples, storage medium examples, information processing device examples, and display control method examples.

[0057] <Configuration 1> At least one computer an acquisition means for acquiring information indicating a size of a resizable display area; Based on the information acquired by the acquisition means, When the size of the display area is a first size, displaying in the display area, in each of a plurality of areas corresponding to each of a plurality of categories, display items corresponding to a first number of contents classified into the corresponding categories; When the size of the display area is a second size smaller than the first size, displaying a plurality of operation items corresponding to a plurality of categories in the display area, and displaying a display item corresponding to a content classified into a category corresponding to a selected operation item without displaying a display item corresponding to a content classified into a category corresponding to an unselected operation item among the plurality of operation items. A display control means for controlling the display At least one program that functions as

[0058] <Configuration 2> The first number is 2 or greater. 2. At least one program according to claim 1 .

[0059] <Configuration 3> When the size of the display area is a third size smaller than the first size and larger than the second size, display items corresponding to a second number of contents classified into a corresponding category, which is smaller than the first number, are displayed in each of a plurality of areas corresponding to a corresponding category. 3. At least one program according to configuration 1 or 2.

[0060] <Configuration 4> The display control means controls the display of each of the display items so as to maintain a certain size or larger even when the size of the display area is reduced from the first size to the second size. At least one program according to any one of configurations 1 to 3.

[0061] <Component 5> Each of the contents classified into the plurality of categories is content related to how to use a device. 5. At least one program according to any one of claims 1 to 4.

[0062] <Component 6> The device is a printing device. At least one program according to configuration 5.

[0063] <Component 7> The multiple categories include at least one of life, work, and learning. 7. At least one program according to any one of claims 1 to 6.

[0064] <Component 8> The content to be included in the first number is selected in descending order of the number of clicks of the display items. At least one program according to any one of configurations 1 to 7.

[0065] <Component 9> When the size of the display area is changed from the first size to the second size, the tab that is first selected corresponds to the category that was displayed at the top of the display area before the change. At least one program according to any one of configurations 1 to 8.

[0066] <Component 10> Among the plurality of operation items, an operation item that is first selected when the size of the display area is changed from the first size to the second size corresponds to a category in which an operator for expanding an area displaying the display items was last operated before the change. 10. At least one program according to any one of claims 1 to 9.

[0067] <Component 11> When the size of the display area is changed from the second size to the first size, the display control means controls the display to be in the same display state as when an operator for expanding an area displaying the display items of the category corresponding to the operation item selected before the change among the plurality of operation items is operated. 11. At least one program according to any one of claims 1 to 10.

[0068] <Component 12> When the size of the display area is changed from the second size to the first size, the display control means controls so that a category corresponding to an operation item selected before the change among the plurality of operation items is displayed at a display position within a predetermined range in the display area. 12. At least one program according to any one of claims 1 to 11.

[0069] <Component 13> The plurality of operation items are tabs or items in a pull-down menu. 13. At least one program according to any one of claims 1 to 12.

[0070] <Component 14> At least one computer an acquisition means for acquiring information indicating a size of a resizable display area; a display control means for displaying, in each of a plurality of areas corresponding to a plurality of categories, display items corresponding to a first number of contents classified into the corresponding categories, when the size of the display area is a first size, based on the information acquired by the acquisition means; A program that functions as each of the plurality of categories of content is content relating to how to use a printing device; The multiple categories include at least one of life, work, and learning. At least one program characterized by:

[0071] <Component 15> A computer-readable storage medium storing at least one program according to any one of configurations 1 to 14.

[0072] <Component 16> 15. An information processing device comprising the means described in any one of configurations 1 to 14.

[0073] <Component 17> obtaining information indicative of a size of a resizable display area; Based on the information obtained, When the size of the display area is a first size, displaying in the display area, in each of a plurality of areas corresponding to each of a plurality of categories, display items corresponding to a first number of contents classified into the corresponding categories; When the size of the display area is a second size smaller than the first size, a plurality of operation items corresponding to a plurality of categories are displayed in the display area, and among the plurality of operation items, display items corresponding to content classified into a category corresponding to an unselected operation item are not displayed, and display items corresponding to content classified into a category corresponding to a selected operation item are displayed. A display control method comprising: [Explanation of symbols]

[0074] 100: Information processing device 110: Server 101, 111: CPU

Claims

1. At least one computer, an acquisition means for acquiring information indicating a size of a resizable display area; Based on the information acquired by the acquisition means, When the size of the display area is a first size, displaying in the display area, in each of a plurality of areas corresponding to each of a plurality of categories, display items corresponding to a first number of contents classified into the corresponding categories; When the size of the display area is a second size smaller than the first size, a plurality of operation items corresponding to a plurality of categories are displayed in the display area, and among the plurality of operation items, display items corresponding to content classified into a category corresponding to an unselected operation item are not displayed, and display items corresponding to content classified into a category corresponding to a selected operation item are displayed. A display control means for controlling the display At least one program that functions as

2. The first number is 2 or greater.

2. At least one program according to claim 1 .

3. When the size of the display area is a third size smaller than the first size and larger than the second size, display items corresponding to a second number of contents classified into a corresponding category, which is smaller than the first number, are displayed in each of a plurality of areas corresponding to a corresponding category.

2. At least one program according to claim 1 .

4. The display control means controls the display of each of the display items so as to maintain a certain size or larger even when the size of the display area is reduced from the first size to the second size.

2. At least one program according to claim 1 .

5. Each of the contents classified into the plurality of categories is content related to how to use a device.

2. At least one program according to claim 1 .

6. The device is a printing device.

6. At least one program according to claim 5.

7. The plurality of categories includes at least one of life, work, and learning.

2. At least one program according to claim 1 .

8. The content to be included in the first number is selected in descending order of the number of clicks of the display items.

2. At least one program according to claim 1 .

9. When the size of the display area is changed from the first size to the second size, the tab that is first selected corresponds to the category that was displayed at the top of the display area before the change.

2. At least one program according to claim 1 .

10. Among the plurality of operation items, an operation item that is first selected when the size of the display area is changed from the first size to the second size corresponds to a category in which an operator for expanding an area displaying the display items was last operated before the change.

2. At least one program according to claim 1 .

11. When the size of the display area is changed from the second size to the first size, the display control means controls the display so as to display the display in the same display state as when an operator for expanding an area displaying the display items of the category corresponding to the operation item selected before the change among the plurality of operation items is operated.

2. At least one program according to claim 1 .

12. When the size of the display area is changed from the second size to the first size, the display control means controls so that a category corresponding to an operation item selected before the change among the plurality of operation items is displayed at a display position within a predetermined range in the display area.

2. At least one program according to claim 1 .

13. The plurality of operation items are tabs or items in a pull-down menu.

2. At least one program according to claim 1 .

14. At least one computer, an acquisition means for acquiring information indicating a size of a resizable display area; a display control means for displaying, in each of a plurality of areas corresponding to a plurality of categories, display items corresponding to a first number of contents classified into the corresponding categories, when the size of the display area is a first size, based on the information acquired by the acquisition means; A program that functions as each of the plurality of categories of content is content relating to how to use a printing device; The plurality of categories includes at least one of life, work, and learning. At least one program characterized by:

15. A computer readable storage medium storing at least one program according to any one of claims 1 to 14.

16. 15. An information processing apparatus comprising the means according to any one of claims 1 to 14.

17. obtaining information indicative of a size of a resizable display area; Based on the information obtained, When the size of the display area is a first size, displaying in the display area, in each of a plurality of areas corresponding to each of a plurality of categories, display items corresponding to a first number of contents classified into the corresponding categories; When the size of the display area is a second size smaller than the first size, a plurality of operation items corresponding to a plurality of categories are displayed in the display area, and among the plurality of operation items, display items corresponding to content classified into a category corresponding to an unselected operation item are not displayed, and display items corresponding to content classified into a category corresponding to a selected operation item are displayed. A display control method comprising:

Citation Information

Patent Citations

  • Information processor, information processing method, program and recording medium

    JP2009123020A