手机网页设计规范（网页设计手机界面设计）

本文目录一览：

• 1、PC端和移动端网页设计的字体规范是什么?
• 2、ui设计原则
• 3、移动端界面设计常识规范
• 4、手机网页设计排版需要注意的几个事项

PC端和移动端网页设计的字体规范是什么?

网页端 常用的字号有哪些呢？ 网页中文字字号一般都是宋体12px或14px（无状态），大号字体用微软雅黑或黑体。大号字体是18px、20px、26px、30px，一般使用双数字号，单数的字体在显示的时候会有毛边。

PC端网页当中默认字体为宋体，我们再设计时候需要注意最小中文字12像素必须选择宋体，字的属性选择无。因为中文字只有12像素宋体效果无才能看清。大于114我们一般用黑体。最小英文Arial可以是9像素一般很少用。移动端ios我们设计字体为苹方，安卓我们就用黑体就可以。

字体排版规范 最佳易读性规范 行宽 传统图书排版每行最佳字符数是55—75，实际在网页上每行字符75—85更流行。

- 页脚文字使用12号或14号字体；- 正文中的大标题字体大小为24至32号；- 标题文字建议使用18px、20px、24px、28px或32px，尽可能选择双数大小；- 按钮文字大小为14至16号，根据实际情况可调整。

在每个项目设计中只使用1-2个字体样式，而在品牌字有明确的规范的情况下，只需要一种字体贯穿全文，通过对字体放大来强调重点文案。字体用的太多，越显得不够专业。

黑体一般是14号，因为一般很少用黑体做正文，主要都是标题或者是关键字。英文网页一般用11px字号，常用的字体是tahoma与verdana这两种！特别是verdana，是最经典，最好用的字体！在这个显示器百花齐放的时代，网页设计师往往需要考虑不同客户端的浏览体验。文字大小，是用户体验中的一个重要部分。

ui设计原则

．安全性：用户能自由的作出选择，且所有选择都是可逆的。在用户作出危险的选择时有信息介入系统的提示。10．一致性：是每一个优秀界面都具备的特点。界面的结构必须清晰且一致，风格必须与游戏内容相一致。UI设计的所有原则都应该围绕用户来体验，其最终目标是实现用户体验完美实现。

保持清晰的UI界面设计并不难，首先要保证按钮和操作的标签文字指向性要明确，保持清晰的信息传递，让用户能够快速弄明白交互的指向性。尽量不要在UI中使用冗长、复杂、难以记住的文本标签，越复杂就越会影响整体的用户体验。

简易性 界面的简洁是要让用户便于使用、便于了解产品，并能减少用户发生错误选择的可能性。用户语言 界面中要使用能反映用户本身的语言，而不是游戏设计者的语言。记忆负担最小化 人脑不是电脑，在设计界面时必须要考虑人类大脑处理信息的限度。

UI设计需要遵循的基本原则：使用8的倍数 我们使用8而不是5的原因是，如果设备的分辨率为5倍，则无法正确呈现奇数。此外，绝大多数设备屏幕尺寸都可以被8整除，从而可以轻松地在这些设备上适当地调整UI设计。通过在网格上以8的倍数进行UI设计，可以保持设计的一致性。

可见性原则 可见性原则要求系统的操作方式和状态应该清晰地呈现给用户，让用户随时掌握系统的当前情况和下一步操作所产生的结果。这意味着界面设计必须保证具备显著的视觉效果和交互反馈机制，以及不遮挡内容的大量空间。

一致性原则 坚持以用户体验为中心设计原则，界面直观、简洁，操作方便快捷，用户接触软件后对界面上对应的功能一目了然、不需要太多培训就可以方便使用本应用系统。准确性原则 使用一致的标记、标准缩写和颜色，显示信息的含义应该非常明确，用户不必再参考其它信息源。

移动端界面设计常识规范

1、简单突出 从移动端有限的屏幕以及页面加载速度这两方面来考虑，相较而言越简单的排版会越容易引起关注。这是因为我们的大脑一开始看到这种简洁排版，会立刻出现“嗯我可以马上看完不费劲”的潜意识信息而带着轻松的态度去阅读。

2、例如，当某款APP对用户的吸引力逐渐降低或用户有其他APP使用需求时，我们不妨采用动态悬浮的模式，暂时放弃对用户的注意力要求，使APP本身在当前移动端屏幕上处于次要被关注的状态，以退为进，共享屏幕，等待用户下次被感兴趣的内容吸引。

3、位置位置的存在同样能彰显层级的不一样，在圆圈之内，中心位置的东西比边缘部分的看起来更重要，位于轴线顶端的控件会显得比其他部分的优先级更高。以设计应用Path的设计为例，时间轴顶点处的用户头像就明显比时间轴上的其他部分更重要，而这个地方正好展示的也是用户头像。

4、手机UI设计的基本规范 大家都知道手机采用的：一个是苹果的iOS系统，另一个就是谷歌公司的安卓系统。华为的鸿蒙系统虽然早就上线，但是还没有真正运用在手机移动端上，小阿在这里期待着，希望有一天也能写“华为‘鸿蒙系统’的界面尺寸规范。

手机网页设计排版需要注意的几个事项

手机网页设计注意事项：网页的结构布局和整体规划现在社会大多数手机用户，都不喜欢通过pc端来登录网站，往往最快捷的方式便是通过手机登录网页，所以网页作为大家首先步入眼帘的一个板块，设计者在手机网页设计方面更加要别具匠心，这样才能收获流量，获得盈利。

安全宽度与扩展区域让页面适应主流分辨率 与PC上网页的做法一样，确定一个安全宽度，把重要信息控制在640PX宽度内（以iphone分辨率为安全宽度。目前主要浏览器在iphone4S下的首屏高度如下，可以根据具体页面投放的渠道做相应的首屏高度。

页面不宜过大 设计者应注意网页的页面大小不要超过20KB，页面如果太大会消耗用户更多的流量。注意屏幕规格 手机一般都可以用横屏和竖屏两种方式浏览网页，设计者应注意横向和纵向的区别设计两种规格的尺寸。以上就是小编给大家总结的关于设计手机网站时设计者要注意的五点事项。

手机网页设计要注意的事项有：图片少用PC站因为用电脑看，整个屏幕会比较大，如果图文并茂，图片多一点会显得更加美观，增加访问量，但是这种模式不适用于手机网站，因为手机站屏幕比较小，看的东西有限，再加上手机站如果使用太多图片，会耗手机流量，影响用户体验度。