Mobile Terminal Font Scaling via Render Tree Segmentation
Find Innovative SolutionsGenerate Solutions
Solution Overview
Problem
Traditional mobile terminal browsers struggle to display traditional web pages clearly due to font size issues, often requiring page scaling that leads to poor user experience, either through excessive width or layout changes, when viewing on smaller screens.
Innovation Solution
A method and device that categorize underlying block nodes in a web page's render tree and apply different font scaling coefficients based on block width and screen width, allowing for precise font size adjustment without dynamic rearrangement, ensuring clear display without layout changes.
Engineering Contradictions & Design Principles
Engineering Contradiction Analysis
1Measurement precision
If a scaling process is applied to make fonts clear on mobile screens, then font clarity is improved, but the page width becomes much larger than the actual screen width, requiring frequent horizontal scrolling
Solution Approach 1:
The patent segments the page into multiple line groups, where each line group contains lines that can be displayed within the screen width after scaling. This segmentation allows the system to apply scaling locally to each line group rather than to the entire page, thereby improving font clarity while preventing excessive overall page width expansion that would require horizontal scrolling.
Solution Approach 2:
The patent transitions from a horizontal layout approach to a vertical layout approach by arranging scaled line groups sequentially in the vertical dimension. This dimensionality change allows the page to adapt to mobile screen constraints by flowing content downward rather than requiring horizontal space, thus resolving the contradiction between font clarity and horizontal scrolling needs.
2Ease of operation
If a wrapping process with rearrangement is applied to ensure full page display within screen width, then horizontal scrolling is eliminated, but the response rate is compromised and the original layout is altered
Solution Approach 1:
The patent performs preliminary calculations during the rendering process to determine the scaled width of each line and identifies which lines can be grouped together within the screen width. This preliminary action allows the system to prepare the line groupings in advance without requiring time-consuming rearrangement operations after rendering, thus maintaining high response rate while eliminating horizontal scrolling.
Solution Approach 2:
The patent implements a dynamic line grouping mechanism that adapts to different screen widths and scaling coefficients. The system dynamically determines which lines can be grouped together based on their scaled widths, allowing the layout to flexibly adjust to various display conditions without requiring rigid pre-defined rearrangement rules, thereby maintaining both fast response and horizontal scrolling elimination.
3Measurement precision
If different scaling coefficients are applied to achieve clear font display, then font clarity is improved, but different page layouts are generated causing user discomfort
Solution Approach 1:
The patent applies local quality by allowing different scaling coefficients to be used for different line groups based on their specific content and width requirements, while maintaining overall layout consistency through a unified rendering framework. This approach enables optimal font clarity for each line group without causing drastic layout variations, as the scaling is applied locally rather than globally to the entire page.
Solution Approach 2:
The patent changes the scaling coefficient parameter dynamically based on the specific characteristics of each line group (such as text content, line length, and importance), while constraining these changes to maintain overall layout stability. By carefully controlling parameter changes within reasonable bounds and using them judiciously, the system achieves improved font clarity without generating drastically different page layouts that would cause user discomfort.
Data Source
AI summary
Techniques for scaling font size of a page in a mobile terminal, such as a method including: parsing a page of a web page acquired from a content server, and acquiring the block width and the size of a style font of each underlying block node contained in a render tree of the parsed web page; based on the acquired block width of each underlying block node and the width of a screen of the mobile terminal, determining a font scaling coefficient of each underlying block node; and based on the determined font scaling coefficient of each underlying block node and the size of the style font, scaling the style font of each underlying block node. Advantageously, an enlarged window can completely display a content block and a font can be displayed clearly, without a need to slide the screen to the left or right side.