Tagged articles
33 articles
Page 1 of 1
21CTO
21CTO
Nov 18, 2025 · User Experience Design

Explore Google Sans Flex: Free Open‑Source Variable Font

Google announced the open‑source release of Google Sans Flex, a free variable font with nine weight axes, customizable width and optical size, licensed under SIL Open Font License 1.1, usable in any commercial or personal project despite lacking Chinese glyphs.

SIL Open Font LicenseTypographyVariable Font
0 likes · 3 min read
Explore Google Sans Flex: Free Open‑Source Variable Font
IT Services Circle
IT Services Circle
Oct 19, 2025 · Frontend Development

How CSS text‑autospace Fixes Chinese‑English Mixed Typography

This article explains how the new CSS text‑autospace property automatically inserts proper spacing between Chinese characters and Latin letters or numbers, improving readability of mixed‑language web content and offering a simple, standards‑based solution with broad browser support.

CJKCSSTypography
0 likes · 5 min read
How CSS text‑autospace Fixes Chinese‑English Mixed Typography
Rare Earth Juejin Tech Community
Rare Earth Juejin Tech Community
Jan 26, 2024 · Frontend Development

Visual Hierarchy in UI Design: Using Font Weight, Color, and Layout to Emphasize Elements

This article explains how visual hierarchy in UI design can be achieved by strategically using font weight, color, and contrast instead of size, offering practical examples of emphasizing primary elements, weakening secondary ones, handling label-value patterns, and applying semantic HTML for clearer, more effective interfaces.

TypographyUI designcolor contrast
0 likes · 8 min read
Visual Hierarchy in UI Design: Using Font Weight, Color, and Layout to Emphasize Elements
Taobao Design
Taobao Design
Jan 9, 2023 · User Experience Design

How Variable Fonts Are Revolutionizing Design and User Experience

This article traces the history of variable fonts, explains their technical axes, and showcases a range of real‑world case studies—from dynamic brand identities and Olympic logos to climate‑awareness typefaces—demonstrating how variable fonts enhance readability, branding flexibility, and interactive user experiences across web, mobile, and physical media.

DesignTypographyUser experience
0 likes · 16 min read
How Variable Fonts Are Revolutionizing Design and User Experience
Alimama Tech
Alimama Tech
Sep 7, 2022 · Artificial Intelligence

How AI is Revolutionizing Chinese Font Design: Inside Alibaba’s Smart Font Lab

This article examines Alibaba’s AliMama “Smart Font” project, detailing how AI‑driven pipelines, few‑shot generation, and open‑source toolkits are used to create commercial Chinese typefaces, enable font subsetting, and explore dynamic and variable‑font technologies for modern digital media.

AIAlibabaTypography
0 likes · 16 min read
How AI is Revolutionizing Chinese Font Design: Inside Alibaba’s Smart Font Lab
Baidu MEUX
Baidu MEUX
Mar 25, 2022 · Mobile Development

Designing Elder-Friendly Mobile Apps: Research‑Backed Typography Standards

This article presents a comprehensive study on how to create senior‑friendly mobile app text layouts by defining ideal font sizes, line heights, and weight combinations through user research, eye‑tracking experiments, and a systematic evaluation framework.

Mobile UITypographyUser Research
0 likes · 9 min read
Designing Elder-Friendly Mobile Apps: Research‑Backed Typography Standards
Sohu Tech Products
Sohu Tech Products
Jan 5, 2022 · Frontend Development

Key Takeaways from the CSS Annual Report – Layout, Graphics, Interaction, Typography and Emerging Features

The article reviews the latest CSS Annual Report, highlighting popular layout techniques such as Flex, Grid and Subgrid, new graphic capabilities like shape‑outside and blend modes, interactive properties including scroll‑snap and container queries, as well as typography advances, preprocessors, frameworks, CSS‑in‑JS trends and award‑winning features, all illustrated with real code examples.

CSSGraphicsTypography
0 likes · 24 min read
Key Takeaways from the CSS Annual Report – Layout, Graphics, Interaction, Typography and Emerging Features
KooFE Frontend Team
KooFE Frontend Team
Dec 12, 2021 · Frontend Development

Mastering a Modern CSS Reset: 11 Essential Rules Explained

This tutorial walks through a custom CSS reset, explaining each of the eleven concise rules—including box‑sizing, margin removal, height handling, line‑height, font smoothing, media defaults, form inheritance, overflow handling, and root isolation—while providing clear code examples and visual illustrations to improve both developer experience and user accessibility.

Box-sizingCSSCSS Reset
0 likes · 18 min read
Mastering a Modern CSS Reset: 11 Essential Rules Explained
Baidu Geek Talk
Baidu Geek Talk
Sep 15, 2021 · Frontend Development

Technical Overview of Baidu Reading/Wenku Cross‑Platform Layout Engine

Baidu Reading/Wenku’s cross‑platform layout engine delivers professional book‑level typesetting on Android and iOS by using a single native engine that parses diverse formats into an abstract DOM, generates a memory‑resident layout description, and supports relative, multi‑directional, and reusable layout techniques for high‑quality, adaptive document rendering.

Layout EngineTypographycross-platform
0 likes · 11 min read
Technical Overview of Baidu Reading/Wenku Cross‑Platform Layout Engine
58UXD
58UXD
Jul 19, 2021 · Fundamentals

How 58.com Built the ‘Smile’ Chinese Font: A Step‑by‑Step Journey

This article chronicles the end‑to‑end process of designing and releasing the “Smile” Chinese typeface for 58.com, covering the challenges of creating a 3500‑character glyph library, the design philosophy, collaborative workflow, standardization tools, encoding, and the final launch.

Chinese charactersTypographycollaborative workflow
0 likes · 11 min read
How 58.com Built the ‘Smile’ Chinese Font: A Step‑by‑Step Journey
58UXD
58UXD
Mar 9, 2021 · Fundamentals

How to Create Stunning PPT Covers: Fonts, Colors, Backgrounds & Layout Tips

This guide explains how to design an eye‑catching PPT cover by mastering four key elements—text, color, background, and layout—offering practical font, color, and image recommendations along with free design tools to boost visual impact.

PPT designTypographycolor theory
0 likes · 6 min read
How to Create Stunning PPT Covers: Fonts, Colors, Backgrounds & Layout Tips
NetEase Cloud Music Tech Team
NetEase Cloud Music Tech Team
Sep 9, 2020 · Frontend Development

Understanding Font Metrics and Vertical Alignment for Accurate CSS Vertical Centering

The article explains why common CSS vertical‑centering tricks can leave pixel offsets when fonts differ, details how font metrics such as ascent, descent, and x‑height determine the true baseline, and provides a calculable vertical‑align offset method—while noting its metric‑gathering overhead and anticipating native Houdini support.

CSSFont MetricsTypography
0 likes · 16 min read
Understanding Font Metrics and Vertical Alignment for Accurate CSS Vertical Centering
JD.com Experience Design Center
JD.com Experience Design Center
Jul 1, 2020 · R&D Management

How JD Built Its Custom Brand Font: A Design R&D Case Study

This article chronicles JD's journey of creating a proprietary brand typeface—from the strategic need for visual consistency, through early DIY experiments and scaling challenges, to a professional partnership with Fangzheng, rule refinement, variable‑font prospects, and the broader impact on brand identity.

Corporate IdentityR&D managementTypography
0 likes · 13 min read
How JD Built Its Custom Brand Font: A Design R&D Case Study
Suning Design
Suning Design
Apr 9, 2020 · Fundamentals

Mastering Font Line Height in Sketch: Proven Rules for Perfect Mobile UI

This article explains how to set accurate font line heights in Sketch for mobile UI design, presenting single‑line and multi‑line formulas, practical examples, testing results, and verification steps to ensure consistent visual alignment across iOS, Android, and front‑end implementations.

MobileSketchTypography
0 likes · 12 min read
Mastering Font Line Height in Sketch: Proven Rules for Perfect Mobile UI
WecTeam
WecTeam
Oct 22, 2019 · Frontend Development

Mastering Font Choices: From Serif vs Sans-Serif to CSS Fallbacks

This article explains essential font knowledge for developers, covering serif and sans-serif classifications, CSS font-family groups, fallback mechanisms, font-weight behavior across platforms, and licensing considerations, helping teams make informed typography decisions.

TypographyWeb Designfont-weight
0 likes · 9 min read
Mastering Font Choices: From Serif vs Sans-Serif to CSS Fallbacks
360 Tech Engineering
360 Tech Engineering
Oct 9, 2019 · Fundamentals

TrueType Font Fundamentals: From Design to Rendering

This article explains how TrueType fonts are designed, digitized into FUnit‑based outlines, scaled to device pixels, and rendered through grid‑fitting and scan‑conversion, covering key concepts such as em squares, upem, ppem, instruction programs, and graphics state.

FUnitFont RenderingGrid Fitting
0 likes · 14 min read
TrueType Font Fundamentals: From Design to Rendering
流利说 Design Team
流利说 Design Team
Sep 10, 2019 · Fundamentals

Master the 4 Core Principles of Graphic Design: A Practical Learning Plan

This article presents a comprehensive graphic design learning plan that covers the four fundamental design principles, the role of proportion and grid systems, the effective use of point, line, and plane, and practical tips with visual examples to help designers build a solid design foundation.

Typographydesign principlesgraphic design
0 likes · 8 min read
Master the 4 Core Principles of Graphic Design: A Practical Learning Plan
58UXD
58UXD
Jun 12, 2019 · Fundamentals

Mastering Chinese Font Design: From Analysis to Visual Impact

This article outlines a practical workflow for Chinese typography, covering font analysis, selection, structural reconstruction, visual integration, and readability testing through real-world case studies, helping designers create compelling and recognizable text graphics.

Chinese fontsTypographydesign process
0 likes · 6 min read
Mastering Chinese Font Design: From Analysis to Visual Impact
58UXD
58UXD
Mar 6, 2019 · Frontend Development

Master UI Design: Proven Tips for Fonts, Colors, Shadows, and Whitespace

This guide shares practical UI design techniques—including font and size selection, color ratios, effective shadow usage, and strategic whitespace—to help designers create more refined, consistent, and visually appealing interfaces while avoiding common pitfalls.

TypographyWhitespacecolor theory
0 likes · 7 min read
Master UI Design: Proven Tips for Fonts, Colors, Shadows, and Whitespace
Yuewen Frontend Team
Yuewen Frontend Team
Jun 26, 2018 · Frontend Development

Why 16px Should Be the Default Font Size for Front‑End Design

The article explores how front‑end typography standards—covering base font size, font‑scale formulas, and line‑height rules—can be derived from visual ergonomics, mathematical ratios, and practical engineering constraints, ultimately recommending 16 px as the optimal base size and a line‑height of font‑size + 8.

Ant DesignCSSDesign Guidelines
0 likes · 17 min read
Why 16px Should Be the Default Font Size for Front‑End Design
网易UEDC
网易UEDC
Mar 26, 2018 · Fundamentals

Mastering Typography: How Font Choice and Layout Shape Effective Design

This article explores how careful font selection, Chinese‑Western typeface separation, punctuation spacing, and the four core design principles of proximity, alignment, repetition, and contrast together create clear, visually appealing typography for both small and large text blocks.

Chinese typographyTypographydesign principles
0 likes · 11 min read
Mastering Typography: How Font Choice and Layout Shape Effective Design
AntTech
AntTech
Jan 9, 2018 · Frontend Development

Ant Design 3.0: The Story Behind the Design System and Its Principles

The article recounts the first Ant Financial SEE Conf 2018, then details the conception, mathematical foundations, and practical implementation of Ant Design 3.0's design system—including design language, assets, typography, layout, and color—aimed at improving efficiency, consistency, and user experience for enterprise products.

Ant DesignTypographyUI
0 likes · 22 min read
Ant Design 3.0: The Story Behind the Design System and Its Principles
Hujiang Design Center
Hujiang Design Center
Jun 15, 2017 · Fundamentals

How to Quickly Identify Any Font: Tools, Tips, and Management Strategies

This guide explains practical methods for recognizing fonts on websites, in images, and printed materials, introduces useful browser extensions and online services, and offers recommendations for font management software and classification to help designers efficiently identify and organize typefaces.

TypographyWeb fontsdesign tools
0 likes · 14 min read
How to Quickly Identify Any Font: Tools, Tips, and Management Strategies
Aotu Lab
Aotu Lab
Nov 18, 2016 · Frontend Development

Understanding CSS font-weight: Numeric vs Keyword Values and Browser Matching

This article explains the differences between numeric (100‑900) and keyword (normal, bold, bolder, lighter) font-weight values, shows how browsers match unavailable weights using the CSS font‑matching algorithm, and provides practical examples and recommendations for developers.

TypographyWeb Developmentfont matching
0 likes · 9 min read
Understanding CSS font-weight: Numeric vs Keyword Values and Browser Matching
58UXD
58UXD
Apr 12, 2016 · Fundamentals

What Can Shanghai’s Historic Typography Teach Us About Modern Design?

This article explores how centuries‑old Chinese type design—from Shanghai’s Republican‑era metal type and post‑war trademark aesthetics to Hong Kong’s iconic neon signage—illustrates the subtle, experience‑driven creative process behind typography and its evolving role in contemporary visual culture.

Design HistoryHong KongShanghai
0 likes · 9 min read
What Can Shanghai’s Historic Typography Teach Us About Modern Design?
JD.com Experience Design Center
JD.com Experience Design Center
Jun 12, 2015 · Frontend Development

Unlocking Chinese Typography: A Beginner’s Guide to Fonts, History, and Web Use

This comprehensive guide explores Chinese font history, the distinction between simplified and traditional characters, major typeface families, the massive glyph counts required for professional fonts, and why traditional @font-face web embedding remains impractical, offering practical insights for designers and developers.

Chinese fontsDesignFont classification
0 likes · 14 min read
Unlocking Chinese Typography: A Beginner’s Guide to Fonts, History, and Web Use
Suning Design
Suning Design
Jun 18, 2014 · Frontend Development

5 Simple Rules to Make Web Text Readable and User‑Friendly

This article explains why many sites suffer from cramped, tiny text, traces the historical reasons, and offers five practical guidelines—standard font size, ample whitespace, appropriate line height, clear color contrast, and avoiding text‑as‑images—to improve web readability and usability.

TypographyUsabilityfrontend
0 likes · 7 min read
5 Simple Rules to Make Web Text Readable and User‑Friendly