教您如何选择网站视觉风格？

时间：2024-05-13 07:30:01 | 来源：建站知识

时间：2024-05-13 07:30:01 来源：建站知识

我们近来遇到许多客户，想重做网站，却常常无法给出明确的方向。因此，今天的这篇文章，就是要写每个为网站设计迷茫的网站主们，一篇集结形容网站会用到的一些关键字，以及他们的实际案例，开门见山地写的一篇视觉设计选择指南！

首先声明，一个网站的视觉组成，除了以下将提及的风格、素材、色系、感受之外，还有很多很多需要注意的小细节，例如插画风、动画形式、菜单形式等等，本文志在帮助你找到大方向，跨出第一步。

废话不多说，让我们从风格开始吧！

一、风格



网站设计中，用以形容网页的种形容词，使用平率最高的大概是「大众化」与「独特」了吧。

这边所谓的大众化并不是贬义，而是指大众较常见的设计。

例如dev.startear.com/steak/，落地页是商品照片加上黑色透明遮罩，再压上品牌Logo，这样的画面，你的脑海中是否瞬间就能联想到类似的设计呢？

此种设计，通常因为网站与网站之间相似度高，且已在网路上运行多年，按钮位置、网站架构等都比较符合主流的使用习惯，让大众一看就懂，熟悉的操作方式对最味！

独特，大部分指的是开发型网站，网页设计公司与客户负责人会从了解商品开始，为其量身定制网站企划，因此在此类网站中，较常出现一些独特且有趣的功能或动画。

以www.liquor-nce.com为案例，透过如铺克牌一般的线条，勾勒出如威士忌口感般的高贵、典雅的气质，而此网站中的插画是经过设计师与客户数次的构思与讨论，甚至连照片，都是由网页公司操刀，专为皮尔斯威士忌所订制。

二、素材



网页设计中的素材指的是网站中的照片、图片、图案甚至是按键，营造网站氛围感不可或缺的物件。

在贩售服务的网站、教育机构的网站中，与「人」打交道居多，因此希望网站的设计，能让使用者感到亲切，所以此类网站多选择使用真人图片为素材。

这边的范例是www.tse.nthu.edu.tw，不只利用实景照片使气氛更悠闲，还启用了学生摄影师，呈现出校园最真实的样子。

金融商品中，多数以插画或真人图片结合插画的方式呈现网站，例如bank.sinopac.com/sinopacBT/webevents/USStock/index.html#industry，美国股市一页式网站选择了美式插画来搭配，切合主题，达到锦上添花的效果。

素材的选择，除了受到商品性质影响，也会受到目标客群的影响，例如https://saiyo.sme.co.jp/graduate/23/，因面向初出茅庐的应届毕业生进行征才，所以选择利用缤纷的3D人物，打造出轻松、适合年轻族群的征才网页。

三、色系



化妆有分冷、黄皮肤，摄影有色温，网页设计也有分暖色、中性色、冷色等。

通常而言，冷色调的网页设计会较适合高科技、技术相关产业，因为冷色调比较容易呈现出「科技感」。这边的案例是ventureforamerica.org，Venture for America是一个培育大学毕业生成为领导者的机构，他们以不同程度的蓝色贯穿整个网站，使网站散发出高冷的氛围。

中性色相对适合适合调性中立的单位，教育、政府机关等等，例如energypark.org.tw，网站色调以绿色与蓝紫色组成，不会偏冷或偏暖，搭配吉祥物北极熊，俏皮又有趣。

暖色调容易营造出舒适感，因此较适合生活选物店、女性消费为主的商店，像是牧毛町www.stoov.com，网站背景是淡淡的肤色，按键颜色则是橘色、圆角，配色像极了你梦想中的温暖豪宅。

除了暖、中性、冷等调性，也有一种网页设计，是以品牌本身的代表色作为网站主色调，例如牧毛町（shop.lyrasoft.net）。此种设计可以快速搭建出网站整体感，是业界相当常见的一种做法。

如果你不知道该选什么色调，选择与品牌色相同的颜色来制作网站，绝对是您最安全且有效率的选择。



｜注意｜

颜色的判断非常的主观，暖色也可以做出科技感，以上案例仅展示较常见的做法。

四、感受



感受的这个部分，纯粹是你的网站呈现给使用者的「氛围」。

棉乐悦事（dhartimata.com/zh/about/story），意为尼泊尔文及梵文中的「大地之母」。

网站主要贩售尼泊尔女性以自然原料手工打造的永续性商品，以及分享尼泊尔当地的暖心故事。因此，咨询时即表达网站要给人温馨的感觉，最终的成品以暖色调为网站主色调，搭配手绘感插画，让网站充满亲切又温暖的感觉。

Datavedio国际官网（www.datavideo.com），国际化科技公司，业务为制造及租用导播机相关产品，版图扩及全球，因商品外观、使用者环境多为黑色，品牌色为深蓝色，两者相结合做出的科技感、高冷感恰好非常符合品牌调性。

你的品牌给予造访者什么样的感受、使用什么颜色、放上何种素材，完全取决于你的故事，高冷科技业或是温暖的女性力量亦或是严肃的教育机构，这个故事会将网站分向完全不同的结果。