转自:中国建站 www.jz123.cn
在设计中可以使用许多数学公式,比如常用的黄金分割比就是其中之一。在网页设计布局中,我们也能通过精密的计算来获得理想的排版比例,本文将介绍使用数学中的“模数”来计算网页布局大小,从而获得更为合理的布局。
在IT工业中,内置标准、国际标准、国家标准才是真正意义的规范、而在应用领域(包括web应用的开发)的开发中,标准是各自为政乱七八糟的,微软如果不考虑市场和经济利益也不是不吊这些标准的。我不得不汗一个。
二、模数网页设计中的应用
好了,鄙视完小儿科的网页设计,我们来谈谈“模数”在网页设计中的用途。
(一)网页设计中的尺寸单位
网页设计中的尺寸单位有那么几个:em ex px pt pc in cm mm %
最常用的就是px(像素),因为这个单位与图片单位可以互通,所以常用。
(二)网页设计中的常用模数
(1)最常用的是100、10、5的倍数
比如分栏的时候,满宽式950px,左栏式180px,栏与栏之间的间距是10px、15px、20px
(2)模数要尽量取整或末位为偶数
这里要在提一下模数中有个概念就是,不满足常用模数的,位数尽量要用偶数,为的避免歧义和好记。还有个道理是,一律取偶数,那么按组件的偶数量组合顺序,叠加结果一定是偶数,末尾加再加个组件一定是奇数了,这样好判断是否有错。
比如你的图片宽是231px,为啥不舍1取整为230px;
再比如你的图片高时237px,你可以取235px、236px、238px
(3)使用模数的好处——轻松获得秩序美
这个世界上什么是美?是秩序。看看元素晶体、看看飘落到你手中尚为融化的雪花、看看人类的基因螺旋结构,这些微观世界的东西,凝练了美得本源。而自然界、动物界、乃至宇宙星系,由于其包含了杂志和不断地衰减变化,这种“美”只是表象。
人之所以是人,就是在一直探索事物的本源。并不断提炼还原美的本质。在中世纪人们迷恋于几何,在现代人们充分将其提高到工业设计中。工业设计是以规范标准和计算设计为基础的,升华成一套追求完美的秩序。形成秩序的模数,是一个递增量,这个增量可以是倍数、方根、幂、圆周率、素数、或以个方程式等等。而倍数恰恰是形成秩序的一种最简单的方法。所以在工业设计中,尤其是建设设计中大量运用了倍数来充当模数。
现在我们有了简单的倍数类模数,那么这个模数又是怎么把美体现出来的呢?
你说我感觉不到啊。答对了,模数美的确是人无法直接一下感受到的。因为这种美不仅仅体现在感官上,还体现在设计制作开发过程中,它不仅提高了制作效率,减小了莫名其妙的累计误差,还把一种整体的设计美蕴含在整体作品中,它的美是整体美和局部美一种相互转换。更直白点,你会在网页中感受到一种工业设计的“精致”和“用心”,反过来说,一个界面中的模块之间的间距或某模块四个边界与其内容的间隔,一会是8px,一会是12px,一般用户一定会在潜意识中感觉不精致,因为设计者没有用心,没有用模数把秩序美设计进去。
有多少UI设计师不懂得啥是模数呢?
有多少UI设计师因为不用模数而使整个网站缺乏设计美呢?
有多少UI设计师即便是在局部或某组建用了符合秩序的倍数,但没有在整页布局和整站中是使用统一的模数呢?
用你的眼睛细心观察,用放大镜去研究,用心灵去感受,你就知道你的设计师是什么水平了。
(4)不被模数所束缚
上面一直说模数要用倍数,要用偶数。要活血活用啊,一旦秩序美的追求与效率和规范冲突,哪就放弃模数。比如即成的国际标准小logo图片的尺寸是88*31px,你非得为了符合模数而不遵循国际通用标准而改成88*30px吗?
题外话,除了模数,IT工业还有其内置的一套标准,我也懒得去管他,比如图片和头像大小,有其一套特殊的模数,16*6、24*24、 32*32、48*48、64*64、128*128,你要是非得破坏这个标准而改成15*15、25*25、030*30、50*50、65*65、 130*130,我就真无语了。
咦,我发现paidai的头像,居然是50*50px,呵呵。看来表现层不必非得拘泥于模数。
设计美就是这么简单,你必须用计算器来布局!
分享到:
相关推荐
通信系统原理:第07章 模数转换.ppt
数字电子线路基础:第九章 模数与数模转换.ppt
数字电路与逻辑设计:CH9 模数及数模转换技术.pdf
DSP原理与实践-基于TMS320F28x系列:第8章 模数转换器(ADC).ppt
单片机C语言程序设计20 ADC0809模数转换与显示(基于8051+Proteus仿真)单片机C语言程序设计20 ADC0809模数转换与显示(基于8051+Proteus仿真)单片机C语言程序设计20 ADC0809模数转换与显示(基于8051+Proteus仿真...
宽带射频 (RF) 接收器有助于极大提升无线电设计中的灵活性。较宽的瞬时带宽支持灵活调节而无需改动硬件且能够以间隔较大的频率捕获多个通道。 此参考设计介绍了一个宽带射频接收器,该接收器利用 4 GSPS 模数转换器 ...
模数清单:aplicacióncon模数清单
PCF8591:模数/数模转换芯片,是一个单片集成、单独供电、低功耗、8-bit CMOS数据获取器件,具有4个模拟输入、1个模拟输出和一个串行IIC总线接口。原理图如下: 1个模拟输出:AOUT引脚,接在外部排针OUT上(比赛...
单片机C语言程序设计 160128液晶中文显示ADC0832两路模数转换结果(有源码)单片机C语言程序设计 160128液晶中文显示ADC0832两路模数转换结果(有源码)单片机C语言程序设计 160128液晶中文显示ADC0832两路模数转换...
在设计高性能数据采集系统时,勤奋的工程师仔细选择高精度模数转换器(ADC)以及模拟前端调节电路所需的其他元件。在几个星期的设计工作之后,执行模拟并优化电路原理图,为了赶工期,设计人员迅速地将电路板布局布线...
51单片机实现AD转换,该文档希望能够对你有所帮助。
单片机C语言程序设计 ADC0832模数转换与显示(有源码)单片机C语言程序设计 ADC0832模数转换与显示(有源码)单片机C语言程序设计 ADC0832模数转换与显示(有源码)单片机C语言程序设计 ADC0832模数转换与显示(有源码)...
单片机C语言程序设计 PCF8591模数与数模转换实验(有源码)单片机C语言程序设计 PCF8591模数与数模转换实验(有源码)单片机C语言程序设计 PCF8591模数与数模转换实验(有源码)单片机C语言程序设计 PCF8591模数与数模...
单片机C语言程序设计 160128液晶曲线显示ADC0832两路模数转换结果(有源码)单片机C语言程序设计 160128液晶曲线显示ADC0832两路模数转换结果(有源码)单片机C语言程序设计 160128液晶曲线显示ADC0832两路模数转换...
PCB模数电子线路设计指南 PCB模数电子线路设计指南
《模数混合实用电路设计》报告模板用于模数混合实用电路设计
采用实验研究成果中的侵蚀模数数学模型计算露天矿水土流失预测中土壤侵蚀模数时,需根据项目区土壤侵蚀类型、地貌类型、排渣场渣体质地采用不同的计算公式,计算过程中需对公式中的各参数进行标准化处理。简要探讨了...
单片机C语言程序设计 ADC0809模数转换与显示(有源码)单片机C语言程序设计 ADC0809模数转换与显示(有源码)单片机C语言程序设计 ADC0809模数转换与显示(有源码)单片机C语言程序设计 ADC0809模数转换与显示(有源码)...