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

瑞士风格的网页设计应该是什么样的

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

瑞士风格的网页设计

瑞士风格不仅存在于海报和其他图形设计中。它可以用于网页设计。Diogo Terror 在 Smashing Magazine 中写道,瑞士风格与创建用户友好界面目的一致。

他继续说“这种平面设计风格诞生于制度背景下。那个时代的大多数作品都是海报,邮票,机构排版识别系统,街道标志等形式。从这个意义上讲,这些艺术家不仅仅是利用自上而下的沟通,他们还创造了用户友好的界面”。

网格作为设计的基础

瑞士风格的视觉特征涉及将元素放置在数学构造的网格上以创建统一的构图。网格为设计提供了一种“限制”元素的结构。

网格应以清晰的方式呈现文本和视觉信息。字体选择应该是 sans-serif(无衬线体)并且与左边对齐。最终结果应该是不对称的设计(不同于欧洲古典的居中对齐排版)。

Josef Muller-Brockmann 是瑞士风格的先驱之一,也是“ 平面设计网格系统”一书的作者,他说:“网格系统是一种辅助,而不是保证。它允许多种可能的用途,每个设计师都可以寻找适合他个人风格的解决方案。但是必须学会如何使用网格; 这是一门需要练习的艺术。”

设计师还有哪些其他方式可以将瑞士风格的风格带入网页设计?

在网页设计中引入瑞士风格的 4 种方式

1.使用更少的 UI 元素创建清晰度

瑞士设计的特点是页面上的元素应有其功能(不仅仅作为装饰存在)。每个元素都是有原因的。这种哲学让人想起极简主义。

但为什么你的设计应该是简约甚至是极简的?当您将网站设计减少到真正需要的唯一元素时,您就可以在设计中创建清晰度。

以上是瑞士风格的网站模板。有大标题,有明确的信息。我们的注意力不会跳跃,因为只有几种颜色:白色,蓝色和黑色。而且由于 UI 元素的数量有限,很清楚网站代表什么。相比之下,繁忙的设计会引起混乱,造成紧张。

设计是尝试传递信息,如果在其他竞争元素的噪声下无法听到该有的信息,那么用户将获得不太愉快的体验。

您应该向用户提供他们正在寻找的信息,而不是干扰他们。

产品设计师 Joshua Porter 写道,清晰度是界面设计中的第一位。他继续说,为了有效,人们必须认识到信息是什么,关心为什么要使用这些元素。

从本质上讲,清晰度激发了信心,并促使进一步使用。

2.限制您的字体选择

在瑞士风格网页设计方面,您的字体选择至关重要。瑞士风格也被称为国际主义字体排版风格。因此,某种程度上这种风格仰仗于字体。

字体是瑞士风格的主要设计元素。看看这期间的任何海报,你会看到大而粗的字体占据了大部分空间。

如果您希望您的网页设计体现瑞士风格,那么就该扔掉您的 Times New Romans,Garamonds 和 Caslons。不允许使用衬线字体。

我们来看看上面的网站。目标很明确:成为会员。我们关注它有两个原因。一个是尺寸,字体很大,信息很清晰。没有其他相互干扰的消息。

另一个是因为负空间(留白)有很多。这使得网站可以呼吸,更好地传达信息,并为用户提供一件可以关注的事情。

另一种瑞士风格的特征是文本左对齐,右侧则自然形成粗糙的锯齿状。文本左对齐,不要两端对齐,就像这样:

瑞士风格的典型字体:Montserrat,Open Sans,Lato 和 Helvetica。

3.建立排版层级

瑞士风格选用字体、布局合理。这源自于排版层级结构。

排版层级是一种通过以连贯的方式确定信息优先级来构建网站内容的方法。这意味着:首先是重要的东西,以后是不重要的东西。

要实现视觉层次结构,您需把玩以下:

尺寸

颜色

字重

位置

对比

字距

如果您想要学习视觉层级,请查看报纸的首页。

标题,副标题和正文副本是创建可视层次结构的方法。标题会吸引注意力(最重要的),副标题会提供额外的信息(不太重要),文本信息、正文(最不重要)。标题和副标题都用于吸引读者继续阅读正文。

4.相对于插画,更偏爱摄影

插图正在经历网页设计的繁荣。各种公司都使用定制插图为品牌增添魅力和个性。

但对于瑞士风格,这一切都与摄影有关。为什么?在当时设计师的心目中,摄影是一种表现现实的方式。这是一个更客观的媒介(记住,这些家伙喜欢客观性)而不是绘画或插图。

瑞士风格的网页设计 - 后记

当我们回顾塑造了当今世界的那些设计运动并尝试重新创造我们自己的设计时,最终的结果可能是模仿。

作为设计师,最好找出这些设计运动(潮流)中的有效元素,把那些经得起时间的考验的原则用到您的设计中去。

在尝试重新创建瑞士风格时,最终结果也许会比较苍白,因为我们已经不在那个时代了。但请记住,谨慎(克制)地选择你的 UI 元素,多关注字体(Typography),它会让你的设计更棒!

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


上海傲秀展览展示网站制作首页设计效果图
上海傲秀展览展示
佛山红海豚门业网站制作首页设计效果图
佛山红海豚门业
东莞五源企业形象设计网站制作首页设计效果图
东莞五源企业形象设计
深圳大狮影业摄影广告网站制作首页设计效果图
深圳大狮影业摄影广告
山东恒美科技网站制作首页设计效果图
山东恒美科技
山东博纳电气网站制作首页设计效果图
山东博纳电气
深圳信雅文化传播网站制作首页设计效果图
深圳信雅文化传播
广州康耐登家居用品网站制作首页设计效果图
广州康耐登家居用品
西安天星塔钟工程网站制作首页设计效果图
西安天星塔钟工程
江苏小太阳机械科技网站制作首页设计效果图
江苏小太阳机械科技
 

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


网页图片的尺寸和分辨率有价值内容的创作指导原则高端网站建设需要避免哪些误区模板网站和网站建设定制开发有什么区别网站建设中主机托管和虚拟主机的不同之处HTML网页设计的八条强大技巧微信转发人群的心理特点都有哪些网站建设对企业的重要性有哪些讲究技巧:深圳网站建设的标准是什么网站设计开发如何布局整齐美观的网站布局有哪些好处呢如何进行深圳网站建设指南 网站页面设计哪里专业 网站建设如何应对网站改版怎么样的网页设计有利于企业网站的优化 口碑好的网页设计哪家不错网站设计中我们应注意哪些重要细节网络营销企业如何赢利-深圳网站设计分享沙井上市公司的网站建设是怎样的深圳网站建设公司:网站的预防和应急深圳网站建设公司业务员谈单必备的专业素质科技解析:巨头小米和新创公司们的博弈为什么做网站制作可以给企业带来效益网页页面CTA类型以及设计数量浅谈深圳网站制作中如何设计网页有利于优化响应式网站建设的优势有哪些深圳网站建设之如何挑选合适的域名什么样的网站内容能快速传播明确网页设计主题网站建成之后要注重网站的定期维护网站建设助力企业全面营销深圳网站设计内容,网站建设按钮设计的技巧有哪些商城网站如何做才可以得到好效果建网站需要考虑什么问题网站优化要懂得代码吗怎样可以挑到专业设计网站的企业SEO的最终目的是什么网站开发人员经常较常见的CSS错误深圳福田网站建设设计,网站建设的具体流程是什么分析网站运营的几个思考问题想要做好搜索引擎优化这些不容忽视的问题外包公司软件定制该何去何从网站优化-有效地使用关键字外包公司软件定制该何去何从为何要重视企业网站建设它和网络营销其实息息相关如何从细节来构思一个优秀的网站文案搭建优质的网站需要考虑哪些问题外贸网站建设怎样做才可以产生使用价值-企业建设公司官网的主要作用有哪些如何做出让人满意的网站建设网站建设中要考虑的几个问题企业建设营销型网站有哪些要点深圳网站建设中小型企业建立网站商城有什么优点手机网站开发建设四大要点有设计感的网站应该具备哪些特征内容为什么要学习SEO设计开发响应式网站有什么优点seo怎样进行网站分析公司官网建设有哪些重点如何做好网站建设的页面布局网页规划设计的关键是什么
企业网站建设行业信息服务发布平台!
(www.fantodo.com)版权所有
QQ在线咨询