网页主页设计字体规范 第1篇
① 新建画布
② 页面尺寸：1000px * 768（内容区域）
1440 px 比较常用
1920 px 比较流行
2560 px 苹果 MAC 27 寸适用
③ 分辨率：72
④ 颜色：RGB 8 位
网页主页设计字体规范 第2篇
网页设计规范包括用户友好的 界面设计、一致的 导航结构、易读的 内容排版、合适的 配色方案 和 响应式设计 等。这些规范旨在提供良好的用户体验，确保网页易于浏览和操作，并在不同设备上保持一致的外观和功能。
网页主页设计字体规范 第3篇
字阶和行高决定着一套字体系统的动态与秩序之美。字阶是指一系列有规律的不同大小的字体。
字阶定义一级字阶和二级字阶,一级字阶常用于基础组件的设计中,二级字阶用于标题及特殊场景的应用。
每个字号以2px增长。桌面面端中,正文字号我们设置为14px,最小字号是12px,而10px则作为移动端的Base字号号,将桌面端与移动端字阶统一处理,让两端文字与设计系统更一致,更标准地调控。
为了减少字阶区间里的步数,在这个范围中的文字,多为模块超大标题,展示型文案,以数字数据展示为主。通过+4,+8,+12,+16的步数增长规律,满足文字层级跨度大的展示诉求,也减少没有必要的小步数字号。
建议在一个系统设计中(展示型页面除外),字阶的选择尽量控制在3-5种之间,保持克制原则。
字阶和行高决定着一套字体系统的动态与秩序之美,行高可以从理解为一个包裹在字体外面的无形的盒子。
关于文字的行高,css属性当中的line-height,在国际无障碍网页使用标准中给出了明确的指引line-height=font size*
在验证过程中发现,固定倍的行高比例,在当字号越大的时候,行高就会越大,在大号文字的展示上信息的连贯明显得出现割裂,尤其在多种字号及元素混排的场景中。
行高是为了让上一行的文字和下一行的文字之间有呼吸的空间,基于呼吸空间一致,让不同字号之间的间距都保持相同,通过逻辑得到这样一个公式:「行高=字号+n」,8作为变量正好同时满足与「14px&16px」常用的倍行高保持一致,总体文字间隙稳定呼吸,行高空间较一致得出计算公式:「行高=字号+8」
字重是重要排版的变量,可以增强层次结构和重要内容区分。字重的选择同样基于秩序、稳定、克制的原则。多数情况下,只出现两种字体重量,regular以及medium/bold,分别对应代码中的400和500/700。
作为网页设计师,要了解字重(font-weight)在CSS中的取值以及子重和字体类型的对应 关系,才能个前端开发工程师更好的沟通。
*在英文字体加粗的情况下会采用semi bold的字体重量,对应代码中的600,用来平衡中文字重的500。
文字颜色多以中性色为主,当文字赋予特殊功能后,可选择不同的功能色。具体使用参考web视觉规范03-B端色彩体系
写在最后,设计规范可以让我们在做设计时更有逻辑依据,组件方便调用、提升效率,还可以作为走查依据。web设计规范系列章节结合大厂设计规范（antdesign、Tdesign等）以及实际工作经验整理的心得笔记。在此分享给大家,希望能给您带来帮助。 我们下一篇见《web设计规范06-图标规范》
网页主页设计字体规范 第4篇
① 页面布局：header、banner、main、footer
② 常用字体：宋体 - 无（12-14px），无版权，可以免费使用
微软雅黑 - 锐利（12-14px），有版权，商用要购买版权
③ 特殊字体：方正字体、汉仪字体（有版权，商用要购买版权）
④ 广告法禁用词汇：禁止使用 “国家级”、“最高级”、“最佳” 等用语
字体介绍
字体具有多种不同的风格，每种风格都适用于不同的场景和用途。以下是一些常见的字体风格及其适用场景的简要介绍：
① Regular（常规）：常规字体是字体家族中最基本和常见的风格。它适用于大多数正文文本和一般排版情况，也被称为普通字体或标准字体。
_Regular_ 字体风格通常具有中等的笔画粗细和一般的字形设计，没有特别的修饰或强调。它是字体家族中的默认样式，用于大部分正文文本和一般排版的情况。其他字体风格，如_bold_（粗体）、_italic_（斜体）和_light_（轻体），通常是基于 _regular_ 样式进行变化和扩展的。因此，当你选择一种 _regular_ 字体时，你会得到一种中等粗细的字体，适合在大多数正常文本场景中使用。
② Bold（粗体）：粗体字具有更加明显的笔画粗细，用于突出和强调文字内容。它通常用于标题、子标题、重要的关键词或需要引起注意的部分。
③ Italic（斜体）：斜体字具有文字向右倾斜的外观。它常用于强调特定文字、引述、书名、科学名称或外来语词汇。斜体字也可以用于添加一些倾斜和动态感觉。
④ Light（轻体）：轻体字较为细薄，通常用于辅助排版、注释、引用等较小的文字内容，或者在需要柔和、优雅的设计风格时使用。
⑤ Thin（细体）：细体字比轻体更加纤细，适用于特定的设计风格，如时尚、艺术或品牌标识等。
⑥ Black（黑体）：黑体字非常粗黑，用于需要极强视觉冲击力和醒目效果的场景，如大标题、标语、海报等。
⑦ Condensed（紧缩体）：紧缩字体具有较小的字符间距，用于在有限空间中显示更多文本内容，例如窄栏排版、标签、报纸标题等。
⑧ Extended（加宽体）：加宽字体具有较大的字符间距，用于强调宽敞、稳重或霸气的设计风格，例如大字标题、商标等。
⑨ Decorative（装饰性字体）：装饰性字体具有独特的造型和装饰元素，适用于特殊场合和创意设计，如节日活动、广告、标志等。
这些只是一些常见的字体风格示例，实际上还有许多其他独特的字体风格和变体可供选择，以满足不同的设计需求和品牌风格。选择合适的字体风格取决于文本内容、排版需求、品牌风格和目标受众等因素。