毫无疑问，你是没有第二次机会来给人以“第一印象”。每个网站从首页到子页面都是介绍产品、提供服务、探讨功能，唯有“关于我们 ”这个页面是关乎产品和服务的创建者——我们自己，也是为什么它如此的重要。

　　一个成功的“关于我们 ”不仅仅是将品牌、公司和团队信息填满一个页面那么简单粗暴，你需要将团队和品牌视作一个整体，呈现出独有的风格，不同的个性，让用户记住。

　　这听起来似乎是一件特别棘手的事情，但是仔细推敲整理，实际并不复杂。选择走肾的设计技巧，挑个或现代或简约的匹配自家品牌的风格，用最走心的方式展现自己的团队，这就够了。

　　听起来玄乎，不如看看别人家的案例来的直观。

　　01. 醒目的色彩和鲜亮的配色

　　严格的色彩搭配和醒目的色调选取，使得Rook 的“关于我们”页面的设计看起来简单而突出。醒目的金色贯穿整个设计，从LOGO到图像、排版都保持着一致性。

　　在图片和成员照片的处理上，设计师采用了单色的色彩滤镜，这让关于我们页面 在色彩上更加严格也更加统一，品牌化的设计在这里一览无余。

　　02. 手绘排版和简单的图片

　　Madebyband 的“关于我们”页面的设计比较不同，结合品牌的特征，当然也是为了表现个性，他们的页面运用了许多手绘的字体和排版，配合手工制作品的图片，传达品牌的个性。整个页面设计简洁，大量的留白也平衡了页面的结构。

　　所以，无论是自定义的字体还是自定义的图片，都是呈现品牌性格表现团队差异化的可靠手段。

　　03. 俏皮的插画和活泼的配色

　　“关于我们”的页面中最常见的信息就是团队的照片和地点等内容，那么为什么要用传统而死板的方式来呈现呢?Pulp Fingers 就没有这么做，设计师挑选了三种色彩来制作尖锐而极具风格的插画，这种风格不仅漂亮而且有趣，独特而足够引人入胜。作为企业的“关于我们”页面绝对独具一格，令人难忘。

　　04.专业的团队合影和整饬的排版

　　“关于我们”的页面中，团队成员照片非要是单独个人的么?并不一定，专业的合影也是不错的选择(一群人随意地站在某栋楼门口的楼梯上拍摄，这样的合影中国人有过太多，谈不上专业，放这里通常都非常的违和)。这种专业的团队成员摄影有不少企业做过，很容易做得过于“商业风”，做得有风格也恰到好处的并不多，有兴趣的同学可以找找锤子科技团队的男神合照，大概也有Jam3团队合影的风格。

　　Jam3 团队选择的是统一的黑色服装，在深色背景衬托下逼格四射，质感十足，成熟而精美，是绝对的焦点。搭配这个图片的排版和背景都非常的现代而清爽，主次分明。

　　当然，这种合照存在的问题在于，团队成员如果变动的话，你得重新照一次……如果这个不是问题的话，那就来一发吧。

　　05. 醒目的标题和有趣的动画

　　如果想让客户、未来的员工和同事们确切地了解你们的品牌价值的所在，那么为什么不把这些核心的内容直接醒目地写出来呢?Purple, Rock, Scissors 就是这么做的。这个“关于我们”的页面还有两个地方非常贴心，一个是短视频背景，它很好地展现了工作环境和整体氛围;另外一个是团队成员头像的设计，鼠标悬停的时候，你可以看到其中人物表情变化的动效，不仅贴心而且有趣。

　　06. 双色搭配和大胆的插画

　　Mike Kus 的“关于我们”的页面设计采用了独特的双色配色，前景色是黄色，背景色是红色，双色搭配的优势在于它极强的凝聚力，这样的风格通常厚重而复古，而且可以很好地强化品牌色给人的感觉。另外一个引人入胜的地方就是其中大胆的插画——大脑。

　　当然，配设在整个设计中起到了决定性的作用，要作出靠谱的配色并不容易，不妨在优设首页的搜索框中搜搜配色，会有惊喜哦。

　　07. 整洁的图形和信息可视化

　　是否你也会更喜欢视觉突出的图形而非整片的文字呢?那么你看看Huge公司的“关于我们”页面吧。这家公司用先锋而大胆的配图来呈现他们的独特之处，硕大而简洁的标题文字让这些配图更加富有张力，同时还传达出他们的企业价值观。

　　如果图形化是设计的核心的话，信息图的使用就顺理成章了。关键的信息用信息图来表现，不仅贴合网站的整体风格，还能让用户更轻松地接受网站传递的信息。

　　08. 整齐的排版和温暖的色调

　　坦率的讲，栅格运用的最多的地方还是传统媒体，网络媒体运用栅格的方式与之还是有差别的。不过Studio Alto的网页证明了一点：网页排版一样可以借助栅格做到类似传统屏幕印刷行业的排版样式。页面中暖色调的运用，让整个页面的更加风格化，这种类似牛皮纸的色彩令整个页面的质感更上一层楼了。

　　09. 简单的布局和干净的留白

　　设计网页的时候，留白是重要的工具和元素，掌控留白的使用技巧非常有必要。Made By Shape的“关于我们”页面的设计就是这样的一个案例，棱角分明的形状和不同的区块被留白清晰地分割开，柔和的色调赋予页面以时尚感和生命力。如果你所设计的页面内容信息量很大，不妨好好运用留白吧。

　　10. 可视化的时间轴和吸引人的配色

　　如果要展现一个产品的发展历程，没有什么比时间轴更加合适了。Moz 的这个关于我们的页面设计就充分运用了这一元素。时间轴并非是固定的图片，其中的事件和内容是可以同用户进行交互和互动的。如此一来，整个时间轴便可以向用户讲述整个故事，让用户也感受到参与感。整个设计的另外一个亮点是它的配色。

　　11. 插画式图片和温暖的基调

　　你们是否拥有一个强大的幕后团队呢?如果是，不妨在“关于我们”页面中好好地展现他们。其实Food Studio 的这个页面的设计并不涉及过于复杂的技巧，他们只是将团队成员的头像更换为插画风，配合温暖的基调，让整个页面的风格一下就脱颖而出。这样的设计最重要的一点是统一，一致性是风格化的基础。

　　12. 大胆的用色和超大的团队照片

　　如果你想让你的设计更加突出更有影响力，不妨试着让一些元素更大，让配色更加亮眼。正如Mixd 所设计的，用高清的团队成员大图来突出每个成员的存在感，加上高对比度的色彩搭配，整个设计看起来也非常不错。值得注意的是，挑选合适的元素放大，不要全都放大，这样就没有重心了。

　　13. 时尚的图片和简约的布局

　　Kingdom Coffee and Cycles 的整个设计可以说是现代风设计的典范，布局简单，时尚的图片，干净整齐，色彩明亮。图片是整个页面的视觉设计的重心，图片、视频、地图的混合搭配消解了页面的单调和简单的特质。技巧上，设计师使用了团队的Instagram的作品做成拼贴置于页面底部，看起来也非常时尚有趣。

　　14. 简洁的图形和锋锐的线条

　　这种类型的网页设计 走的是时尚现代风，干净的外观，轻量级的图片选取，大量的留白和整齐的排版，非常专业也非常的养眼，堪称完美的框架可以承载多种多样的内容。同时，这个页面的设计案例也同样展现出留白的重要性。

　　15. 大胆的提亮色和高亮信息

　　6tematik 的关于我们页面 设计非常有意思。黑白配色永远不会过时，但是在某些情况下黑白并不足以满足全部的需求，这个页面就使用了高饱和度的红色来蓝色来作为提亮色，大胆而有效。要注意的地方在于，你高亮的信息越多，高亮的效果就越差，因为高亮的地方越多，用户越难于发现真正重要的地方。所以，你要做的是标记出真正重要的事情。

　　16. 大留白和小元素

　　大和小在很多情况下都是对比出来的。Margin 通常指的是主体周围的边缘、留白和边界。较小的边界可以让主体更有张力，覆盖更大的范围。但是Alfred 的关于我们页面 并没有这么做，大量的留白、宽广的边缘让整个页面看起来文艺气息十足，简约而轻松。虽然这样的设计并不常规，但是也正是这种非常规的设计让整个页面充满了独特的风格与调性。

　　17. 独特的字体和个性化的档案

　　独特的手写字体赋予Big Cartel的页面以一种不同凡响的张力，虽然简单，但是让设计大放异彩。个性化的员工档案同上方别具一格的字体一样独特，参差多态的设计让整个页面在气息上保持了一致性。当你点击员工头像的播放按键的时候，会播放一段颇有性格的视频，独树一帜。

　　18. 模块化布局和温暖的色彩

　　当你看到这个页面的时候，我想你也会注意到它独特的设计：页面的区块是精心分割出来的，从上到下每一块的内容都会承上启下，上一块引出下一块，就像梯子一样。这样一来，模块化的页面也显得很有条理，整齐而又自由。页面的配色和用图也是非常讲究的，黑白的基调配合温暖的棕色，创造出温馨的氛围。

　　19. 醒目的色彩和大胆的图片

　　Visionaire的用色简直是大胆的典型，红色Banner的使用极为抓人眼球，还和品牌用色相互呼应。错落的排版和别具一格的图片使用让用户不会轻易忘记这个不同一般的网站。信息图的使用也是这个关于我们页面的特色。

　　20. 强对比和复古插画

　　Woah Nelly Catering 的关于我们页面并没有追随最流行的设计手法，而是采用了温暖怀旧的色调和设计元素来营造氛围，鲜艳漂亮的插画不仅让页面充满活力，而且也简单直观。复古插画的微妙之处在于其中添加了纹理，让它质感非常不错，这也让白底黑字的元素可以更加显眼突出，构成对比。

　　21. 整洁的配色和均衡的排版

　　漂亮的无衬线字体、均衡的排版和均匀光洁的配色让EB Pearls 的关于我们页面看起来专业无比。合理的留白和浅色的图片的使用给人一种优雅的感觉。

　　22. 柔和的色彩和简单的插画

　　很多时候设计并不是越复杂越好，EVA Black Design的关于我们页面使用简单的设计反而更容易营造时尚现代的感觉。简约的暖色调图片同黑白灰配合在一起，给人以柔和的感觉，点缀以简单的插画，让整个页面在整饬的设计之下还拥有了些许个性。

　　23. 动效和富有冲击力的排版

　　想让你的设计栩栩如生富于生命力?那么让它们动起来好了!用短视频替代图片，或者使用GIF图片，这也都是目前流行的设计手法。纯黑色的文本和红色的元素的使用，让整个页面充满了个性，也让排版充满了冲击力。

　　24. 创意排版和吸引力十足的图片

　　图片居中的独特排版是这个关于我们页面的有趣之处，而团队成员的照片也正好居于这样的位置，这使得两边的档案信息排版需要向中间对齐。复古元素和配色的使用则支撑起了整个页面的设计，值得学习哦。

　　25. 大胆的布局和色彩滤镜

　　大胆使用独特的、先锋的布局是令人难忘的重要手段，同时搭配以个性十足的配色，效果绝对不错。干净的无衬线体的选择，色彩滤镜下的图片，都是这个关于我们页面的突出之处。

　　26. 活泼的氛围和活泼的色彩

　　Ghostly Ferns 的关于我们页面 通过大胆鲜明的色彩来营造出愉悦而活泼的氛围，而文案上的选取也选择了活泼幽默的方向。对于有类似需求的团队而言，布局是需要考虑的，但是配色和文案更重要。你要让你的团队“发声”，内容的角度和视觉上的感受是最重要的，两者匹配，则能够传达清晰的概念。

　　27. 极简元素与冷色调

　　现代极简风同冷色调本就是同源的设计。当你的关于我们页面 中有许多团队相关的照片，选择色调一致的图片，这样可以营造出凝聚力。Gin Lane的页面就是这么设计的，极简风的布局之下，图片都经过滤镜处理，呈现出黑白色冷峻的色调，这使得整个页面酷了起来。

　　28. 设计元素集群与平衡的设计

　　不同于其他的关于我们设计，Meg long Creative 的关于我们页面 并没有将图片、文字、装饰性元素彻底分开，而是错落地摆放在一起。乍一看这种设计很凌乱，实则这种近乎平面设计的设计手法带来的设计是精心设计的，它平衡而不失调，错落而不凌乱。如果你也是从平面设计转行的网页设计 师，不要忘了曾经的设计手法!

　　29. 大胆的色彩和可视化流程图

　　如果你一直在酝酿一个大胆的配色方案，那么请务必确保这套设计方案其他的地方直接、干净、简单。Image Conscious Studios 的关于我们就是这样做的，黑白灰和显眼的黄色让整个配色非常惊艳，与之搭配的布局则足够简约时尚，两者相辅相承。

　　此外，为了让用户更好消化页面的内容，他们采用圆形的区块来构建流程和理念说明，这样会让信息更容易被消化。

　　30. 几何布局和鲜艳的色彩

　　锋利的几何形状、冷峻的色彩、大量的留白是现代设计中常见的设计思路，它能让页面看起来更加时尚专业。将每个元素都用锋利的形态呈现出来，在独特的栅格系统中平衡整个布局，适当地使用鲜艳的色彩来提亮页面，这就是Joy Intermedia 页面设计时所用的手法。稳固的结合结构不仅能让页面看起来更舒服，而且能够合理地引导用户浏览内容。

　　31. 风格化的照片和鲜明的对比

　　Mr President 的关于我们页面采用了一种独特而高效的技法来体现他们的风格。经典的黄黑配色不仅有足够的对比度，而且易于营造出整个页面独特的风格。非传统的复古图片的使用同配色体系极其搭配，而白色的LOGO在整个页面中起到一定的平衡作用，令整个页面的独特风格更加浓郁了。

　　32. 大标题与动人的视觉效果

　　如果你喜欢用巨大的文字来强调设计，那么你会喜欢Neotokio 的这个关于我们的页面设计。巨大的文字标题是如此的令人瞩目，近乎夸张的文字尺寸让双眼不会错过重要的事情。加上视觉化的信息图和明亮的蓝色，页面的丰满度和信息量得到了提升，品牌的独特性格也借由色彩在此表现了出来。

　　33. 简单的视觉设计和清爽的搭配

　　Focus Lab 是一个风靡Dribbble 和Behance的著名设计团队，他们的设计作品带有浓郁的风格，他们干净清爽的视觉设计能如同迎面一击一样打中用户的双眼。这些简单、优雅有令人难忘的设计手法同样展现在他们的“关于我们”页面上。干净的字体、微妙的标识、红色的品牌色以及优雅的图片，搭配在一起共同构建出这个页面。

　　34. 超大尺寸LOGO与整齐的排版

　　你的团队是否拥有一个炫酷的LOGO?那么不要客气，在关于我们页面中大胆地秀出来吧，用超大尺寸的LOGO来让用户记住你们独特的品牌。与此同时，这种巨大的LOGO设计可以在视觉上为简约而整齐的布局进行补充，让页面不再显得单调简单。

　　35. 涂鸦插画和引线

　　手绘的涂鸦插画和现实存在物品在页面中穿插，错落地搭配在一起能够营造出俏皮的效果，借助引线将所有的物品穿在一起，则能够消解杂乱，理出思路，呈现条理，让用户更加易于了解。如果在搭配上漂亮的色彩，我想这个关于我们页面也算是完满了!

　　36. 显眼的荧光色与几何形状

　　荧光色是近几年来最流行的色彩之一，甚至在iOS7阶段，荧光色起到极为重要的作用。活力四射的荧光色足够赋予页面足够的性格和情绪，配合现代感十足的黑体字和几何形状，简简单单的就打造出一个活泼的页面组合。

　　这种设计还需要注意一些技巧，标题文字的类型和几何形状的选取一定要有棱角有性格。这种大胆而现代的设计风格并不难做，荧光色的选取也不要缩手缩脚，大胆选取不会错。

　　37. 图片拼贴和大留白

　　我们已经看到过很多极简、干净而整齐的关于我们页面了，但是这些图片多是精心处理过的。那么如果要放上类别众多风格不同的照片，要如何处理呢?Social print studio 的关于我们页面就借助图片拼贴成功地解决了这个问题。既然图片是整个设计的核心，那么挤入过多的文字容易让这个页面过于拥挤，所以，留白在这个页面中也很重要。

　　38. 复古配色和天马行空的配图

　　复古风格的关于我们页面通常拥有着温暖色色调和俏皮的插画，在配上传统的布局手法，就堪称完美了。Kittie’s Cakes 的页面中散落着许多简单但是极为欢快有趣的插画，这些天马行空的配图让整个设计一下就拥有了强烈的风格和个人特色。复古的配色和层次丰富的页面结构，让用户在获取信息的同时还不时地收到惊喜。

　　39. 温暖的配色和清爽的形状

　　这个名为 Story and Heart 的关于我们页面设计非常的温暖，同时还保持着专业和时尚的特征。简单清爽的方块是整个页面布局的基础，图片中粗粝的质感和丰富的纹理让页面细节分量十足。

　　40. 深沉的色调和对齐排版

　　曾有人说过，黑色的页面设计是最考验设计师手艺的。Always Creative 的这个页面采用的是用不过时的黑色为底色，在深沉的色调映衬下的布局显得锐利而神秘，明显的间隔让页面元素之间的对齐关系显得无比清晰，整饬的布局显得时尚而难忘。值得注意的是，黑色系页面在用色的时候一定要注意，黑色不能太深沉。

　　41. 干净的布局和视觉化的设计

　　设计“关于我们”页面的目的是要让用户了解你的团队和公司，正如同Substrakt所做的这样，将团队的各种特质用图片和文字区块清晰地分割、展现出来，让用户有清晰的认知。

　　42. 对称排版和微妙的配色

　　垂直均分为两半的页面设计，可以营造出对称的效果，轻松治疗处女座用户对于各类非对称元素的不适(笑)。整个页面的配色并不多，色调选取微妙，考验设计师的配色功底。在控制页面细节的时候，请务必控制好尺寸、粗细和空间上的对应关系。

　　43. 几何布局和单色设计

　　谁规定了团队成员档案和图片一定要是原型或者矩形?其实菱形也可以!Globule Bleu 的关于我们页面中，菱形的用户头像组成的矩阵，看起来非常显眼。别具一格的黑白色调让页面风格化十足，点缀页面同时也用作视觉标记的一抹黄色则让整个页面活了起来。

　　44. 干净的布局和响应式图片

　　这个页面你一定要打开体验一下，再接着看文章。这绝对是一个屌炸天的关于我们页面!当光标移动到头像上，黑白头像变彩色，这个你能猜到，而你猜不到的是，页面中每个成员的头像都是响应式的，它会跟随着光标移动!

　　45. 混合多媒体和可视化历史记录

　　Ugmonk 是一个颇为有名的设计团队，他们致力于自己制作各类设计感十足的生活用品。在他们的关于我们页面当中，各类多媒体都得到了充分的运用：图片、文字、视频、地图、时间轴。整个页面的配色走的同样是清新时尚的路线，丰富的内容搭配方式让这种配色显得厚度十足。

　　46. 扁平化的配色和干净的布局

　　Studio Cinco的关于我们的页面设计不仅仅是用色大胆而鲜艳，而且在文案选取上一样直接到位。扁平化的区块承载着他们的想法，干净的布局和整个配色非常搭。如果你也喜欢这样的设计，请务必保证页面有视觉中心。

　　47. 优雅的排版和简约的图片

　　Huuman 的关于我们页面风格非常简约，这很大程度上因为他们的图片选取非常简约。漂亮的扁平风布局，排版优雅而细腻，但同时，其中承载的内容可以非常有趣，比如某个成员的游戏分数，办公室中豢养的萌猫的数量，等等等等。

　　48. 错位的图片和风格化配色

　　Nclud 的关于我们页面的设计是如此的大胆而先锋，这种如同“故障”了一般的页面设计和激进的配色方案会让用户过目不忘的。这种令人难以置信的设计方式非常的引人入胜。这种设计风格难点在于，你要让所有的设计元素都为你的设计而服务。

　　49. 优雅的插画和浪漫的配色

　　不同于其他的案例，Feather and Stone 的关于我们页面采用了手绘插画来表现他们的独特之处。由于他们是婚礼摄影师，所以这种浪漫的表现手法就显得恰到好处。

　　50. 手绘插画和个性化

 

　　Loud Noises 的设计师不仅仅在关于我们页面中采用了独特的插画，而且他们别具匠心地使用了更加创新、更加个性化的信息表达方式。他们并没有在页面中大谈现在和未来，更多的是追本溯源，走心也走肾。清晰的无衬线体和粗糙的插画形成对比，构成独特的反差，个性十足。