Menu

在每一个网站中建立Resiliency的案例

<返回列表

问一打网页设计师如何建立一个特定的功能-你可能会得到十几个独特的答案。这是网页设计之美的一部分。您不需要坚持一个特定的公式,以实现所需的外观或功能。

然而,并非每一种解决办法都是平等的。它在浏览器中工作得很好这一事实是不够的。潜在的缺点是有些方法比其他方法更有弹性。

但究竟什么是弹性当涉及到网页设计?让我们来看看什么是弹性设计(无论如何,在一个设计师的观点中)。然后,我们将讨论弹性如何改变您处理项目的方式。

不要建纸牌屋

您曾经构建过一个页面,甚至一个高度依赖于单个元素的特性吗?如果这个元素被以某种方式改变的话,整个东西就会破裂吗?

很可能我们都在某个时候做过这件事。例如,想想一个老式的多列布局。在我们之前CSS网格或者Flexbox,我们经常发现自己试图把它和浮子结合在一起。

虽然可以让它在浏览器中工作得足够好,但整件事都是一堆纸牌。意外删除错误的css类或忘记使用清除攻击导致了一个破碎的布局。

简言之,这种做法没有弹性。这是太容易打破,不能很好地适应未来的变化。最终,我们可能不得不重建布局,以便更好地处理不同的场景。

Playing cards on a table.

相反,建造一个摩天大楼

也许这不是最优雅的类比,但一个可持续设计的功能有点像摩天大楼(和我一起工作)。它的目的是保持机智,即使它的许多级别之一也有问题。

在现实世界中,把它看作是一个导航菜单,当一个新的项目被添加时,它不会被淹没。或者是一个列,它不会超出它的边界,因为它包含比你预期的多一两个句子。

这就是弹性的本质。这是一种考虑如何使用(或滥用)特性的实践。意识到可能有一些你无法预料的用途。然后,它是一个设计和建设的方式,能够承受几乎任何情况。

当然,这并不意味着什么东西是完全防弹的。但它确实消除了最有可能的临界点。这使得网站在发布后很长一段时间才能蓬勃发展。

City skyline with tall buildings.

挑战

这听起来很棒,对吧?我们努力创造一些在压力下不会枯萎的东西。但是,和大多数事情一样,说起来容易做起来难。

在这一过程中涉及到许多挑战。第一种方式是关注哪些是可行的,哪些是不可行的;第二种是当客户要求一些不能持续的东西时。让我们一个接一个地解决它们:

确定什么是弹性

在您的设计中确定什么是和不具有弹性的最佳方法之一是实验。你以你所知道的最好的方式来设计和构建一些东西,测试它,然后看看它随着时间的推移是如何发展的。当你进入新的项目时,这种体验会证明是无价的。

除了经验之外,另一种解决问题的方法是使用前面提到的扑克牌屋类比法。如果您所创建的东西严重依赖于一个方面??一个css类处于特定位置,则为空。div或者是其他的密匙-它可能没有弹性。

这其中最重要的方面是错误提供了学习的机会。你学得越多,你就越擅长在项目中建立弹性。

教育客户

客户经常带着雄心勃勃的计划来找我们。尤其是当你的客户是一个设计师的时候提供给你有一个模型可以建立。他们可能会发送一个Photoshop,Sketch或XD文件,其中包括一些具有挑战性的方面。或者,客户可能会在另一个网站上看到一个具有视觉吸引力的功能,并要求您复制它。

情况很艰难。这些项目可能有一些CSS魔术。您甚至可以让它在所有主要浏览器(包括IE!)中工作--但代价是什么呢?

嗯,当你的客户在几个月后做出改变时,你花了几个星期的测试才得到的特性恰到好处像树枝一样折断。

有时,实现弹性功能的部分过程是让客户相信它的价值。也许有些东西看上去不太像另一个网站的那个酷特性,但是它会更容易(因此,更便宜)保持下去。

A building under construction.

弹性从零开始

模拟一个网站可以是一个有趣的经历。这是一个释放你的创造力的地方,并且(希望)给你的客户留下深刻的印象。

这也是我们作为设计师会陷入困境的时候。设计方面的雄心往往是积极的,但它也会导致众所周知的纸牌屋。试图变得太可爱的元素可能会使你陷入一个角落,当是时候建立。

这就是为什么从你打开你的设计应用程序的那一刻起就考虑弹性是很重要的。考虑每一个设计决策你做的。问问自己,如果一个元素不包含那么多的字符,或者在一个小屏幕上查看,会发生什么。

从一开始就关注这些问题。它可能只会让你避免从恐慌的客户端接收到这样的信息,即布局被破坏或其他各种各样的混乱。光是这一点就值得付出努力。


最新网站设计资讯
企业网站建设

企业网站建设优化一条龙,多年品牌网站设计,营销网站开发,手机网站制作,响应式网站设计

联系我们

电话:15557455058QQ:1611387063 邮箱:[email protected]

联系云轩总监微信

微信