五招教你设计一个顶尖的“联系我们”页面

  网站内页的方式有时候不完全相同,做出精巧的共同内页需求花费额定的精力。一般咱们把主页作为根本模板,以模板做网页十分便利,尤其是当网页内容还会不断扩展添加时。

  下面举例说明怎么规划一个簇新的联络页面,可用于个人网站,也可用于大一点的公司网站。本文内容侧重于创立精巧联络页面的特定的趋势和规划技能。

  Yummygum的联络页面很洁净很简略,只需3个框和一个提交按钮。简略的优点是不会让游客望而生畏。

  以现在的网页技能很简单创立一个动态的联络表格。一般留有3-6个框供阅览者填写名字,邮件和个人信息。

  大多数网站游客偏心这种联络表,由于比较节省时间不需求翻开自己的邮件客户端、复制邮箱地址。现在网站联络表格一般包括网络安全技能比方CAPTCHA,所以安全性是很强的。

  这种表格的一切元素看起来很一致,给人感觉很完好。别的主张运用JavaScript显现提示和协助,保证用户知道他们的音讯已发送成功。

  记住,不是每个框都要填写。只需带星号是必填的。大部分状况下,游客能够辨认星号,可是部分游客或许发现不了。如果是规划更大的联络表格,要杰出必填的项目。这样将简化提交进程,优化用户体会。

  Underbelly是一个规划构思组织网站,联络页面很共同。清楚明了,这个联络表格用了CSS样式表和JavaScript。输入界面看起来像一般正式文件的表格方式。规划共同整齐,让人觉得发送电子邮件也成了一种趣味!

  Dangerous Robot网站的规划跟上一个不同。联络表格与其他元素经过亮堂的暖色和矢量图画很好的交融在一起。

  联络表格根本采纳居中方式,每个框里加上图标,使得辨识度和阅览速度得到进步。

  一个公司的地理位置在商务往来中往往扮演着重要的人物。参加嵌入式地图则把企业地址可视化。谷歌地图有一个自定义的嵌入功用,答应开发者添加全功用的谷歌地图到联络页面。

  BKWLD的联络页,除了一些根本的邮件/电话信息,添加了MAPbox动态地图,调高了交互性。

  也能够考虑运用一个定制的相片,不必JavaScript地图。在FortyOneTwenty网站联络页面,运用一个世界地图,上面的蓝点标示了全球分公司和职工散布状况。

  由于这张相片是作为布景图画,所以交融更天然。地图让坐落内容,显得不喧宾夺主。

  在联络页面添加交际网站链接,可赋予企业可接触的品格。这些链接可供阅览者在无法或许不宜运用电话、邮件的状况下联络企业,而且能够阅览企业更多动态信息。最好能在同一页上供给不同的交际账号链接,让阅览者决议挑选哪一个。

  我最喜欢的英国构思组织非Tone莫属,无论是它的著作或许是著作集网站。它的联络页运用定位他们办公室的完好地图和动态联络表格。

  往下翻滚鼠标,你会发现一个长长的的交际媒体图标水平列表。这些链接包括该公司的各种交际账号包括Twitter,LinkedIn,Instagram。按钮大而夺目,可是并没有放在页面顶部,由于邮件,电话和地址才是最重要的。

  Positive Advertising网站的交际账号图标设置的比较小。这个网站是单网页网站。交际账号图标坐落电话号码,电子邮件地址和邮递地址的下面。图标采纳了一致的单色处理。

  这个办法运用较少,可是能够添加网页的特性。个人网站能够在联络页面加上自己相片。大一点的公司往往把相片转移到“公司团队”页面,每个重要人物有独自的相片和介绍。

  Blue Sky Resumes网站的“关于咱们”页面包括一段团队的介绍。每个雇员都有自己独自的网页链接。

  “联络咱们”页面的顶部,注意到沿左面一个固定的翻滚块没有,翻滚块小按钮链接到电子邮件,手机信息,还能够发送一个恳求报价。这个网站联络页面十分生动,让人耳目一新。

  Etsy的“团队”页面。每个团队成员相片链接到各人简介页面。这种特性化的规划无论是关于客户仍是公司的第三方供货商来讲是都很棒的。

  这个团队网页不直接链接到他们的联络页面。这是一种有意图的规划挑选,由于公司有那么多职工,满足撑起一个网页。不过该网页能够链接到“关于”网页,“新闻”网页,其间包括一些电子邮件联络信息。

  任何网页的最重要的是可用性,只需你学会投合用户体会,那么规划精巧的联络页面就不在话下了。