”关于我们”页面设计（上）
毫无疑问，你是没有第二次机会来给人以“第一印象”。每个网站从首页到子页面都是介绍产品、提供服务、探讨功能，唯有“关于我们”这个页面是关乎产品和服务的创建者——我们自己，也是为什么它如此的重要。
一个成功的“关于我们”不仅仅是将品牌、公司和团队信息填满一个页面那么简单粗暴，你需要将团队和品牌视作一个整体，呈现出独有的风格，不同的个性，让用户记住。
这听起来似乎是一件特别棘手的事情，但是仔细推敲整理，实际并不复杂。选择走肾的设计技巧，挑个或现代或简约的匹配自家品牌的风格，用最走心的方式展现自己的团队，这就够了。
听起来玄乎，不如看看别人家的案例来的直观。
严格的色彩搭配和醒目的色调选取，使得Rook 的“关于我们”页面的设计看起来简单而突出。醒目的金色贯穿整个设计，从LOGO到图像、排版都保持着一致性。
在图片和成员照片的处理上，设计师采用了单色的色彩滤镜，这让关于我们页面在色彩上更加严格也更加统一，品牌化的设计在这里一览无余。
Madebyband 的“关于我们”页面的设计比较不同，结合品牌的特征，当然也是为了表现个性，他们的页面运用了许多手绘的字体和排版，配合手工制作品的图片，传达品牌的个性。整个页面设计简洁，大量的留白也平衡了页面的结构。
所以，无论是自定义的字体还是自定义的图片，都是呈现品牌性格表现团队差异化的可靠手段。
“关于我们”的页面中最常见的信息就是团队的照片和地点等内容，那么为什么要用传统而死板的方式来呈现呢？Pulp Fingers 就没有这么做，设计师挑选了三种色彩来制作尖锐而极具风格的插画，这种风格不仅漂亮而且有趣，独特而足够引人入胜。作为企业的“关于我们”页面绝对独具一格，令人难忘。
“关于我们”的页面中，团队成员照片非要是单独个人的么？并不一定，专业的合影也是不错的选择（一群人随意地站在某栋楼门口的楼梯上拍摄，这样的合影中国人有过太多，谈不上专业，放这里通常都非常的违和）。这种专业的团队成员摄影有不少企业做过，很容易做得过于“商业风”，做得有风格也恰到好处的并不多，有兴趣的同学可以找找锤子科技团队的男神合照，大概也有Jam3团队合影的风格。
Jam3 团队选择的是统一的黑色服装，在深色背景衬托下逼格四射，质感十足，成熟而精美，是绝对的焦点。搭配这个图片的排版和背景都非常的现代而清爽，主次分明。
当然，这种合照存在的问题在于，团队成员如果变动的话，你得重新照一次……如果这个不是问题的话，那就来一发吧。
如果想让客户、未来的员工和同事们确切地了解你们的品牌价值的所在，那么为什么不把这些核心的内容直接醒目地写出来呢？Purple, Rock, Scissors 就是这么做的。这个“关于我们”的页面还有两个地方非常贴心，一个是短视频背景，它很好地展现了工作环境和整体氛围；另外一个是团队成员头像的设计，鼠标悬停的时候，你可以看到其中人物表情变化的动效，不仅贴心而且有趣。
Mike Kus 的“关于我们”的页面设计采用了独特的双色配色，前景色是黄色，背景色是红色，双色搭配的优势在于它极强的凝聚力，这样的风格通常厚重而复古，而且可以很好地强化品牌色给人的感觉。另外一个引人入胜的地方就是其中大胆的插画——大脑。
当然，配设在整个设计中起到了决定性的作用，要作出靠谱的配色并不容易，不妨在优设首页的搜索框中搜搜配色，会有惊喜哦。
是否你也会更喜欢视觉突出的图形而非整片的文字呢？那么你看看Huge公司的“关于我们”页面吧。这家公司用先锋而大胆的配图来呈现他们的独特之处，硕大而简洁的标题文字让这些配图更加富有张力，同时还传达出他们的企业价值观。
如果图形化是设计的核心的话，信息图的使用就顺理成章了。关键的信息用信息图来表现，不仅贴合网站的整体风格，还能让用户更轻松地接受网站传递的信息。
坦率的讲，栅格运用的最多的地方还是传统媒体，网络媒体运用栅格的方式与之还是有差别的。不过Studio Alto的网页证明了一点：网页排版一样可以借助栅格做到类似传统屏幕印刷行业的排版样式。页面中暖色调的运用，让整个页面的更加风格化，这种类似牛皮纸的色彩令整个页面的质感更上一层楼了。
设计网页的时候，留白是重要的工具和元素，掌控留白的使用技巧非常有必要。Made By Shape的“关于我们”页面的设计就是这样的一个案例，棱角分明的形状和不同的区块被留白清晰地分割开，柔和的色调赋予页面以时尚感和生命力。如果你所设计的页面内容信息量很大，不妨好好运用留白吧。
如果要展现一个产品的发展历程，没有什么比时间轴更加合适了。Moz 的这个关于我们的页面设计就充分运用了这一元素。时间轴并非是固定的图片，其中的事件和内容是可以同用户进行交互和互动的。如此一来，整个时间轴便可以向用户讲述整个故事，让用户也感受到参与感。整个设计的另外一个亮点是它的配色。
你们是否拥有一个强大的幕后团队呢？如果是，不妨在“关于我们”页面中好好地展现他们。其实Food Studio 的这个页面的设计并不涉及过于复杂的技巧，他们只是将团队成员的头像更换为插画风，配合温暖的基调，让整个页面的风格一下就脱颖而出。这样的设计最重要的一点是统一，一致性是风格化的基础。
如果你想让你的设计更加突出更有影响力，不妨试着让一些元素更大，让配色更加亮眼。正如Mixd 所设计的，用高清的团队成员大图来突出每个成员的存在感，加上高对比度的色彩搭配，整个设计看起来也非常不错。值得注意的是，挑选合适的元素放大，不要全都放大，这样就没有重心了。
Kingdom Coffee and Cycles 的整个设计可以说是现代风设计的典范，布局简单，时尚的图片，干净整齐，色彩明亮。图片是整个页面的视觉设计的重心，图片、视频、地图的混合搭配消解了页面的单调和简单的特质。技巧上，设计师使用了团队的Instagram的作品做成拼贴置于页面底部，看起来也非常时尚有趣。
这种类型的网页设计走的是时尚现代风，干净的外观，轻量级的图片选取，大量的留白和整齐的排版，非常专业也非常的养眼，堪称完美的框架可以承载多种多样的内容。同时，这个页面的设计案例也同样展现出留白的重要性。
6tematik 的关于我们页面设计非常有意思。黑白配色永远不会过时，但是在某些情况下黑白并不足以满足全部的需求，这个页面就使用了高饱和度的红色来蓝色来作为提亮色，大胆而有效。要注意的地方在于，你高亮的信息越多，高亮的效果就越差，因为高亮的地方越多，用户越难于发现真正重要的地方。所以，你要做的是标记出真正重要的事情。
大和小在很多情况下都是对比出来的。Margin 通常指的是主体周围的边缘、留白和边界。较小的边界可以让主体更有张力，覆盖更大的范围。但是Alfred 的关于我们页面并没有这么做，大量的留白、宽广的边缘让整个页面看起来文艺气息十足，简约而轻松。虽然这样的设计并不常规，但是也正是这种非常规的设计让整个页面充满了独特的风格与调性。
独特的手写字体赋予Big Cartel的页面以一种不同凡响的张力，虽然简单，但是让设计大放异彩。个性化的员工档案同上方别具一格的字体一样独特，参差多态的设计让整个页面在气息上保持了一致性。当你点击员工头像的播放按键的时候，会播放一段颇有性格的视频，独树一帜。
当你看到这个页面的时候，我想你也会注意到它独特的设计：页面的区块是精心分割出来的，从上到下每一块的内容都会承上启下，上一块引出下一块，就像梯子一样。这样一来，模块化的页面也显得很有条理，整齐而又自由。页面的配色和用图也是非常讲究的，黑白的基调配合温暖的棕色，创造出温馨的氛围。
Visionaire的用色简直是大胆的典型，红色Banner的使用极为抓人眼球，还和品牌用色相互呼应。错落的排版和别具一格的图片使用让用户不会轻易忘记这个不同一般的网站。信息图的使用也是这个关于我们页面的特色。
Woah Nelly Catering 的关于我们页面并没有追随最流行的设计手法，而是采用了温暖怀旧的色调和设计元素来营造氛围，鲜艳漂亮的插画不仅让页面充满活力，而且也简单直观。复古插画的微妙之处在于其中添加了纹理，让它质感非常不错，这也让白底黑字的元素可以更加显眼突出，构成对比。
漂亮的无衬线字体、均衡的排版和均匀光洁的配色让EB Pearls 的关于我们页面看起来专业无比。合理的留白和浅色的图片的使用给人一种优雅的感觉。
很多时候设计并不是越复杂越好，EVA Black Design的关于我们页面使用简单的设计反而更容易营造时尚现代的感觉。简约的暖色调图片同黑白灰配合在一起，给人以柔和的感觉，点缀以简单的插画，让整个页面在整饬的设计之下还拥有了些许个性。
想让你的设计栩栩如生富于生命力？那么让它们动起来好了！用短视频替代图片，或者使用GIF图片，这也都是目前流行的设计手法。纯黑色的文本和红色的元素的使用，让整个页面充满了个性，也让排版充满了冲击力。
图片居中的独特排版是这个关于我们页面的有趣之处，而团队成员的照片也正好居于这样的位置，这使得两边的档案信息排版需要向中间对齐。复古元素和配色的使用则支撑起了整个页面的设计，值得学习哦。
大胆使用独特的、先锋的布局是令人难忘的重要手段，同时搭配以个性十足的配色，效果绝对不错。干净的无衬线体的选择，色彩滤镜下的图片，都是这个关于我们页面的突出之处。
designschool
译文地址：优设
优设译者：@陈子木