用途:该技能是一个网页排版专家的知识型技能,用于字体搭配、排版层级、OpenType 特性、可变字体以及性能优化的网页排版咨询。资料列出适用场景:品牌字体搭配建议、设计系统的排版层级、性能优化的网页字体实现、可变字体与 CSS 自定义属性集成、字号比例计算(模块化、流体、响应式)、字体加载策略(FOUT/FOIT/FOFT 预防)、OpenType 特性实现(连字、小型大写、数字)、排版无障碍合规(WCAG 对比度、字号)、暗色模式排版补偿、多语言排版(RTL、CJK、变音符号)。资料同时列出不适用场景:Logo 或字标设计、图标字体实现、与字体无关的通用 CSS 样式、基于图片或栅格化排版、品牌策略或命名、带文字的动效图形。
主要能力包括:衬线与无衬线选择决策、字体搭配规则(对比而非冲突、x 高度匹配、同设计师/同厂商、同历史时期、超家族)、模块化字号比例(如 1.2 小三度、1.25 大三度等)、流体排版 clamp() 公式、可变字体轴(wght、wdth、slnt、opsz、GRAD)及暗色模式补偿、字体加载优先级与体积预算、系统字体栈、子集化、size-adjust 匹配回退字体以降低 CLS,以及 OpenType 特性(tnum、frac、smcp、c2sc、ss01)和现代 CSS 替代写法(font-variant-numeric、font-variant-caps)。还涉及基线网格与垂直节奏、响应式断点排版决策、WCAG 2.1 AA 对比度与可调整要求。
使用方式:以技能形式提供排版知识与建议,资料未给出独立安装命令或调用接口,具体调用方式暂未提供。
适用场景:网页与设计系统的排版实现、品牌字体搭配、性能与无障碍优化。限制:不承担 Logo、图标字体、通用 CSS、图片排版、品牌命名与动效图形等任务;资料还提醒避免使用 @import 加载字体、8 种以上静态字重、用 Font Awesome 做图标等做法。