Classifications

• • G—PHYSICS
  • G06—COMPUTING OR CALCULATING; COUNTING
  • G06F—ELECTRIC DIGITAL DATA PROCESSING
  • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
  • G06F16/90—Details of database functions independent of the retrieved data types
  • G06F16/95—Retrieval from the web
  • G06F16/957—Browsing optimisation, e.g. caching or content distillation
  • G06F16/9577—Optimising the visualization of content, e.g. distillation of HTML documents
• • G—PHYSICS
  • G06—COMPUTING OR CALCULATING; COUNTING
  • G06F—ELECTRIC DIGITAL DATA PROCESSING
  • G06F40/00—Handling natural language data
  • G06F40/10—Text processing
  • G06F40/103—Formatting, i.e. changing of presentation of documents
• • G—PHYSICS
  • G06—COMPUTING OR CALCULATING; COUNTING
  • G06F—ELECTRIC DIGITAL DATA PROCESSING
  • G06F40/00—Handling natural language data
  • G06F40/10—Text processing
  • G06F40/166—Editing, e.g. inserting or deleting
  • G06F40/177—Editing, e.g. inserting or deleting of tables; using ruled lines
• • G—PHYSICS
  • G09—EDUCATION; CRYPTOGRAPHY; DISPLAY; ADVERTISING; SEALS
  • G09G—ARRANGEMENTS OR CIRCUITS FOR CONTROL OF INDICATING DEVICES USING STATIC MEANS TO PRESENT VARIABLE INFORMATION
  • G09G2340/00—Aspects of display data processing
  • G09G2340/14—Solving problems related to the presentation of information to be displayed
  • G09G2340/145—Solving problems related to the presentation of information to be displayed related to small screens

Definitions

• the present invention relates in general to the technical field of data processing for displaying information on electronic communication terminals. More specifically, the invention relates to a rendering technique for Web browsers (X)HTML or CSS user agents (UAs) that is required to render readable Web pages, with limited or no horizontal scrolling, on devices with limited resolution.
• X Web browsers
• UUAs CSS user agents
• Opera's small-screen technology adapts a Web document to a small screen by sometimes drastically changing the document's design as intended by its author. Colors, fonts, design, and style are changed; document content is moved, scaled down, or sometimes removed. SSR assumes a small screen and leaves large areas of a medium-sized screen unused. SSR therefore works well on very small screens, for example mobile phones, but for medium- sized screens, for example PDAs, SSR is not a good solution.
• Another technology for presenting Web documents on smaller displays is TV centric layout. This solution attempts to display a Web page on a television display without using horizontal scroll bars, while preserving the look and feel of the Web page as originally contemplated by the designer.
• a method is used where a first , layout is received, with statistics for resolution, total width, and cell widths, and a second layout is then generated for display at a second resolution by comparing statistics from layout one with selected thresholds for layout two. The method then invokes horizontal shrinking (or growing) of cells in response to the comparison. If the second layout is not within the specified threshold, the process of cell reduction is repeated.
• the present invention Medium-Screen Rendering (MSR) differs substantially from this approach in many ways. Most importantly, MSR is not an iterative process. MSR does not need to compare layouts before reduction, nor calculate the width of for example the largest element or embeds within a non-breaking line or cell.
• a proxy solution is a server-side solution that alters Web content before it is served to the user agent electronic device.
• Drawbacks with this method are that it slows down surfing and users must in some way subscribe to the service. Further, the service provider must purchase a software solution, and the quality of the solution is not necessarily better than client-side solutions.
• Local software content transfonnations is a client-side solution that resembles a server-side solution in that a transformation is performed before content is served to the UA, but it is done on the client. This requires installing additional software on the device. It will also require more system resources (e.g. memory and CPU), which may slow down surfing.
• the present invention uses a new approach for presenting Web pages (e.g. HTML or XHTML) on medium-sized screens.
• Web pages e.g. HTML or XHTML
• the main object is to present a scaled down version of the original Web page on a medium-sized display, while maintaining the look and feel of the original Web page.
• the solution developed is called Medium- Screen Rendering (MSR).
• MSR can be used on devices of all kinds that share among these aspects: Device renders markup language (e.g. HTML, XHTML, XML, WML, cHTML, HTMLP etc.); Markup can be styled, for example using Cascading Style Sheets (CSS); Media output (e.g. viewing area) ranges between approximately 300 and 800 pixels in width, or is smaller than the media output for which the markup was initially designed. Horizontal scrolling is impossible or not desired.
• CSS Cascading Style Sheets
• the necessary changes to Web pages are done by a Web browser embodied on a client and not by a proxy server or client-side content- transforaiation software before serving the Web page to the client.
• the invention can typically be used on, but is not limited to, TVs, PDAs, PCs. or smart phones with medium-sized screens, or even printers.
• the object of the present invention is to render markup documents within the limits of resolutions smaller than the resolutions for which documents were originally designed, in most cases without introducing horizontal scrolling.
• the object is achieved by redefining elements in the document while keeping the original fonts, colors, design, and style.
• the invention finds content that takes up too much horizontal space and squeezes horizontally or shrinks these page elements (boxes) individually. Original fonts and colors are kept, and the design and style is left virtually untouched. In this process, very little of the design and style (e.g. CSS rules) is changed.
• the method may, if necessary, attempt to move document content (boxes) to avoid unused (empty) screen space.
• the end result is a presentation of the markup document that is very close to the original design, but that fits on a medium-sized resolution (e.g. a screen).
• Fig. 1 is a diagram that shows screen sizes in pixels and a typical rendering method.
• Fig. 2 shows three different rendering methods and the resulting presentation.
• Fig. 3 is an example of typical Web pages designed for viewing on a PC screen.
• Fig. 4 is an example of how the Web page in figure 3 will be presented on according to the invention.
• Fig. 5 is a flow chart of an embodiment of the invention.
• Fig. 6 is a diagram that illustrates a system using the inventive method.
• Figure 1 is a diagram showing screen sizes in pixels and a typical rendering method.
• Small-Screen Rendering SSR is typically used on electronic devices with a screen resolution between 120 to 350 pixels, for example smart phones.
• MSR Medium-Screen Rendering
• Figure 2 shows three different examples of rendering methods and the resulting presentation.
• the first example shows how a typical menu, if it consists of a line of non-breaking images contained in a single table cell, is presented as intended on a display with 800 pixels.
• the next example shows how the same menu will look when using the "Just Fit" method to render the Web page on a display only 580 pixels wide. This method will introduce line breaks between non-breaking elements.
• the third example shows how the same menu will look when viewed on a display with 580 pixels using a browser that has implemented the method according to the present invention.
• the menu will look like the menu in the first example.
• MSR will identify the entire line of non-breaking images, and shrink the images without breaking the line.
• Figure 3 shows an example of two typical Web pages designed for viewing on a PC screen. Horizontal scrolling is introduced because the documents cannot fit within the available space (approximately 640 pixels). A typical Web page will have a specific layout and contain for example text, images, and form controls. Pages can be designed using for instance tables, special HTML elements, element attributes, CSS, or by combining these methods.
• Figure 4 shows the same Web pages as shown in Figure 3, except that they are rendered using the MSR technology. No horizontal scrolling is necessary even though the documents are rendered on a display with a smaller resolution (fewer horizontal pixels) than the Web pages were originally designed for. The look and feel of the original Web pages is retained.
• Figure 5 is a flow chart of one embodiment of the present invention. The flowchart shows the different steps that are included in the inventive method. Even though these steps are listed in a sequence, the order may be different and some or all of the steps can be performed at the same time. The figure thus represents an example.
• the first step is to read a document (e.g. (X)HTML) in step 510, and in step 520 decide whether it is necessary to perfomi a Medium-Screen Rendering (MSR) of the document, or parts of the document, according to the inventive method.
• a document e.g. (X)HTML
• MSR Medium-Screen Rendering
• MSR may be necessary if the document is to be read on a display with a resolution lower than the document is designed for. MSR can be triggered automatically (to avoid horizontal scrolling), or toggled from a user interface. If it is not necessary to use MSR, the Web page will be rendered normally.
• steps 530 to 570 will be implemented.
• One step 530 is to modify the CSS properties by ignoring certain elements when sizing table cells.
• W pre f is the preferred cell width - the width of the cell prior to taking other cells into account.
• W pre f of each cell in the table is used when calculating the final width of each column. (Exactly how this is performed is outside the scope of this discussion.)
• W is the available width - typically the widths of the containing block (a CSS term); this is the amount of room into which the cell can expand.
• W max i is the maximum intrinsic width - the width found by conceptually following the following steps: - Set the width to infinity, - Lay the cell contents out. This should result in the fewest number of line breaks possible, - Shrink the width until either the number of line breaks increases, or the amount of overflow increases.
• W min i is the minimum intrinsic width; the width found by conceptually following the following steps: - Set the width to the maximum intrinsic width, - Lay the cell contents out. This should result in the fewest number of line breaks possible, - Shrink the width until the amount of overflow increases, allowing lines to break as required.
• step 540 a calculation of minimum width of table cells is perfon ⁇ ied.
• Opera's Medium-Screen Rendering technology changes the algorithm described above by always assuming that replaced content, for example iframes, images, plug-ins, applets, and forai elements, should have no influence on the calculation of W m i portrait j .
• the Web browser with MSR technology will allow a table cell to shrink, if necessary to avoid horizontal scrolling, even if the width of the replaced content then exceeds (overflows) the width of the containing table cell.
• Width of table cells is also set to auto; an author's request for a (minim ⁇ m) table- cell width is therefore not considered when calculating a minimum width.
• width is still used when available space is distributed between cells (or columns), and when maximum width is calculated.
• the width of the screen on the device with a limited display will define the new width of the table cells in the horizontal direction.
• content can force for example table cells to increase in size.
• the maximum width of child elements is set to equal the width of their containing element (i.e. a maximum width of 100%), it is ensured that elements do not overflow their containing block.
• MSR reduces for example a table cell's width to a value that is smaller than the original width, and the content of that cell exceeds the cell's new boundaries, the MSR browser functionality will shrink the content of that cell until it fits without overflowing.
• Content that is not placed inside tables is also shrunk or squeezed (i.e. squeezed without maintaining aspect ratio) to avoid overflow. Therefore, if, for example, a document window, even when maximized to use all available screen space, contains a document that was designed for a resolution higher than the available resolution, • Opera's MSR functionality will squeeze the entire document and individually shrink, squeeze, or move its content as deemed necessary to force-fit the document within the available space. If an element already has a maximum width of less than 100% of its containing element, or a width that is set to auto, the browser with MSR implemented will not change it unless further size reduction is necessary. If images are scaled down to fit within their containing block, they are scaled both horizontally and vertically to preserve the aspect ratio.
• a repositioning of page elements positioned outside the width, of the screen is performed to avoid horizontal scrolling. This is done by: - Identifying the page element, - Analyzing the element with regard to size and functionality, - Approving or disapproving the element for repositioning, - Repositioning the element (if approved) either based on where it occ ⁇ rs in the markup (document source), or at the top or bottom of the Web page.
• a resizing of non- wrapping content is performed. Where more than one element is inside the same parent element (e.g. a table cell), and they do not wrap, setting a maximum width of 100% on each element may result in overflow of the containing box.
• MSR shrinks the entire non-breaking line of elements (typically several images in a menu inside the same table cell) to fit inside the containing box.
• MSR may introduce an extra (invisible) element that is used to calculate the new size of the non- wrapping content.
• an emergency wrapping of text is performed.
• the values of the CSS "white-space" property are mapped as follows:
• the Opera browser will override authors and turn the "nowrap" property off.
• letter spacing is decreased by one pixel if the initial value is greater than -1.
• the wrapping behavior is modified to allow emergency wrapping in the middle of words (i.e. splitting up words where one normally would not), when nonnal wrapping would fail to avoid overflow or horizontal scrolling. This modified text wrapping is necessary in MSR to avoid overflow and horizontal scrolling, and allows for smaller minimum widths in for example table cells and columns.
• step 580 the resulting page is displayed on an electronic device.
• Opera When Opera combines the MSR way of calculating minimum widths with other MSR functions (as described above), Opera can, in most cases, render a document (Web page) very closely to the original in style and layout, on a medium-sized screen, without introducing horizontal scrolling.
• the MSR functionality can be turned on and off from the user interface, or set to auto. If MSR is set to auto, the Opera browser will turn MSR on to avoid horizontal scrolling.
• MSR can be disabled for documents that have been coded for handheld devices or TVs: - Special markup languages such as WML, XHTML MP, and cHTML - Styling for handheld or tv media (@media handheld or @media tv)
• FIG. 6 is an overview of a system and electronic device 640 implementing the inventive method.
• a Web document 630 written for viewing on a first screen 615 on a for instance a PC 610 is received through the Internet 620 on an electronic device 640 with a smaller display 680 than the Web document 630 is designed for.
• the Web document is received by receiving means 675 in the electronic device 640, and read by a Web browser 650 loaded into a memory 660.
• the Web browser is provided with a module with separate functions 655 for redefining elements in a Web document 630 so it will fit on a smaller display 680 while reducing horizontal scrolling to a minimum.
• the electronic device 640 comprises a processing unit 670 that is arranged to perform the functions according to the inventive method.
• the inventive method is implemented in a web browser capable- of modifying and presenting content in a web document adapted to the physical characteristics of the display of the electronic device 640. .

Landscapes

• Engineering & Computer Science (AREA)
• Theoretical Computer Science (AREA)
• Physics & Mathematics (AREA)
• General Engineering & Computer Science (AREA)
• General Physics & Mathematics (AREA)
• Audiology, Speech & Language Pathology (AREA)
• Computational Linguistics (AREA)
• General Health & Medical Sciences (AREA)
• Health & Medical Sciences (AREA)
• Artificial Intelligence (AREA)
• Databases & Information Systems (AREA)
• Data Mining & Analysis (AREA)
• User Interface Of Digital Computer (AREA)
• Controls And Circuits For Display Device (AREA)
• Document Processing Apparatus (AREA)

Applications Claiming Priority (3)

Publications (1)

Family

ID=34467902

Family Applications (1)

Country Status (3)

Families Citing this family (9)

Citations (3)

Family Cites Families (6)

• 2004
  • 2004-10-13 JP JP2006536470A patent/JP2007509402A/ja active Pending
  • 2004-10-13 EP EP04775085A patent/EP1685502A1/de not_active Withdrawn
  • 2004-10-13 WO PCT/NO2004/000307 patent/WO2005038673A1/en not_active Ceased

Patent Citations (3)

Non-Patent Citations (1)

Also Published As

Similar Documents

Legal Events