网页设计中的黄金比例

来源:设计经验分享网
添加时间:2024年02月
在网站设计发展到一定阶段的时候就必然会和其他学科或领域只是产生交汇和共鸣,在阅读《超越CSS:web设计艺术精髓》这本书的时候,发现原来web设计还可以这样。比较突出的例子是现在经常被设计师提到的网页栅格设计,TAOBAOUED曾经探讨过这个问题,通过很有逻辑性的公式换算加上一定的数学分析,得到对网页设计有建设性的概念指导,从一定程度上说算是一种创新。
也许有的设计师会认为使用这些所谓的规范性东西会是一种限制而不是创造,在我看来这些新的概念对网站设计来说是一种尝试和提升,会给你接下来的创意构思提供一个坚实的基础,让人从一个新的视角来看待好的网页设计。
在《超越CSS》这本书中,就提到了网站设计中的黄金比例这个概念。对于很多做设计的人来说,黄金比例并不陌生,它是最符合自然界美感的一个很神奇的东西,在古希腊的艺术雕塑中频频体现出来。对于我们网页设计师来说,只要记住一个数字就可以了:“1.62”,以950局中的页面为例:
我们要为一个950px宽度局中页面来设计栏目,根据黄金比例原则,可以这样设计:这样的Web布局具有一定的平衡感,整个页面也比较和谐。

现在的页面布局一般都是比较弹性的设计,因为这样页面可以充满浏览者的屏幕空间,而不管视窗的大小尺寸是多少,这对于那些高分辨率宽屏的用户来说是有意义的。而对于坚持固定像素宽度的设计者来说,1024*768就是王道,摒弃了两端的使用人群。在超越css这本书中还提到,即使是固定宽度的设计,减掉浏览器的滚动条宽度和浏览者打开了工具栏的宽度之后,水平宽度就显得不够用了:

许多设计师在设计版面的时候都是随意制定一下宽度就开始他们的设计,往往会出现挑选的宽度没有考虑到说要表现的内容,在后期出现内容问题的时候就很受限制。还有很多开发人员在实现页面的时候,并没有完全依靠视觉效果图来实现,有时就大致量了一下然后根据以往经验来定制宽度,而这种宽度往往不能很好的适应他们的内容,所以,这时候,黄金比例的使用就很重要了。
黄金比例不仅在大的布局上可以使用,在小的栏目设计中也可以灵活使用。可以细化到很小的设计元素,比如一块图片信息展示区域:

书中还提到可以根据内容反向推导出大的区域宽度,例如网页的首页上需要放一个宽度为500的banner图片,那么我们可以用黄金比例算出整个网页可以选择的合适宽度:500*1.62=810px,并不一定要是950或者800这些被很多人推崇的页面宽度。
 

平面设计相关资讯推荐阅读:


网页设计优化的意义高质量的网页需要具备什么样的条件关于域名解析中常见问题分网页制作页面布局小技巧定制软件哪便宜哪靠谱 网页排名不好,真的是你推广的问题吗企业网页建设时如何选择建站公司响应式网页建设:白色在网页设计中的重要性网页怎么优化,你的方法都正确吗腾讯出台微商管理方法,是否能奏效手机移动网页要如何做3个简单的步骤,降低网页的跳出率传统品牌广告如何将流量变成销量-深圳网页建设分享企业进行网页建设时如何节约成本做企业网页建设对公司有哪些优势艺术过渡!精巧微妙的渐变色网页设计大词、精准词、长尾词,这些词怎么投放PPC公司网页制作简单吗怎样能让网页更吸引客户网页莫名被K的原因是什么USB严重漏洞代码遭公布:情况很糟糕企业打造出营销型网页可产生实际性效益个人网页设计时需考虑什么问题 靠谱的网页设计电话高端的网页建设都有什么特征高端的网页制作步骤在这里网页脚本是什么企业网页建设需要注意的问题优化网页关键字应该做哪些工作 品牌网页设计制作哪家不错做网页为何不使用模板建站深圳网页建设为何要使用301跳转软件定制开发差别大了解清楚再决定!如何在传统的互联网营销中创新深圳网页建设中*页放置广告注意事项 企业门户网页建设需要明白的重要性网页建设报价有哪些包含什么内容深圳品牌网页设计:如何制作设计一个好的网页静态网页与动态网页的区别和优势深圳如何更好的优化网页排名互联网思维下的产品和服务是一个有机生命体挪动网页制做时间的长度一般受哪些要素危害深圳网页设计报价,网页导航设计有哪些注意事项新手教程:除了发外链seo还能做这些如何设计有特色的网页网页建设,不要只关心价格企业网页建设的基础步骤与开发流程广州网页建设讲述SEO常见专业性名词解释建设响应式网页有哪些好处卓越迈创2019年春节放假通知解析网页改版需要注意什么学校网页建设需要注意什么问题东莞网页建设你一定要知道的三大设计特点!要想获客应该怎么做好网页设计网页设计如何让网页耳目一新商城类网页五大网页优化方法怎么快速提升网页的权重有个性的网页建设可以获得什么如何在模板建站和定制开发中做出选择呢网页上线后需要维护哪些方面的内容公司网页制作提高网页易用性
网站备案号:豫ICP备2024041165号