Display method and display system
By resizing content images based on screen resolution ratios, the method addresses display inconsistencies, ensuring appropriate proportions and faithful reproduction of content across varying computer environments.
Patent Information
- Application Number
- JP2024127708
- Authority / Receiving Office
- JP · JP
- Patent Type
- Applications
- Current Assignee / Owner
- Filing Date
- 2024-08-02
- Publication Date
- 2026-02-13
AI Technical Summary
The challenge arises when the display resolution of the computer creating and testing an HTML file differs from the resolution of the computer displaying the content, leading to inappropriate image proportions and text positioning, resulting in a difficult-to-see display.
A method involving resizing content images based on the ratio between the first and second screen resolutions to maintain appropriate proportions, using a system with a web server and image generation server to generate and transmit content images in a predetermined format.
Ensures faithful display of content with appropriate proportions on the second screen, regardless of differing computer configurations, by resizing content images according to the determined resolution ratios.
Smart Images

Figure 2026025139000001_ABST
Abstract
Description
[Technical Field]
[0001] The present invention relates to a display method and a display system for displaying content included in an HTML (HyperText Markup Language) file on a screen having a predetermined resolution. [Background technology]
[0002] Currently, one method for displaying various types of information on a computer is to display the information contained in an HTML file using an application such as a web browser (see, for example, Patent Document 1). With this display method, it is possible to specify in the HTML file that various types of information should be displayed in any format, so that various types of information can be displayed on a computer in an easy-to-view and easy-to-use format. [Prior art documents] [Patent documents]
[0003] [Patent Document 1] Special Publication No. 2016-505911 Summary of the Invention [Problem to be solved by the invention]
[0004] Generally, the configuration and / or usage environment of a computer that creates an HTML file and tests whether the created HTML file displays properly is different from the configuration and / or usage environment of a computer that retrieves the HTML file from a server, etc. and displays various information based on the HTML file. In particular, the resolution of the display of the computer that creates the HTML file and performs the test is often different from the resolution of the display of the computer that displays various information.
[0005] In this way, if the display resolution of the computer on which the HTML file is created and the test is performed differs from the display resolution of the computer on which various information is actually displayed, information that was displayed appropriately with an optimally balanced layout on the computer on which the HTML file is created and the test is performed may not be displayed appropriately on the computer on which the various information is actually displayed, due to the imbalance. For example, on the computer on which the various information is actually displayed, the proportions of the images contained in the images may be inappropriate, or text may be wrapped in an inappropriate position, resulting in an inappropriate display. As a result, the actual display may be difficult to see.
[0006] The object of the present invention is to faithfully display information on a computer that displays various information, even if the configuration / usage environment of the computer that creates and tests an HTML file with an optimally balanced layout design is different from the configuration / usage environment of the computer that displays various information based on this HTML file. [Means for solving the problem]
[0007] A display method according to one aspect of the present invention is a method for displaying content on a second screen having a second resolution based on an HTML file that displays the content in a predetermined format on a first screen having a first resolution. The display method includes the following steps: (a) A step of acquiring a state in which the content is displayed on the first screen as a content image. (b) resizing the content image based on a ratio determined by the first resolution of the first screen and the second resolution of the second screen; (c) displaying the resized content image on the second screen; [Effects of the Invention]
[0008] In the above display method, when content is displayed on a second screen having a second resolution based on an HTML file that can display the content with appropriate proportions in a predetermined format on a first screen having a first resolution, the content image in which the content is arranged with appropriate proportions can be obtained by acquiring the content image as it is actually displayed on the first screen. Furthermore, by resizing the acquired content image based on a ratio determined by the first resolution of the first screen and the second resolution of the second screen, the proportions of the content included in the resized content image become the same as the proportions of the content included in the content image before resizing. As a result, when the resized content image is displayed on the second screen, the content can be faithfully displayed on the second screen with appropriate proportions, just as it was displayed on the first screen.
[0009] In other words, even if the configuration / usage environment of the computer that creates and tests an HTML file with an optimally balanced layout design is different from the configuration / usage environment of the computer that displays the content based on this HTML file, the content can be faithfully displayed on the computer that actually displays the content. [Brief explanation of the drawings]
[0010] [Figure 1] FIG. 1 shows the system configuration. [Figure 2A] FIG. 10 is a diagram showing an example of an HTML file creation screen. [Figure 2B] FIG. 10 is a diagram showing an example of an HTML file written in a page setup field. [Figure 3] 10 is a flowchart showing a method for displaying content. [Figure 4A] FIG. 10 is a diagram showing an example of a display state of content. [Figure 4B] FIG. 10 is a diagram showing an example of a display state of content. DETAILED DESCRIPTION OF THE INVENTION
[0011] 1. First embodiment 1-1. System configuration The system 100 will be described below with reference to Fig. 1. Fig. 1 is a diagram showing the configuration of the system 100. The system 100 includes a server 1 and a user terminal 3. The system 100 is a system for displaying content provided by the server 1 on the user terminal 3.
[0012] The server 1 provides various contents to the user terminal 3. The server 1 includes a web server 11 and an image generation server 13.
[0013] The Web server 11 is a computer system configured with various processors or electronic circuits such as a CPU, MPU, GPU, DSP, FPGA, ASIC, etc., storage devices (e.g., RAM, ROM, HDD, SSD, etc.), various interfaces (input / output interface, network interface, etc.), etc. The Web server 11 is connected to the user terminal 3 via a network NW. The network NW is a communication network for wired / wireless communication such as the Internet, WAN, LAN, etc. In other words, the Web server 11 and the user terminal 3 are capable of communicating via the network NW.
[0014] The Web server 11 is also connected to and capable of communicating with the image generation server 13. The Web server 11 and the image generation server 13 may be connected by a communication network separate from the network NW to which the Web server 11 and the user terminal 3 are connected, or may be connected by the same communication network as the network NW.
[0015] The web server 11 has a first information processing unit 11a and a first storage unit 11b. The first information processing unit 11a is configured by a processor and the like that constitutes the web server 11, and executes various information processing in the web server 11. The first information processing unit 11a realizes various information processing by executing programs stored in the storage unit. Note that all or part of the various information processing in the web server 11 may be realized by hardware.
[0016] When the first information processing unit 11a receives a command from the user terminal 3 to provide content, it transmits an HTML file F1, which describes how to display the content in a predetermined format, to the user terminal 3. Furthermore, when the first information processing unit 11a receives a command from the user terminal 3, it transmits to the image generation server 13 a command to generate a content image that visualizes the content to be displayed on the user terminal 3, and transmits the content image generated by the image generation server 13 to the user terminal 3.
[0017] The first storage unit 11b is configured by a storage device or the like that constitutes the Web server 11, and stores programs, various parameters, etc. that execute various information processes in the Web server 11. The first storage unit 11b stores an HTML file F1 and an HTML file creation screen GUI1.
[0018] The HTML file F1 is a file for displaying content provided by the Web server 11 in a predetermined format on a Web browser. The HTML file F1 is created based on the resolution of the display unit (monitor) of the computer that created it. In other words, the HTML file F1 is adjusted so that the content can be displayed with appropriate proportions at the resolution of the display unit of the computer that created it. The computer that creates the HTML file F1 is, for example, the Web server 11 and / or a terminal connected to the Web server 11 (for example, another user terminal 3).
[0019] Here, "appropriate proportions" refers to a state in which, if the content includes an image, the image in the image is not distorted (the aspect ratio is appropriate). Also, if the content includes text, it refers to a state in which the text is displayed in an easy-to-understand manner, with the aspect ratio of the text appropriate and the text not wrapping in inappropriate places. Furthermore, if the content includes multiple elements (images and / or text), it refers to a state in which the multiple elements are arranged in appropriate sizes and positions.
[0020] The HTML file creation screen GUI1 is a graphical user interface (GUI) for creating an HTML file F1. The HTML file creation screen GUI1 may be, for example, an HTML file that displays a screen such as that shown in Fig. 2A on a web browser, or may be a screen such as that shown in Fig. 2A that is displayed when an HTML file creation application is launched. Fig. 2A is a diagram showing an example of the HTML file creation screen GUI1.
[0021] The HTML file creation screen GUI1 has a page setting field FI1, a reference resolution setting field FI2, an element setting field FI3, a save button B1, and a back button B2. The page setting field FI1 is a field where a web page that displays content is set by writing it in HTML. The content written in the page setting field FI1 becomes an HTML file F1. In other words, the HTML file F1 is a web page that displays content written in HTML.
[0022] As shown in FIG. 2B, the page setup field FI1 contains multiple " <div class=""···”"> "and" " and there is a closed area. This is <div class=""···”"> "and" " indicates that the content contains the elements described in the enclosed area. In the example of the settings displayed in the page setting field FI1 in Figure 2B, <div class=""···”"> "and"" indicates that there are two areas enclosed by " and ", and two contents are to be displayed on the Web page. Fig. 2B is a diagram showing an example of an HTML file written in the page setting field FI1.
[0023] In the example settings shown in the page setting field FI1 in Figure 2B, <div class=""event_info”">" indicates that the content defined as "event_info" consists of two elements (element 1, element 2), and <div class=""access_info”">" indicates that the content defined as "access_info" is made up of three elements (elements 3 to 5). As will be described later, the content of each element included in the content and the format in which it is displayed are set in element setting field FI3.
[0024] Additionally, in the page settings field FI1, there are areas enclosed by "{" and "}" after the content definition name such as ".event_info," and within each area there is the statement "display:grid." This indicates that each piece of content will be displayed in a table arranged according to a predetermined format. In the example shown in FIG. 2B, content including two elements (element 1 and element 2) defined as "event_info" is displayed in one table, and content including three elements (element 3 to element 5) defined as "access_info" is displayed in another table.
[0025] The reference resolution setting field FI2 is a field for setting the resolution of the display unit (display) of the computer on which the HTML file F1 is being created / edited. When the HTML file F1 is displayed on a display with this resolution, the content is displayed with appropriate proportions. Information about the resolution set in the reference resolution setting field FI2 is sent to the user terminal 3 requesting the HTML file F1.
[0026] The element setting field FI3 is a field for setting the content of each element included in the content and the format for displaying the content. The element setting field FI3 has a first field FI31 and a second field FI32. For example, the format of the element is written in HTML in either the first field FI31 or the second field FI32, and the content of the element (also in HTML if necessary) is written in the other.
[0027] In the case of an element whose content is text, for example, the format can be written in the first field FI31 (for example, written within the range enclosed in """ of "div style=""" and "p style="""), and the content of the element can be written in the second field FI32.
[0028] On the other hand, when an image is used as an element, for example, the location of the image (URL, Uniform Resource Locator) can be written in the first field FI31 (for example, the URL can be written after "img src="), and the format can be written in the second field FI32 (for example, the format can be written after "style=" so that it follows the image URL).
[0029] The above-described method of setting (describing) elements is merely an example, and can be arbitrarily selected depending on the user's preferences.
[0030] The save button B1 is a button for performing an operation to store the content being created / edited on the HTML file creation screen GUI1 as an HTML file F1 in the first storage unit 11b of the Web server 11. The back button B2 is a button for performing an operation to cancel the creation / editing on the HTML file creation screen GUI1 and return to the previously displayed page.
[0031] Returning to the explanation of the configuration of the system 100, the image generation server 13 is a computer system configured with various processors or electronic circuits such as a CPU, MPU, GPU, DSP, FPGA, ASIC, etc., storage devices (e.g., RAM, ROM, HDD, SSD, etc.), various interfaces (input / output interface, network interface, etc.), etc. The image generation server 13 is connected to the Web server 11.
[0032] The image generation server 13 generates a content image by imaging the content to be displayed in the HTML file F1 in accordance with a command from the Web server 11. The image generation server 13 has a second information processing unit 13a and a second storage unit 13b.
[0033] The second information processing unit 13a is configured by a processor or the like that constitutes the image generation server 13, and executes various information processing in the image generation server 13. The second information processing unit 13a realizes various information processing by executing a program stored in the storage device. Note that all or part of the various information processing in the image generation server 13 may be realized by hardware. When the second information processing unit 13a receives an instruction from the Web server 11 to provide a content image, it generates a content image and transmits it to the Web server 11.
[0034] The second storage unit 13b is configured by a storage device or the like that constitutes the image generation server 13, and stores programs for executing various information processes in the image generation server 13, various parameters, and the like.
[0035] The user terminal 3 is a computer system configured with various processors or electronic circuits such as a CPU, MPU, GPU, DSP, FPGA, ASIC, etc., storage devices (e.g., RAM, ROM, HDD, SSD, etc.), various interfaces (input / output interface, network interface, etc.), etc. The user terminal 3 is connected to the web server 11 via the network NW. The user terminal 3 is a computer capable of browsing web pages, such as a desktop computer, laptop computer, tablet terminal, smartphone, etc. As such, there are various types of user terminals 3, and their configurations / usage environments (particularly, display size and resolution) are also diverse.
[0036] The user terminal 3 is a terminal for viewing content provided by the server 1 (Web server 11). The user terminal 3 includes a third information processing unit 31, a third storage unit 33, and a display unit .
[0037] The third information processing unit 31 is configured by a processor or the like that constitutes the user terminal 3, and executes various information processes in the user terminal 3. The third information processing unit 31 realizes the various information processes by executing programs stored in the storage device. Note that all or part of the various information processes in the user terminal 3 may be realized by hardware.
[0038] The third information processing unit 31 requests the Web server 11 to view the content. The third information processing unit 31 interprets the HTML file F1 transmitted in response to this request and displays the content on the display unit 35 in accordance with the description of the HTML file F1. At this time, the third information processing unit 31 changes the size of the content image transmitted from the Web server 11 and displays the resized content image on the display unit 35 as the content to be viewed.
[0039] The third storage unit 33 is configured by a storage device or the like that constitutes the user terminal 3, and stores programs, various parameters, and the like that execute various information processes in the user terminal 3. For example, the third storage unit 33 stores a web browser that interprets HTML and displays a web page in accordance with the contents of the HTML file F1.
[0040] The display unit 35 is a display that displays various types of information. The display unit 35 is, for example, a display device such as a liquid crystal display, an organic EL display, or a plasma display. The display unit 35 has a predetermined resolution. The resolution of the display unit 35 may be changed, for example, according to a setting by the user who uses the user terminal 3 or the orientation of the user terminal 3 (for example, portrait or landscape orientation). In other words, the resolution of the display unit 35 can be changed not only according to the type of the user terminal 3 and the display unit 35, but also according to the user setting, the orientation of the user terminal 3, etc.
[0041] 1-2. How to display content A method for displaying content in the system 100 will now be described. First, an HTML file F1 for displaying the content is created / edited. Specifically, an HTML file creation screen GUI1 shown in Figure 2A is displayed on the display of the Web server 11 or a computer connected to the Web server 11.
[0042] Next, in the page setting field FI1 of the HTML file creation screen GUI1, the content to be displayed on the Web page and the display format of the content on the Web page (such as the layout and size of each cell in the table) are written in HTML, as shown in Figure 2B. In the reference resolution setting field FI2, the resolution (referred to as the first resolution) of the computer creating the HTML file F1 and / or the computer on which the HTML file F1 will be test-displayed is set. In the element setting field FI3, the content and display format of the elements included in each content are written in HTML.
[0043] After completing the settings for each field, pressing the Save button B1 replaces each of the "Element ○" HTML descriptions in the page setting field FI1 with the HTML description in the element setting field FI3, which sets the content and display format of the element, and generates an HTML file F1 containing information on the resolution set in the reference resolution setting field FI2, which is then stored in the first memory section 11b of the Web server 11.
[0044] When the HTML file F1 is created and stored in the first storage unit 11b, the Web server 11 starts a content providing service using a Web page displayed using the HTML file F1.
[0045] After the content provision service starts, the content can be viewed using the user terminal 3 of the system 100. The content is viewed using the user terminal 3 according to the flowchart of Fig. 3. Fig. 3 is a flowchart showing a method for displaying content.
[0046] First, a user uses the user terminal 3 to make a request for content to be viewed from the Web server 11 (step S1). The content is requested by, for example, specifying the location (URL) of an HTML file F1 for displaying the content.
[0047] Upon receiving the content request, the first information processing unit 11a of the Web server 11 reads the corresponding HTML file F1 from the first storage unit 11b and transmits it to the user terminal 3 (step S2).
[0048] The third information processing unit 31 of the user terminal 3 that has received the HTML file F1 references the received HTML file F1 and requests the content described in the HTML file F1 from the Web server 11 (step S3).
[0049] The first information processing unit 11a of the Web server 11 that has received the request for the content requests the image generation server 13 to generate a content image by imaging the content (step S4).
[0050] As will be described later, the image generation server 13 displays content that is the basis for generating a content image, and generates the content image by capturing the displayed content as an image. Therefore, when requesting generation of a content image, the first information processing unit 11a of the Web server 11 transmits, together with the request for generation of a content image, an HTML description that describes the content and display format of each element of the content, which is included in the HTML file F1 transmitted in step S2, i.e., an HTML description for displaying the content within a Web page, as a content display HTML file to the image generation server 13 (step S5).
[0051] The second information processing unit 13a of the image generation server 13 that has received the content image generation request generates the content image (step S6). Specifically, the content image is generated as follows. First, the second information processing unit 13a launches a headless browser. A headless browser is a browser from which the header portion located at the top of a web browser or the like has been removed. Next, the second information processing unit 13a uses the running headless browser to display the content for which image generation has been requested at the set resolution (the resolution set in the reference resolution setting field FI2 on the HTML file creation screen GUI1) based on the content display HTML file received in step S5.
[0052] When creating a content image in the image generation server 13, the content does not have to be displayed on the display of the image generation server 13. In this case, the content can be displayed by, for example, storing image data of the content as displayed on the headless browser in a storage area that stores data to be displayed on the display. The second information processing unit 13a acquires the content image by performing a screen capture of the content as displayed on the headless browser.
[0053] The second information processing unit 13a transmits the acquired content image to the Web server 11 (step S7). At this time, the second information processing unit 13a converts the acquired content image into BASE64 format and transmits it to the Web server 11 as a character string.
[0054] The first information processing unit 11a of the Web server 11 that has received the content image transmits the received content image to the user terminal 3 (step S8). At this time, the first information processing unit 11a transmits (character strings representing) the content images of all the content to be displayed on the user terminal 3 all at once to the user terminal 3 in a predetermined data format (for example, JSON data format).
[0055] The third information processing unit 31 of the user terminal 3 that received the content images displays the table represented in the HTML file F1 acquired in step S2 on the display unit 35, extracts the content images received in bulk one by one, and arranges and displays the extracted content images in the corresponding cells. At this time, the third information processing unit 31 changes the size of the extracted content images based on a ratio determined by the resolution set when the HTML file F1 was created (first resolution) and the resolution of the display unit 35 (referred to as the second resolution) so that the proportions of the image of the content image (the content itself) displayed on the display unit 35 of the user terminal 3 are the same as the original proportions (step S9).
[0056] For example, if the resolution set in the reference resolution setting field FI2 is 428 x 926 (width x height) and the content is displayed at this resolution in a size of 200 x 150 (width x height), and the resolution of the display unit 35 of the user terminal 3 is 390 x 844 (width x height), the content image will be resized to 182 x 137 (width x height) while maintaining the original aspect ratio.
[0057] Also, for example, if the resolution set in the reference resolution setting field FI2 is 1920 x 1080 (width x height) and the content is displayed at this resolution in a size of 200 x 150 (width x height), and the resolution of the display unit 35 of the user terminal 3 is 390 x 844 (width x height), the content image will be resized to 40 x 30 (width x height) (if adjusted based on the horizontal resolution ratio) or 156 x 117 (width x height) (if adjusted based on the vertical resolution ratio) while maintaining the original aspect ratio.
[0058] After changing the size of the content image, the third information processing unit 31 sequentially places the resized content image in the corresponding position (cell) (step S10). Note that the process of changing the size of the content image and placing it in the appropriate position is executed by a program, and the program for executing this process may be included in the HTML file F1, or may be obtained from the Web server 11 separately from the HTML file F1, or may be pre-installed in the Web browser as a plug-in, for example.
[0059] In this way, in the above system 100, when content is displayed on the display unit 35 of the user terminal 3 having a second resolution based on an HTML file F1 that can display the content in appropriate proportions in a predetermined format on a first screen having a first resolution, a content image in which the content is arranged in appropriate proportions can be obtained by obtaining a content image of the content actually displayed on the first screen.
[0060] Then, the size of the acquired content image is changed based on the ratio determined by the first resolution of the first screen and the second resolution of the second screen so that the proportions of the content contained in the content image after the change in size are the same as the proportions of the content contained in the content image before the change in size, and the content image after the change in size is displayed on the display unit 35 of the user terminal 3, so that the content can be displayed on the display unit 35 with appropriate proportions just as it was displayed on the first screen.
[0061] For example, content that is displayed with appropriate proportions when HTML file F1 is created / tested on a terminal having the screen shown in Figure 4A will also be displayed with appropriate proportions on a terminal having a screen of a different size / resolution as shown in Figure 4B. Figures 4A and 4B are diagrams showing an example of how content is displayed.
[0062] 2. Other embodiments As described above, each embodiment has been described as an example of the technology disclosed in this application. However, the technology in this disclosure is not limited to this, and can be applied to embodiments in which modifications, substitutions, additions, omissions, etc. are made as appropriate. Furthermore, it is also possible to combine the components described in the above embodiments to create new embodiments. For example, the following embodiments are possible.
[0063] (A) The order of execution of each step in the flowchart of Figure 3 and the processing content of each step can be changed as appropriate without departing from the spirit of the invention. Furthermore, multiple steps can be executed simultaneously.
[0064] (B) In the above embodiment, the server 1 is configured as separate computers, namely, the web server 11 that provides content and the image generation server 13 that generates content images, but this is not limited to this. For example, the functions of the web server 11 that provides content and the functions of the image generation server 13 that generates content images may be incorporated into a single computer system, and the server 1 may be configured by the single computer system.
[0065] (C) In the above embodiment, a content image is generated each time a content viewing request is received from the user terminal 3, but this is not limited to this. For example, a content image may be created when the HTML file F1 is created and stored in the first storage unit 11b of the Web server 11. Then, for example, a content image may be created each time the date, content, etc. of the content is changed, and the content image before the date, content, etc. was changed may be replaced with a content image.
[0066] 3. Notes (1) The display method is a method of displaying content on a second screen (e.g., display unit 35) having a second resolution based on an HTML file (e.g., HTML file F1) that displays the content in a predetermined format on a first screen having a first resolution (e.g., a resolution set in reference resolution setting field FI2 of HTML file creation screen GUI1). The display method includes the following steps. The following steps (a) to (c) do not limit the order in which each step is performed. (a) A step of acquiring a state in which the content is displayed on the first screen as a content image. (b) resizing the content image based on a ratio determined by the first resolution and the second resolution; (c) displaying the resized content image on the second screen;
[0067] In the above display method, when content is displayed on a second screen having a second resolution based on an HTML file that can display the content with appropriate proportions in a predetermined format on a first screen having a first resolution, the content image in which the content is arranged with appropriate proportions can be obtained by acquiring the content image as it is actually displayed on the first screen. Furthermore, by resizing the acquired content image based on a ratio determined by the first resolution of the first screen and the second resolution of the second screen, the proportions of the content included in the resized content image become the same as the proportions of the content included in the content image before resizing. As a result, when the resized content image is displayed on the second screen, the content can be displayed with appropriate proportions on the second screen, just as it was displayed on the first screen.
[0068] In other words, even if the configuration / usage environment of the computer that creates and tests an HTML file with an optimally balanced layout design is different from the configuration / usage environment of the computer that displays the content based on this HTML file, the content can be faithfully displayed on the computer that actually displays the content.
[0069] (2) In the display method described in (1) above, the HTML file may be configured to display the content in the corresponding cells in a table containing cells arranged according to the format described above. This allows the content to be displayed in an appropriate layout regardless of the computer configuration / usage environment.
[0070] (3) In the display method of (1) or (2) above, the step of acquiring a content image may include the following steps: (d) to (e) below do not limit the order in which the steps are performed. (d) displaying the content in a headless browser on the first screen; (e) A step of capturing the state displayed on the headless browser as a content image. This allows the content image to be acquired in an easy manner.
[0071] (4) A system (e.g., system 100) includes a server (e.g., server 1, web server 11, image generation server 13) and a terminal (e.g., user terminal 3). The server provides an HTML file that displays content in a predetermined format on a first screen having a first resolution. The terminal displays the content on a second screen (e.g., display unit 35) having a second resolution based on the HTML file.
[0072] In the above system, the server acquires the state of the content displayed on the first screen as a content image and transmits the content image to the terminal, while the terminal resizes the content image based on a ratio determined by the first resolution and the second resolution, and displays the resized content image on the second screen.
[0073] In the above system, when content is displayed on a second screen of a terminal having a second resolution based on an HTML file that can display the content with appropriate proportions in a predetermined format on a first screen having a first resolution, the content image in which the content is arranged with appropriate proportions can be obtained by acquiring the content as it is actually displayed on the first screen as a content image. Furthermore, by resizing the acquired content image based on a ratio determined by the first resolution of the first screen and the second resolution of the second screen, the proportions of the content included in the resized content image become the same as the proportions of the content included in the content image before resizing. As a result, when the resized content image is displayed on the second screen, the content can be displayed with appropriate proportions on the second screen, just as it was displayed on the first screen.
[0074] In other words, even if the configuration / usage environment of the computer that creates and tests an HTML file with an optimally balanced layout design is different from the configuration / usage environment of the computer that displays the content based on this HTML file, the content can be faithfully displayed on the computer that actually displays the content. [Industrial Applicability]
[0075] The present invention is widely applicable to cases where content contained in an HTML file is displayed on a screen having a predetermined resolution. [Explanation of symbols]
[0076] 100: System 1: Server 11: Web server 11a: First information processing unit 11b: 1st storage section F1 :HTML file GUI1: HTML file creation screen FI1: Page Setup Field FI2: Reference resolution setting field FI3: Element Settings Field FI31: First field FI32: Second field B1: Save button B2: Back button 13: Image generation server 13a: Second information processing section 13b: 2nd storage section 3: User terminal 31: Third information processing section 33:Third memory section 35: Display section NW: Network
Claims
1. 1. A content display method for displaying content on a second screen having a second resolution based on an HTML file that displays the content in a predetermined format on a first screen having a first resolution, comprising: acquiring a state in which the content is displayed on the first screen as a content image; resizing the content image based on a ratio determined by the first resolution and the second resolution; displaying the content image after the size change on the second screen; A display method comprising:
2. The display method according to claim 1 , wherein the HTML file is configured to display the content in a table containing cells arranged according to the format, with the content included in the corresponding cell.
3. The step of acquiring the content image includes: displaying the content on a headless browser on the first screen; capturing a state displayed on the headless browser as the content image; The display method of claim 1 , comprising:
4. a server providing an HTML file for displaying content in a predetermined format on a first screen having a first resolution; a terminal that displays the content on a second screen having a second resolution based on the HTML file; Equipped with the server acquires a state in which the content is displayed on the first screen as a content image, and transmits the content image to the terminal; the terminal changes the size of the content image based on a ratio determined by the first resolution and the second resolution, and displays the content image after the change in size on the second screen. Display system.
Citation Information
Patent Citations
HTML5 protocol-based web page display method and apparatus
JP2016505911A