如何设计制作出拥有灵魂的优秀网站？网站缺乏多样性最主要也最显而易见的缘由。

　　网页设计是否丧失了灵魂？这能否要归咎于响应式设计呢？我的朋友和同事们提出了这些问题，不得不说是有点耸人听闻。毕竟，响应式网页不只能让我们经过日益丰厚的联网设备阅读网页，还能感受其乐趣。

　　作为设计师，我们的首要任务是处理问题，这可能远远超越其他的事情。响应式网页设计是一种绝妙的处理计划，能发明出顺应各种设备的虚拟体验。但依然有许多问题亟待处理，特别是如何让各种内容都有趣诱人。一页纯文字能够成为一篇漂亮的博文，一大堆无关联的JPG图片能够成为一部专业的作品集。

　　然后，问题就变成了：我们能同时完成两者吗？

　　我们所取得的

　　毫无疑问，网络曾经成为一个美学胜地。基于牢靠的网格规划，构建简单诱人的网站，曾经成为一种规范。互联网的开荒曾经完成，以框架和活动栅格方式呈现的律法与次序，曾经掌管这片土壤，开端了战争的统治。

　　一切这些都是好事。简单诱人的网站，优势显而易见且丰厚：

　　熟习，便于用户阅读（操作正确的话）。

　　原型设计（相对）简单快速。

　　建站技术的高度规范化（流水线取代了工匠）。

　　快速规划俭省了大量开支（有一定可能会转嫁给消费者）。

　　严厉的栅格规划促进了响应式设计（它严重依赖极简的规划趋向）。

　　散步Awwwards这样的网页设计画廊，其中展出的网站，有成百上千个都契合简单诱人的规范。

　　毫不夸大的说，规范化与其相关技术确有严重意义。无数的个人与小公司从中受益，经过简单诱人（却毫无共同性）的网站，向全世界分享他们的品牌。但是，那只是一方面。

　　我们所失去的

　　将个人行为归入考量，往常的专业网站看起来根本上都很棒。拿一个名不见经传的设计师作品集网站，与十年前更好的设计机构网站相比，你以至会供认我们在网页设计这件事上，曾经做得好太多了。但是，四下看看，很容易得到结论：一切看起来都趋于异化。

　　是不是设计师都丧失了开辟肉体？便利能否牺牲了发明性？在答复这些问题前，我们先看看是什么致使今天网页设计缺乏多样性。

　　为何网站看起来都一样

　　看看往常的网站，异化的背后是什么力气在差遣？应该怪谁？事实证明，并不能简单归咎于某种工具或办法。响应式设计或许火上浇油，但它只是诸多要素之一。下面是一些疑犯。

　　规划

　　有限的规划创意，是网站缺乏多样性最主要也最显而易见的缘由之一。抽离颜色、动画、视觉差滚动及相似效果之后，你就会留意到一些根本的网页规划准绳。有几网站是在这5种规划上稍作调整而成的？

　　5种常见的网站规划。

　　Noah哀叹“四处都是条条框框”，指的就是这个。我们似乎停滞了，共同的规划成为了一种失传的艺术。

　　响应式网页设计

　　在以前，你能够确保，一切的网站访客都在用低分辨率的台式电脑屏幕阅读。往常，网站在一切尺寸与分辨率上表现良好，这已不是一种，而是一种必需。宽度活动、可伸缩的根本栅格系统，使得响应式网页设计比随性的规划更易处置。

　　框架

　　网页设计框架或答应以加速设计与开发流程。对许多人而言，它们是树立跨阅读器响应式网页最平安快速的方式。作为奖励，他们还会留意坚持内容简单，从按钮到表单，涵盖一切通用元素。Bootstrap和Foundation这类工具有着惊人的人气，招致成千上万的网页设计师在他们每个项目中运用完整相同的代码库、规划、以至美学作风。

　　原型工具和设计流程

　　即便在从零开端的过程中，设计流程也在有认识地抑止发明力。多数原型工具都鼓舞、以至可能迫使你运用规范化的方框元素，严厉遵照网格式的规划。

　　许多原型工具都鼓舞运用常规网格规划构造。

　　高清免费照片与图片

　　获取漂亮的免费设计资源真是

　　地容易。便当与可接受占领了支配位置，设计师们蜂拥向免费照片网站，从一个小小（但在不时增长）的池子中获取相同的资源。

　　两张免费摄影图片。

　　在过去的两年中，你看到过几个网站用了其中某张照片（或者两张）？假如你经常阅读网站，我打赌有几十个。

　　The Village Style和Jigglist；College Essay Guy和Get Busy Make Money

　　这还不只仅是照片，还包括图标、字体、设计形式等等。好的方面是，没有任何预算的设计师也能做出美观的网站；糟糕的是，一切其他设计师也在用同样的资源做着同样的设计。

　　设计趋向

　　关于某些设计师而言，“趋向”是一个贬义词。但它不该是贬义词。在20世纪找一个年代，看那十年的设计趋向。你会发现真叫人入迷。它为那个时期赋予了共同的作风与个性，常常能反映出整个文化环境。即便你看不见，它也正发作在你的工作中。你看到与体验到的一切，都在影响你的行为，互联网则史无前例地放大了这种效应。招致许多设计师从相同的资源获取灵感，追逐相同的趋向。

　　我们设计师

　　上面列出的每一项工具与资源都极有价值。它们能简化工作，让网页设计与开发的大门向更多人敞开，也为客户省钱。我不会胡乱运用它们，我会精心选择。假如真要寻觅毁坏网页设计多样性的元凶，我会举起本人的手，就是我。我觉得不是每个项目都值得停止共同的设计，我要向那些尝试有趣设计的设计师们脱帽致敬。

　　要晓得，有一点很重要，你用上面一切这些资源依然能够发明出共同的设计。这都取决于你如何运用这些工具。

　　如何应战现状

　　你的网站能否有共同的设计，如今想必你心里有数了。或许你不在乎这个——这完整没问题。但假如你想要突破规范的工作流程，这里有些概念能帮你完成，还有些网站能够作为十分棒的案例。

　　奇特的规划

　　关掉你的原型工具，拿出纸笔，考虑一下如何创作出有趣且有用的规划，脱离你以前的套路。

　　Phases Magazine

　　Phases Magazine就是个很好的例子，在规划上大胆打破。它也有条条框框——其中有网格——但他们以某种方式发明出了完整不同于规范网站的体验（屏幕截图不能让你很好地感遭到，请一定要亲身翻开看）。假如你看到这个觉得，“哇，这太奇异了”，那么很好！他们要的就是这个效果。有人会喜欢，有人会厌恶，但我喜欢的是他们在尝试做一些改动。

　　Phases Magazine用了一种非传统的网格。

　　不幸的是，这个网站的整体体验十分糟糕。有不用要的滚屏，外表上是响应式规划，但在某些尺寸下严重错乱。

　　Phases Magazine的规划在小屏幕上完整乱了。

　　Curious Space

　　这个概念还有一个更好的应用案例，Curious Space。

　　Curious Space的规划。

　　这里的网格也有些自然随性的觉得，但滚动功用是常规的，响应式断点也运转良好。

　　Curious Space顺应各种不同设备。

　　操作这个网站时，你会留意到许多不错的小设计细节。例如，鼠标悬停会影响图片的层叠次第。

　　鼠标悬停会让内容到前面来。

　　而且，滚动时还有点小兴趣，但至少不会打乱操作，也与网站随性的视觉主题相吻合。logo开端是一堆紊乱的字母，随着页面滚动，它们各自归位，在导航条中组成了“Curious Space”。

　　随着滚动，logo的字母各自归位。