网站重新设计-无论是为你自己的网站还是客户-看起来都是令人兴奋和有趣的项目。在保留网站现有品牌和内容的同时，创造一个新的设计是很有挑战性的。对于大多数网页设计师来说，这些类型的挑战是激励人心的。
然而,网站重新设计是一项棘手的计划和执行。在重新设计一个网站时，有几个限制因素，如果你从一张空白的画布开始，这些限制因素通常是不存在的。我甚至认为，由于这些界限，重新设计往往比从头开始更困难。
我们将深入研究的主题网站重新设计通过回顾和讨论黄页、Mozilla和Blinksale等网站的重新设计工作。
为什么要重新设计网站?
需要注意的是，设计最基本的形式之一就是解决问题的行为。无论是在解决耐用性和信号强度问题的同时，仍然保持手机的美感(就像苹果的手机一样)iPhone 4的不锈钢表带)或想出一个固体导航设计这提高了网站内容的可查找性，设计行为应该是有目的的。
当重新设计一个现有网站的动机仅仅是由美学驱动时，我认为重新设计的动机是不够的。网站重新设计涉及很多成本，对用户和所有者都是如此。例如，创建一个新的网站导航方案或重新配置网页布局要求现有用户适应新的网页设计。
这需要大量的时间、计划和决策，以确保现有的内容与新的设计很好地融合在一起。它还可能需要更新现有内容以适应新的设计。重新设计项目的结果应该证明这些成本是合理的。
这里有几个你想要重新设计网站的原因:
- 这个网站并不友好
- 重新设计可以增加网站利润
- 当客观的信息，如收集的那些数据分析，清楚地表明设计有问题
- 重新设计可以提高网站的速度和性能
- 该网站使用过时的网页设计实践来构建，这会给用户体验带来负担(基于表格的布局，动画GIF背景，可以使用Ajax技术改进的过时交互)
- 它缺乏一些功能，而这些功能一旦被采用，就会极大地增强用户体验
- 它有信息架构缺陷(可查找性差、导航、分类等)。
- 它不符合现有的公司品牌
组件设计
网站是否需要一个完整的设计检修或现有的问题可以通过重新设计或重新调整某些组件来解决?由于我们有机会在生产站点上快速无缝地迭代，部分重新设计可能就足够了。例如，当电子商务网站的结帐web表单使用户体验变得繁琐时，我们可以通过专注于麻烦的组件来更有效地使用我们的资源，而不是通过试图解决所有问题来分散我们的精力。
重新设计思维模式:专注于解决问题
事实上，一个网站成功的最重要因素是它的内容和目的。无论是为人们提供一个相互联系的场所(如Craigslist)还是传播信息(如维基百科)，成功的衡量和获得都是基于效用，而不是美学。重新设计必须符合网站的预期目的。
设计必须支持网站的目标。网站内容和实用性的不足永远不会因为网站看起来更漂亮而得到解决。
网站重新设计的真实例子
为了进一步探讨这个主题，让我们来研究一些网站设计的努力。
黄页
根据网站的关于黄页的目标之一是“成为人民的实用工具:一站式网站，用更少的点击，帮助每个人活得更好。”因此，他们重新设计的结果应该是提高可查找性;降低获取所需信息所需的点击次数。重新设计是否达到了这个目标?让我们来看看。
旧的设计
新设计
重新设计的网站外观与原始设计相似。它保留了许多原有的颜色(最著名的是公司的黄色和黑色)。在新的设计中，本地化被用来根据你的居住地在首页上填充更多相关的内容。
这有助于减少用户为了选择他们最感兴趣的位置而需要执行的工作量。除此之外，重新设计主要是为了美观，一些潜在有用的旧功能被删除了。例如，“更多工具”选项卡被移动到一个不太方便访问的位置。
“搜索提示”链接，可以帮助新老用户改善他们的搜索查询，被删除。在首页中使用丰富的图片——尽管它们使页面更有吸引力——会降低前端性能，如果它们不能增强用户体验并支持网站的目标，那么它们是肤浅的。
可
作为一款网页应用，Blinksale希望网站布局能够优化转化率，以便新访问者能够快速了解工具的工作原理并快速发现注册路径。
在这方面，Blinksale的新设计比旧设计有几个优点。旧的设计
新设计
新的设计可以很容易地发现页面上的主要行动号召，使用区分的艺术以突出其位置，并引导用户的眼睛凝视。由于左边简洁的项目列表和价格信息，了解应用程序的卖点也更容易了——它的价格是多少，以及与竞争对手区别开来的独特功能。
在旧的设计中，如果我们假设他们的大多数访问者是从左到右的读者，那么眼球流就有轻微的缺陷。访问者想要注册的逻辑顺序是，在决定注册之前，首先要了解web应用程序可以做什么以及它的成本。
旧设计的布局颠覆了这种理想的视线流动。
6个分开
Six Apart改变了页面布局结构和设计中使用的颜色。旧的设计
新设计
新设计的外观和感觉比以前更加微妙和优雅。新设计标题中的搜索框是一个定位良好的新功能。
Plaxo
在这个例子中，我们可以看到网站重新设计的积极和(潜在的)消极结果。旧的设计
新设计
在旧的设计中，Plaxo有一个突出的水平导航条和一个更短的主页。旧设计中的导航菜单被省略了，这意味着依赖该功能的现有用户现在必须重新学习如何浏览网站。
新的设计超过了以前的页面长度，这需要许多用户向下滚动更多来访问所需的信息。然而，新的设计有一个明确的行动呼吁，以优化新的网站访问者。它有一个干净的布局，突出了重要的网站功能。
它有更好的内容，可以回答潜在新用户对应用程序的许多问题。
ThinkGeek
ThinkGeek的最新版本就是一个很好的重新设计的例子。旧的设计
新设计
在旧设计中有效的组件被保留，然后稍加改进。
例如，左边的垂直导航菜单被保留在原来的位置，只是重新设计了字体，使其更容易阅读，在视觉上更有吸引力。搜索框被重新定位，以减少人们在网站上搜索特定产品所需的眼睛和鼠标移动。现在它与垂直导航菜单进行了适当的分组，因为这些组件是相互补充的。
此外，还添加了水平导航条和购物车状态信息等新功能。这种设计不仅使网站更漂亮，而且还修复了页面布局，并融入了有用的功能。
Joyent
当我第一次看到Joyent的旧设计时，我并没有意识到该公司提供了什么，直到我阅读了他们网站的内容。
旧网站的设计主题——尽管独特且具有视觉吸引力——似乎并没有明确地支持和表明公司的业务。旧的设计
新设计
更新后的设计非常棒。它保留了旧设计的有用网站导航。
新的设计在美学上更简洁，可能对IT经理、cto、服务器管理员等典型用户更有吸引力。新设计增加了一些有用的组件，比如公司的联系信息(位于网站头部的显著位置)，侧边栏的行动呼吁按钮，以及页脚的内部页面导航，这对现有和潜在用户都很有用。
Mozilla
Mozilla网站似乎总是有引人注目的设计。
Mozilla的重新设计通常包含创新的设计技术和有用特性的添加。旧的设计
新设计
实用功能保持不变，并添加了一些新的功能;也就是说，一个电子邮件时事通讯注册表单和一个突出显示特色内容的幻灯片。新的网页布局看起来不那么杂乱，主要是因为超链接的减少和设计元素之间的空白的使用。
丽
REI是重新设计站点以包括有用的新技术和技术的一个很好的例子。旧的设计
新设计
主导航方案和信息架构保持相对不变。作为一个电子商务网站，通过改变他们可能已经习惯的东西来惹恼忠实的客户，这意味着在网站重新设计时应该谨慎对待导航等内容。
使用图像滑块和多层次水平导航条是新网页设计的两个主要变化。
戴夫·威尔金森
这里我们有一个重新设计网页开发者作品集网站的例子。Web开发人员和网页设计师以快速重新设计自己的网站而闻名，通常是为了反映最新的设计趋势。
旧的设计
新设计
旧设计和新设计之间的差异非常大。几乎一切都变了。标志和标语，颜色，设计风格，布局，网站副本的个性，信息密度——他们都得到了改进。
Etrade
Etrade的重新设计更像是一次重新调整，而不是一次全面的重新设计。旧的设计
新设计
大多数布局的组件都没有改变，即使改变了，也只是很小的修改。然而，所发生的是一些设计元素被重新定位。
虽然取消了左侧垂直导航菜单，但链接被重新定位到其适当的位置，即主要的水平导航条，减少了链接可能位于哪个菜单的混淆，并释放了一些空间。
结论
重新设计一个网站是一个诱人的想法。在我们致力于这项努力之前，我们必须首先仔细计划和考虑一些重要的考虑因素。
主要是，我们应该确定重新设计是否是我们真正需要做的事情。一个网站的重新设计不仅仅意味着改变网站的外观，它是添加缺失的功能，解决设计缺陷，重新组织信息架构，删除不必要的组件来整理用户界面和增强功能。
参考资料及进一步阅读
- 重新设计万岁
- 优秀的设计师会重新设计，伟大的设计师会重新调整
- 7个网站设计技巧
相关内容
- 创造永恒的用户体验
- 当前的网页设计趋势是否将我们推回到1999年?
- 网页设计中的还原论
