网站模板图片精选：网页设计领域的优质资源网站推荐

设计类网站推荐如下：

图巨人

网站简介：图巨人专注于提供优质设计素材下载服务。涵盖企业荣誉文化墙、党建文化墙、背景图片展板、免抠元素、节日海报素材、psd素材等，每日更新内容丰富。

官网链接：

觅知网

网站简介：专注于原创版权设计模板图片素材下载。提供超过200万PPT模板、海报、PNG素材、背景、插画、元、摄影图片、字体、视频、音频素材等，会员可免费下载。

包图网

网站简介：针对初学者，包图网是一个提升设计技能的工具。网站提供各种平面广告、音频、视频、PPT、简历等参考模板，助力设计师成长。

40个网页设计优秀案例

关于我们页面的设计并不简单，但要设计出一个完美的版本则更加不易。这通常取决于你的出发点，是追求个性化设计还是品牌化运作？是展示联系方式还是获取用户联系方式？以下优秀案例将为你展示如何设计一个出色的关于我们页面。

1、友好的界面

友好的联系人界面让人感到亲切，若具备功能性和易读性，用户将更加舒适。“What can we help you with”引导用户点击“加入我们”“聘用我们”以及参与邮件订阅。

2、展示全球各地办公室

Tool的关于我们页面用醒目的字体标注出团队在洛杉矶、纽约和法国的办公室地址和联系方式，方便用户获取信息。

3、简化沟通流程

Productiong Location的联系我们页面采用大胆而视觉化的设计，但与其他同类页面不同的是，它简化了沟通流程，将用户可能关注的内容和需要沟通的具体部分划分，引导用户直接到达特定页面和部分。

4、头像和个性化信息

展示设计师和团队成员的图片，让用户认识你。头像可以增加页面个性化，使其更加真实亲近。

5、鼓励用户沟通

关于我们页面的核心设计目的是沟通，Hello Innovation的页面设计充分贯彻这一思路，用亲切的设计鼓励用户主动与网站沟通。

6、用图片传递隐喻

设计博物馆中的电话不仅是网站的藏品，而且作为一个重要的隐喻向用户传递“沟通”的意象。

7、创造令人难忘的设计

古怪的设计和有趣的文案总能让人难忘，但对于某些品牌和网站而言，独树一帜的创意更能吸引眼球。

8、表现品牌性格

在关于我们页面中展示品牌性格是合理的，Boone Selections通过独特的排版和滚动式页面设计，营造出独有的品牌气息。

9、展示联络方式

This Also的关于我们页面设计可靠到位，页面地图标注公司地点，向下滚动页面可看到详细地址、地铁乘坐方式、沟通电子邮件地址、电话等信息。

10、给个提示

Deux Huit Huit的关于我们页面设计直观简单，顶部“Say hello”的对话框直接提示用户输入内容，方便开发者查看。

11、标明开门/工作时间

对于有具体营业时间的机构，如餐厅、博物馆、商店等，在关于我们页面标注开门时间和电话咨询时间，方便用户有效接受服务。

12、使用醒目的字体

Panache的关于我们页面标题字体采用醒目的“Travaillons Ensemble”，具有极高的识别度。

13、使用大胆的配色方案

Sponge的关于我们页面采用经典的黑白黄配色方案，强对比的配色和细致的细节刻画，使页面看起来锐利又富有质感。

14、采用形象化的插画

Legwork Studio的关于我们页面加入狼头人插画，配合手写字体，营造出个性化的氛围。

15、使用简约的图形

Giampiero Bodini的关于我们页面在素描背景上放置一个简单的矩形，将联系方式与相关信息置于其中，形成鲜明对比。

16、借助表单沟通

QED Group在联系我们页面留下一个表单，用户可通过表单留下联系方式。

17、使用单色配色

Joseph A Avoue的网站联系我们页面设计简洁优雅，没有华丽的设计和花哨的功能，一个纤细的环，中间是最基本的联系信息，直接明了。

18、诙谐

诙谐的设计师不会错过任何一个逗趣的机会，Bio-Bak的设计师即便在联系我们页面中也巧妙地吸引眼球。涂鸦字体和风趣的文案让人忍俊不禁，你能够从每一个细节感受到这个设计师的诙谐细胞。

19、填写表格

Anakin的关于我们页面同样要求用户填写联系信息，但在表格设计上更具特色，没有独立的表格，而是利用占位符引导用户填写所需内容，体贴、直观，更显用心。

20、个性化的办公场所展示

与第二个案例相似，CPB集团在全球各地设有办公室，但在设计风格上更具独特性，将各地办公室的内容与个性化的背景完美融合，信息整合到位，展示方式独具个性。

21、介绍业务

在关于我们页面中介绍自己并不罕见，但除此之外还有许多可以尝试的方式，例如介绍自家业务，展示品牌形象，吸引用户交流也是一种不错的方法。Hello Monday的关于我们页面正是如此。

22、视频背景

在网站中添加视频背景已成为一种流行趋势，而Moodboard作为电影制作工作室，在关于我们页面中使用视频背景不仅符合其团队性质，还使页面更具活力。

23、运用网格布局

要设计结构化的页面，网格是你的最佳助手。Urban Influence的关于我们页面运用网格组织信息，展示内容、用户输入区域、装饰部分和地图等元素界限清晰，布局合理。

24、提升界面友好度

若要提升界面友好度，设计师需付出不少努力。清晰易读的界面设计是基础，信息需清晰传达，配色柔和，呈现方式亲切，交互方式便捷，这些都是设计师需关注的地方。

25、分阶段引导

取得联系涉及一系列操作，若将整个交互过程拆分为若干步骤，逐步引导用户操作，并加入动效和微交互，将带来独特的体验。

26、添加联系人快捷方式

团队中负责不同部分的人员通常不同，用户打开联系我们页面通常有明确目标，如何将FAQ部分融入其中，并添加特定联系人的联系方式，方便用户直接与不同负责人沟通。

27、与网站其他部分融合

Robby Leonardi的网站仿佛一款扁平化风格的电脑游戏，浏览页面时，如同跟随主角穿梭于不同场景，关于我们页面便是其中之一。这是一种融合页面的方式，值得借鉴。

28、团队合照

许多网站背后都有整个开发和设计团队的努力，以团队成员合照作为关于我们页面的背景图，既合理又具个性。

29、运用留白

留白能增强页面的空间感和结构感，Beta Tataki在关于我们页面放置了一个设计感十足的电话，通过留白突出了联系方式等内容的存在感。

30、灵活运用字体排版

精心设计的字体排版不仅具有装饰性，还能承载一定内容。Pauline Osmont的联系我们页面运用黑色、银色和金色构建吸引人的字体排版主视觉设计，页面滚动时，可见易于阅读且排版合理的表格。

31、亲自展示

这也是近几年较为常见的一种内容展示方式，设计师亲自举起展板展示设计作品。若应用于联系我们页面，这种设计师手法也颇具情境感。如Mark Jaworkski的页面，设计师技能、介绍和留言表格整齐地展示在平举的白板上。

32、列举社交媒体联系方式

如今哪个网站没有几个社交媒体账号呢？在关于我们页面中列出自家网站的社交媒体链接，对许多用户来说，更加方便联系。

33、借鉴传统沟通方式

复古风格是不错的选择，但使用传统联系方式设计，似乎更具诚意且有趣。Lionway的联系我们页面设计成明信片形式，一些固定信息直接列举在打印账单上。

34、俏皮文案

文案设计也是联系我们页面中重要的一环，亲切、诙谐的文案设计让人感到亲近，而俏皮、机智的文案同样令人难忘。

35、彰显个性

设计工作室Resn的联系我们页面设计堪称这组案例中最有个性的页面之一，充满80年代风情的设计元素与带着动物头套的团队成员图片构成了页面主体。

36、运用信息图

信息图是近几年一直上升的设计手法，若展示内容合适，在关于我们页面中使用信息图也是不错的选择。Quicksprout的关于我们页面运用信息图呈现内容，清晰易读，准确到位。

37、动画与卡通

在联系我们页面中使用卡通和动漫形象展示设计师和设计团队是一种常见且有效的方式，Melonfree的关于我们页面展示了设计师和开发者的卡通形象。

38、运用半透明图形

人的眼睛总会主动寻找想要关注的内容，所以即使半透明元素叠加，也不会严重影响阅读体验。Indofolio的页面设计充分运用半透明元素，将核心联系方式置于半透明矩形上，透过图形用户仍可看到背景细节，但又不影响关键联系方式的阅读。

39、手绘效果

手绘的联系我们页面，尤其是那些绘制得相当美观的页面，总能让人感受到设计者的用心。Mario Petrone的页面设计就颇具趣味。

手绘的“联系我们”界面，尤其是那些画得相当赏心悦目的界面，总能使用户体会到设计师的细心。Mario Petrone的这个界面设计就非常活泼有趣。

40、仅用一个下拉菜单

Spokes Pedicabs的“联系我们”界面实际上并不能算是一个完整的界面，而是用一个下拉菜单来代替，当你点击导航栏中的链接，会出现这个引人注目的橙色下拉菜单。

网页设计色彩搭配案例分析

橙色又称为橙黄或橘色，其穿透力仅次于红色，色感比红色更温暖。在网页设计中，橙色是一种非常活泼的色彩，给人以高贵而温暖、兴奋而热烈、欢乐与活力的感觉，也是一种令人振奋的颜色。

橙色在网页中的运用范围非常广泛，可以通过变换色调营造出不同的氛围，不仅能够表现出青春活力，也能达到一种稳重的效果。橙色的波长介于红和黄之间，具有健康、富有活力、勇敢自由等象征意义。为了让大家对橙色有更好的理解，下面分别对不同类型网页进行分析。

一.食品饮食类网页设计案例分析

推荐案例：橙色+黄色+深橙色

整个页面以橙色为主，通过不同明度和纯度的“黄”进行调和，页面非常和谐而不显单调。很好地突出了图片，食品图片色调也是相近的，因此不会显得突兀。而利用白色将网页分层，有层次感。

二.娱乐类网页案例分析

推荐案例：深橙色+土黄色+黄色

整个页面是利用深橙和浅黄色的搭配来展现的，使页面看起来更加温暖，深色的铺垫，黄色的文字，达到一种突出而不突兀的视觉效果，赋予了网站生命力。

三.电子商务网站案例分析

推荐案例：橙色+卡其色+绿色

这个案例使用的颜色相对较多，而橙色的导航辅佐明度较高的卡其色，不会显得非常杂乱，反而更加有特色，很活泼。加上利用一些绿色的按钮来点缀页面，页面就显得不那么单调，有万绿丛中一点红的视觉效果。

四.科技发展机构网站案例分析

页面用的色彩相对较杂，但让人感觉乱中有序。大家可以注意到，页面都是采用深红色作为文字，而橙色出现在红色文字的附近，例如顶部的橙底红字，大标题红色小标题橙色，这些元素就使页面乱中有序。

总结：橙色运用得非常多，调整饱和度、纯度都可以达到非常好的视觉效果。当然，在视觉冲击力的同时，可适当采用少许对比色调和缓和于视觉，从而减轻视觉的疲劳度。