提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

即使是在 “联系我们”的页面,也应该有一个完美的用户体验。“联系我们”页面是用户联系企业的入口,如果这个页面既没有足够的信息,也没有足够的吸引力,就很难吸引潜在客户、用户之类的人联系公司,从而错过大好机会。

下面列出了15个优秀的“联系我们”的页面。这篇文章要强调的是:不要忽视“联系我们”页面,它同样重要!

“联系我们”页面举例

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

“Cleverbird”使用了一个超赞的颜色方案,使得“联系我们”页面看上去非常棒!他们在网页的顶部提供了明确友好的引导(条幅)文案来引导用户联系他们。输入框下方的地图背景采用了喜庆的黄色,看上去华丽且吸引人。整体布局非常干净到位,创造出了完美的整体体验。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

这家奥地利公司在网站设计上下足了功夫,“联系我们”页面也不失为其中重要一环。当你在各个模块间滚动时,不同界面会以动画的形式来回移动。动画效果十分精巧,给网站添加了一丝个性色彩,从而形成完美的用户体验。考虑到很多网站缺乏这一个性色彩,这一完美的体验能够鼓励心存犹豫的人联系公司提出疑问或寻求商业机会。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

这家网站为“联系我们”页面拍摄的照片非常棒!它看上去并不是从图库中精选的图片,更像是公司的日常生活照,这拉近了访客和Kin员工之间的距离,这是一种很有效的感觉。除此之外,整个页面设计的干净整洁,同时很好的引导了用户的操作。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

正如一家创意机构给人的感觉一样,这个页面的设计可以堪称是黄金设计。整个版面被恰到好处的分为两部分,大胆使用混搭表现了公司与众不同的一面。其同时证明他们对自己胸有成竹,版面上不同的色彩也恰恰说明了这一点。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

我之所以喜欢这个页面是因为它有一个小的条幅,且有一个行动呼吁按钮。这个按钮并没有明显的说明要“联系我们”,取而代之的是展示“传递你的信息”的方式,让访客同他们分享访客的信息。相比简单的“联系我们”,这种模式更加明确具体,操作价值更加饱满。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

清爽的页面设计使得整个网站的体验显得尤其简单。访客不用做任何事,映入眼帘的条幅,明确友好的提示“嗨,来留个言吧”,这种方式简单又有效,但是精彩不止于此,当你滑到网页底部,页面会显示“如果你迷路了,请给我们打电话”,这看上去有些滑稽的展示,顿时让你的脸上展现一丝笑容。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

该网站的“联系我们”页面使用了一个深色的背景,虽然这个页面布局看上去厚重感比较强,但并不让人觉得压抑,就页面上的浅色字体而言,与深色的背景形成对比,使得整个页面布局看上去简洁优雅。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

虽然这个“联系我们”页面看上去并不十分出众,但是我仍然被它的简洁清爽的设计所吸引,页面明确的告诉访客要做的事情。页面的背景点缀的涂鸦使得整个页面看上去生动有趣–势必会让你沉浸其中。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

这个页面最吸引我的地方是在底部联系人信息部分有客服人员的头像和电话,如果你需要,你可以随时给他们打电话。就用户体验而言,这很好的展示了公司的人性化的一面。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

这个页面充盈着优秀的文案。它采用了亲切而又口语化的强调。其在页面上显示“你在想什么?”的同时,还会给你列出三条能吸引你联系他们的回答。而访客则可不必大费周章真正去想“自己在想什么”。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

对于这家公司来说,关联社交媒体具有十分重要的意义,这一点没什么问题,况且他们还采用了极为友好的表达方式——很多企业的行动呼吁显得很冷淡,没有打动人的效果。他们的文案显得很俏皮,而且有实际效果。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

页面设计的非常干净简约,各种联系方式一应俱全,然而,即使选项众多,界面布局却并不突兀。界面中的插图使用了轻柔的淡色,因为一旦使用了深色或者彩色的插图,就很难很好的凸显联系方式了。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

我很喜欢这个页面与众不同的风格,大量的色块和线条交叠在一起令人耳目一新。整个页面的UI安排得当,使得原本平常普通的“联系我们”页面给人一种愉悦的体验。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

这个页面又是一个设计简单的“联系我们”页面,页面被分为四个部分,分别展示了地图和联系信息。每个版块都小巧利落。这四个模块使得页面看上去生动有趣,且提升了页面整体的趣味。

提升用户体验的15种联系人页面设计方案 联系人设计 网页设计 web 设计  %e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1

这个联系人页面非常独特,通过讲故事的方式来吸引用户。当你滚动页面的时候,就如同在翻看一本故事书,每一页都有一个不一样的故事。页面被分为不同的单元,分别展示了该家公司两个办事处的联系信息,以及Dribble、Facebook链接等基本信息。这种设计很独特,但是很有效。

总结

以上提到的例子,多采用简约又简单方式使得整个页面的用户体验更加轻松、更令人愉悦。此外,视觉设计和条幅的使用也提升了整个页面的用户体验。

翻译:Judy

属性标签: , ,