sumaart

web site / mobile & h5 / brand design
less is more, art is freedom…

设计观点

Back

网页设计、网页开发、UI和UX:有什么区别?

Share

Time:

2022-03-23 10:36:46

Author:

素马

网页设计和开发有什么区别?那么UI与UX呢?这些划分是什么意思?为什么有这么多缩写??难道技术人员不希望一切都对用户友好!?

 

如果您刚开始设计网站,那么接触科技行业的术语会感觉很像听一门外语——除了大多数外语都有韵律和理由。如果您想要一个成功的网站,您需要与一家专业的网页设计公司合作。

 

这就是本文的目的。如果你正在设计你的第一个网站,或者只是想更好地了解这个行业,素马设计在这里解释和剖析当今科技中最常用和最麻烦的四个术语:UI、UX、网页设计和网页开发。阅读本文后,您不仅会了解每个领域的作用,还会了解您的业务最需要关注的领域。

 

有心人写给有心人的文章很长,如果您有建站需求,或者您向往网页设计工作,请耐心阅读。

 

 

IT基础知识

——

让我们从一些基本定义开始,以减轻您最初的困惑,并在我们深入研究之前为您普及一些背景信息:

 

网页设计-与设计网站的视觉效果和可用性相关的所有内容的广泛类别。UI和UX设计以及许多其他领域都包含在网页设计中。

Web开发——制作网站的技术部分,专注于代码。Web开发进一步分为“前端”和“后端”,如下所述。

用户界面(UI)—一种专门的网页设计,处理人们用来与网站或应用程序交互的控件,包括按钮显示和手势控件。

用户体验(UX)—网页设计的另一种专业化,它处理用户在使用网站或应用程序时的行为和感受。UX设计封装了许多其他领域,但从用户的角度来看待它们。

 

正如您已经看到的那样,这些领域都不是排他性的,并且存在大量重叠。Web设计和开发只是同一枚硬币的两个方面,UI设计影响UX设计,Web开发支持所有这些……与其说哪个领域处理哪些任务,不如说每个领域如何从不同的角度考虑相同的任务-看法。

 

例如,让我们看一下加载时间,这是每个网站的常见问题。每个字段如何处理加载时间:

 

网页设计:如果页面加载时间过长,则说明内容过多或内容过于复杂。图像文件可以压缩,资源可以调整和重新导出,页面可以修剪多余的内容。

 

Web开发:为了加快内容加载速度,我们可以尝试更好的文件压缩来减小内容的文件大小,使用CSSsprite来节省带宽,或者使用内容交付网络来缩短特定地理区域的加载时间。

 

UI:控件必须尽可能地响应,所以界面必须足够简单,交互性是即时的。

 

用户体验:用户“弹跳”(片刻后离开您的网站)的可能性随着加载时间的每一秒而增加,因此在解决整个网站范围内的问题之前,我们应该优先减少主页和登录页面的加载时间.

 

您还想区分网站和应用程序以及桌面和移动设备。每个工人都有自己的专长——一些开发人员在构建移动网站方面有更多经验;一些设计师只专注于应用程序,从不做网站。同样,有很多重叠之处,但如果您正在寻找网站合作公司,请确保您的候选公司能够处理这些细节。

 

那么,众多的网站设计公司中哪些可以帮助您实现特定的业务目标?雇用他们时应该注意什么?类似素马设计这样的网页设计公司,就能很好的全程提供服务,创建完善而出色的网站。

 

素马设计拥有十余年的服务历程,专业的服务团队,出色用户体验设计,擅长通过网站产品塑造企业特质,设计好、工艺好、服务好;这样的优良设计公司非常适合长期合作,同样非常适合热爱设计的设计师加入其中一起向未来。

 

网页设计

——

“网页设计”是一个有点古老的术语,可以追溯到一个人处理网站所有设计方面的日子。按照现代标准,“网页设计师”这个词可能有点含糊。今天,由于技术和我们对工艺的日益了解,我们有了彩虹般的细分。

 

网页设计的子类别包括UI和UX,还包括其他有趣的首字母缩略词,如IA(信息架构,处理站点映射和导航)和CRO(转换率优化,微调站点设计以增加销售、注册或其他特定的行动)。这些子类别有几十个,随着设计师试图在竞争激烈的市场中获得更好的工作,每天都会创建新的子类别。

 

一般来说,网页设计与网站的视觉效果和功能有关。这是一个在各个层面都与平面设计有着内在联系的领域,并且处理视觉传达的相同设计原则。

 

但网页设计不仅仅是平面设计。无论是使用网站还是应用程序,设计师都必须了解经常变化的功能、技术限制、数字趋势和用户期望。

 

网页设计中还有一定程度的商业诀窍:设计师应该了解数字销售策略,例如如何放置“号召性用语”(CTA)按钮来吸引销售和电子邮件注册。网站布局严重影响用户行为,但由于它非常细微,一些设计师比其他设计师更擅长。

 

网页设计师处理传统的图形设计问题,如颜色和排版,以及数字问题,如为不同的屏幕尺寸选择最佳美学。他们还需要了解领导和结束等业务概念,以创建使号召性用语更具吸引力的布局。毕竟,设计师的职责有时包括从头开始制作图标、图形或界面按钮,这需要三者的专业知识。

 

至于具体的工作职责,设计过程主要取决于设计师,只要他们在现有的品牌准则范围内工作。通常,该过程涉及设计人员创建设计原型,然后与实际用户或利益相关者一起测试这些原型,然后将反馈整合到未来的设计中。

 

设计师还可以制作线框、设计的基本布局,以准备原型或模型,即屏幕外观的像素完美图像,除非没有交互性。

 

一旦原型被批准,它就会被发送给开发人员进行编码。

 

网络开发

——

网页设计和开发的区别在于代码的使用。开发是事情变得技术化的地方,但好消息是你不必知道你的开发人员在说什么,只要他们知道(尽管学习基础知识肯定有帮助)。

 

Web开发主要分为两大类:

 

前端(又名客户端):网站(或应用程序)如何在屏幕上显示的代码。前端开发人员负责将网页设计师的愿景变为现实,通常使用HTML、CSS和JavaScript等计算机语言。自然,并非设计师计划的所有事情都切实可行,因此前端开发人员经常与设计师来回工作。

 

后端(又名服务器端):“前端”从托管在服务器上的数字资源系统中提取。后端开发人员管理这些幕后资源,对数据库中的数据进行编码并优化数据的交付方式。他们使用PHP、Ruby、Python、Java或.Net等语言。

 

同样,全栈开发人员是可以同时处理前端和后端开发的人。有时,对于无法负担超过一次招聘费用的初创公司来说,它们是一个明智的选择,但理想情况下,您应该拥有一整支具有不同专业知识的开发人员团队。

 

用户界面(UI)

现在我们已经解释了网页设计和开发,我们可以讨论更专业的领域,从用户界面设计开始。UI是每个人都无需过多考虑就使用的东西——您无需了解汉堡图标的历史即可知道三行按钮是您的菜单。

 

这是大多数网页设计领域的一个持续原则:如果他们的工作做得很好,你甚至不应该注意到他们。这在UI设计中最为普遍:有了真正直观的界面,用户无需考虑即可使用它。

 

如果你必须积极思考如何使用这些控件,这被认为是糟糕的UI设计。搜索您需要的按钮或花几秒钟弄清楚按钮的作用都会分散您对使用网站的整体体验的注意力。UI设计的目标不仅是提供用户可能想要的所有控件,而且还创建用户一眼就能理解的不言自明的控件。

 

另一个问题是空间管理。UI设计师必须在为用户提供大量选择和节省屏幕空间之间找到快乐的媒介。这就是悬停控制和拉出菜单等技术的产生方式。UI设计师的职责是决定哪些控件需要始终呈现,哪些可以忽略不计,可以完全隐藏或忽略。

 

UI设计通常与另一个称为交互设计的领域相吻合,缩写为“IxD”。交互设计专注于用户与系统交互的所有方式,包括界面以及弹出窗口、聊天和错误窗口等区域。因为交互设计非常强调用户行为,所以它就像是UI和UX设计的中间点。

 

用户体验(UX)

——

在许多方面,从用户的角度来看,UX就像网页设计领域。网页布局如何影响用户?UI如何影响用户?当您进入高级阶段时,用户体验变得更具战略性,例如“我们如何设计页面以使用户想要注册?”

 

可以想象,UX设计还包含网页设计中的许多其他领域。很多人都在谈论“UIvsUX”,但事实是两者是一起工作而不是竞争。事实上,有太多的重叠,所有类型的网页设计师都可以从了解一点用户体验中受益。这正是用户体验如何成为一门独立学科的原因——聘请个人用户体验专家可以减轻团队其他成员的一系列其他责任。

 

尽管乍一看似乎是多余的,但实际上用户体验设计与销售或转化等业务目标之间存在直接关联。考虑到人类决策的大部分来自情感和直觉,优化网站设计可以鼓励某些行为并营造更有利于这些行为的氛围是有道理的。

 

出于这个原因,用户体验设计师还借鉴了图形设计原则:用尺寸吸引注意力,用颜色引发正确的情绪,在屏幕上创建可预测的视觉流,并将CTA放置在正确的位置。然而,与传统的平面设计不同,用户体验专家还必须考虑额外的问题,如交互性和时间,使其成为一门完全独立于所有其他学科的学科,同时又与所有其他学科相互关联。

 

想了解更多关于网页设计的信息吗?或者寻求网页设计相关合作,欢迎找到素马设计。