易捷网络专注企业网站建设
11年企业网站建设经验、响应式网站建设,兼容PC、手机、平板全
终端,给你更佳的浏览体验...
QQ在线咨询

极简电子商务网站设计,惊现黄金比例栅格

来源:网站建设行业资讯网         添加时间:2021-12-8

网页设计作品由创意总监Daniel Tan制作,该客户的企业网站主要是销售一些简约、北欧风格的家饰、家具类产品,比如坐椅、花瓶、灯具、挂钟、摆设饰品等等。这些产品的设计都是非常简约与时尚,所以设计师在设计网页的时候就要选择简约的主题风格,重点突出产品,不带其它花销的设计。

一、首页设计

首先我们来看看整个首页设计,di一眼给用户的感觉就是简约、舒适。在浏览网页时用户很容易就能分辨出这个网站是做什么的。首页结构:1. 焦点BANNER广告图; 2. 主打分类(图片格式);3. 流行产品列表;4. 推荐产品集;5. 引导订阅。

二、新闻页&信息列表页设计

新闻列表页面使用了左右对称布局设计,为了不让页面过于单一,在列表之后加入了「Our Service」内容来填充。

三、产品页

产品页通常由产品列表页和产品详细页组成,我们先来看列表页的设计。

产品列表页设计:和大部网站的产品列表一样,喜欢使用宫格式布局,但这具网页的难点还是留白的运用。其次我们细心的看一下,列表中的产品图的背景以及产品排列好像是被设计师「刻意修饰」过,所以zui终网站出来的效果可能会因为产品图的原因会打点折扣。

这种「刻意修饰」小编认为非常有用,为了过稿,不要偷懒,就像下图展示一样,每行的产品配色、与排序是经过精心布置的。

四、分类目录页面

点击和首页的「推荐产品集」的布局是基本一致的,这个布局相当好看,所以必须要研究一下它的栅格系统。

五、黄金比例栅格系统

这么好看的排列方式,到底是怎么排版出来的呢?通过分析终于可以看出一些规律,设计师使用了两种比例栅格系统,分别是黄金比例和铂金比例。使用这些比例来设计总比「凭感觉」去排列好得多,而且也能让前端人员有规律的写代码。

不知道黄金比例怎么计算?建议使用黄金比计算工具:

http://www.shejidaren.com/examples/tools/golden-ratio/index.html

使用这个工具的好处就是不用自己计算比例啦,集成黄金比、铂金比、白银比等等自动换算。

六、网页配色

这种极简网站配色通常越少越好,所以整个画面都是以黑白为主,但单色调会不会在烦燥?不会,因为还有产品图片、以及图片的背景色进行点缀。

总结

像这样一个极简的企业网站设计,看似没什么东西,但无论从设计、代码、以及后期资料维护都是非常复杂的,就看图片质量要求就知道,每个图片都是高品质,修图、输出透明背景PNG图,好了不说太多……希望大家有所收获。

网站建设计最新案例赏析:


上海科宁会展服务网站制作首页设计效果图
上海科宁会展服务
东莞鼎力环保科技网站制作首页设计效果图
东莞鼎力环保科技
西安天星塔钟工程网站制作首页设计效果图
西安天星塔钟工程
东莞纳普电子科技网站制作首页设计效果图
东莞纳普电子科技
山东恒美科技网站制作首页设计效果图
山东恒美科技
佛山市共宏纺织机械网站制作首页设计效果图
佛山市共宏纺织机械
广州捷伦达实验室设备网站制作首页设计效果图
广州捷伦达实验室设备
广州黑蜂科技有限公司网站制作首页设计效果图
广州黑蜂科技有限公司
佛山红海豚门业网站制作首页设计效果图
佛山红海豚门业
上海三羽电器网站制作首页设计效果图
上海三羽电器
 

网站建设行业资讯推荐阅读:


网站建设中常见的网站安全问题为什么要定制网站开发?目前深圳网站设计的发展趋势自身制作网站复不繁杂?建设网络文明需大处着眼小处着手新手站长如何做好网站建设小技巧分享如何使深圳网站建设更经济专业网站设计要做好哪些工作深圳网站建设之浅谈模板站建设误区企业网站建设在网络推广中的作用网站的这种设计方案误区一定要杜绝为什么说网站建设是现代企业的标配干货:关于做网站建设怎么降低成本解答?网站制作,网站alt标签优化有什么作用? 一个优秀的SEOER要从这里学起当深圳网站建设遇到展示型客户如何建设网站网站建设可以设计哪些类型的网页新闻类网站建设的要求 服务专业的网站设计模板制作报价单 易捷网站建设教您解决网站降权的问题用file_get_contents以get方式获取内容示例建一个网站前要准备那些资料对于可访问性设计师必知的事企业网站建设应该如何选择适合的虚拟主机网站建设排名不是非常好的原因有什么网站建设企业网站改版后续跟进要点分析个人站长在创业需要面对哪些问题?深圳网站建设之什么是竞价单页?网站设计公司浅谈2018营销型网站的趋势定制软件哪个好?模块划分的标准移动端seo优化时需要做哪些事服务设计和用户体验设计:有什么区别?提高软文流量的一些技巧分享怎么做顺应时代潮流的网站制作?传统企业建设网站的实际意义有哪些网站建设中内容营销是优化的关键优化型网站建设:站点后期优化工作如何开展?可视化建站系统是什么?为什么做软件定制项目很难赚钱网站建设的三大基本原则是什么?最新2018阿里云网站进行备案流程深圳企业网站设计,企业网站设计要注意哪些事项?科技-为什么现在企业都不喜欢用模板建站?模板网站有哪些缺点?网站备案要如何做才能不用关闭网站网站建设应该如何选择合适的网络公司为什么深圳微网站的建设如此受欢迎深圳网站运营包含哪些内容?为什么网站被降权?服务好的网页设计哪家专业团购理财网站风生水起监管问题或成隐忧SEO推广专员为初创企业建立网站需要考虑哪些方面企业网站改版,需求从哪里开始?如何构建反向链接这些美国虚拟主机退款政策你懂了吗?URL静态化之网站结构优化基础方法网站建设所需材料及具体流程步骤解析!怎样选择专业的网站设计公司Web浏览器兼容性对网站设计的重要性
企业网站建设行业信息服务发布平台!
(www.fantodo.com)版权所有