莫b

知识是网状结构的,每个人的知识结构认知是不同的,作者也不能将自己的信息架构灌输给读者,每日小知识可以很好的解决这个问题,对单点进行分析挖掘,首先可以研究的深一点,其实就是在实际设计中的应用,“学有所用”意味着能产生价值,有价值驱动才能走的更远。

字符

字符是一个信息单位,简单来讲就是一个汉字、假名、韩文字、标点符合、英文字母等。

 

提问

一个英文字母是一个字符吗?一个标点符号是一个字符吗?一个汉字是两个字符吗?设计中什么时候运用到字符呢?

 

答案

汉字、英文字母、标点符号、假名等都是一个字符。

很多人的概念中会把中文、英文与全角、半角关联起来,其实是不对的。工程师都会有基本认知。可以通过代码检测出汉字、英文字母、标点符号、假名对应的字符。我通过Bear软件进行测试:1、汉、?、A、a共9个字符数。

图片

那为什么汉字看上去要比英文字母和标点符号大?因为字节是用作计算机信息计量单位,一个英文字母占一个字节的空间,一个中文汉字占两到四个个字节的空间。中文汉字的字节空间取决于不同的字符编码形式。

 

字符编码

字符编码种类有ASCII编码、EBCDIC编码、GB2312编码、UTF-8编码、以及Base64编码。

国际通用的编码标准是UTF-8编码;其中GB2312编码是为了满足国内汉字的需求而开发的。

图片

如图前端代码中都需要定义字符编码标准的。

 

字符在设计中的应用

当登陆或注册、定义用户名时,需要定义input框输入的最大字符数。因为汉字空间大于字母空间,所以当定义最大字符数时,input输入框的宽度可以容纳汉字的最大字符数。

图片
图片

如图微信的用户名纯汉字为最大16个字符。

图片
图片

如图微信的用户名纯字母为最大32个字符。

图片
图片

如图微信的用户名中文加拼音有7个汉字和18个拼音,共25个字符。当名字保存后,名字字段被分成了两行了。这个我不知道是Bug还是规则没定义好,

其实是可以用定宽的方法去解决的。

图片

按照名字设置好的显示样式,可以按照汉字的最大字符样式定义最大框度,超过不在允许输入,个人信息页面也不会出现两行的特殊情况。

图片

如图上海公众交通卡的文字介绍红框就是内容展示信息的固定宽度,程序员会通过代码自动计算显示不下就…,解决了定义最大字符后容器宽度的问题。

微信为了满足更多用户的需求,在视觉美观度上会运用多套规则去定义,而在我们一般企业模块化和组件化后,再去根据业务推进设计(基于美学与用户体验需要多种规则实现的)就很难推进。产品在追求效率的同时,美学和用户体验也得跟上。目前国内C轮以下的企业真心很难推进。其实就是程序员口中的hardcode(硬编码)。

 

思考练习

QQ聊天输入框一次性允许输入多少个字符呢?

图片

 

致读者:

每日小知识符合当下碎片化的时代大趋势,但是碎片化是不适合学习的,也不能够让人专注,学习不够体系化,每日小知识会将一个主题进行系统化的切割,一周或两周就能形成一篇长文。

 

原文地址:水手哥学设计(公众号)

作者:水手哥

图片

转载请注明:学UI网 » 每日小知识—字符

登录收藏
 
你可能喜欢的:
为什么你做的设计都不咋好看?为什么你做的设计都不咋好看?
每日小知识—字号每日小知识—字号
设计师如何更好的跟需求方沟通设计师如何更好的跟需求方沟通
UI项目从0-1详解UI项目从0-1详解
UI面试宇宙最强指南UI面试宇宙最强指南
美团金融界面设计美团金融界面设计
十招PS技法,别讲武德直接用!十招PS技法,别讲武德直接用!
围绕深层次情感诉求的反馈设计围绕深层次情感诉求的反馈设计
【学UI网分享课】来了!准设计师筹备研讨会就在9月12日!!【学UI网分享课】来了!准设计师筹备研讨会就在9月12日!!
写给新人看的设计精华语录写给新人看的设计精华语录