大数跨境
0
0

如何制作有用的网站框架

如何制作有用的网站框架 无非经济
2018-03-27
0
导读:想要学会制作有用的的网站框架,点击阅读全文,DaDa来助你一臂之力。

文:DaDa

网站框架被定义为:为网站提供框架的视觉指南。

无论B2B网页目标是什么,创建此蓝图或页面示意图都是为了以最佳方式布局网站元素,来达到某种特定的目的。

在B2B环境中,这种特定的目的:赢得用户对网页页面的信心; 带来有效流量;下载电子书等等。


网站的框架将显示您网站上的内容安排。 这通常包括导航,界面元素,副本等。但是,这只是页面中的一小部分。

因为在将网站中的各个线框放在一起之前,您首先需要在心里有个大概样式。 比如其中包含这些因素:

1.买家

2.该产品或服务

3.价值主张

4.实际的消息


当您对最终的页面消息是什么有一个真正的好主意时,此时应该只用担心网站线框图就可以了。

什么网站线框不是,不需要的,您也应该了解一下,以下是一些“不是”的简要说明。
1.一个地方包括各种最终的视觉效果,如图片,实际的颜色和字体
2.一个包含lorem ipsum填充副本的地方
3.一个实际的设计
4.一个不明确的标注或描述的地方


了解一些“不是”的线框后,我们来看下真正需要的且接近完美的线框图:

这个线框图看起来简洁有条理,会让买家在浏览时有种眼前一亮的感觉,而且还能让他们快速找到自己需要的部分。

正确的网站wireframing就像是一个建筑项目。它尽可能接近建筑师的网页设计工作。就像建筑师要列出建造时要考虑到的任何问题和必要细节一样,它也需要,以便可视化页面的结构,布局,消息传递的流程,应放置副本和图像的所有元素,并考虑帮助页面实现其目标的所有元素:导航 ,链接,复制,显微镜,流程,号召性用语。


那么如果跳过线框框架并直接进行设计,会发生什么呢?

这就好像通过与室内设计师谈论织物的颜色来开始建造房子。

发生这种情况时,会出现一个奇怪的现象:项目中的每个人都会忘记业务目标,数百甚至上千封电子邮件通过您的收件箱开始飞行,讨论细微的,完全不相关的事情,例如:“标题字体应该是什么样的蓝色”或“图像是否有圆边”或“社交媒体按钮的形状和颜色”。

我们应该要知道,网页设计不是品牌,它也不是装饰。但是,它是帮助您的企业销售更多的一种方式。 现在,它应该是美丽的,适合您的品牌的。当然,如果您想让它为您赚钱,这只是次要履行的业务目标。


步骤1.完成您的买方角色

谁是您的买家?
他试图解决的具体问题是什么?
具体来说,他为什么要从你而不是从您的竞争者中购买?
在他做出最后的提问之前,你经常需要回答哪些重复问题?
他打算在你的网站上做什么?
这些只是一些问题,您必须要求自己能够将您的客户的潜在客户角色放在一起。

对于一些你不想重新解释和总结一些东西,如果您可以像客户在之前的研究中所述的那样精确地复制问题,就可以了。


步骤2.找出消息
在这一点上,您的买家角色正在告诉你,您需要在您的网站上说什么。
搞清楚你的网站的消息是绝对重要的。

消息传递是您首先想要在您的网站上展示的信息,同样重要的是,这些信息将如何流动。 这是线框过程中至关重要的组成部分。

要制作消息,您可以按照以下方式在买方角色中使用调查结果:

谁是您的买家?他的问题是什么?

您的公司通过做什么来解决这个核心问题 - 这需要在您首页的最高价值主张中加以解决。

在决定之前他有什么问题 - 这些问题需要在整个网站副本中解决; 特别是头条新闻,因为这些是你的买家首先会阅读的。

为什么他会向你购买,而不是你的竞争对手 - 在整个副本中,你需要解决你独特的差异点。

消息传递的一个重要方面是优先考虑如何在您的网站上显示所有这些重要信息。 并非所有信息都是平等创建的,因此决定哪些信息在任何给定页面上具有更高的优先级是有意义的。


步骤3.详细描述线框

当您以实际大小开始创建网站框架时,您需要在线框中定义以下元素:

可用性约定,例如将导航放置在徽标旁边的顶部,并添加标语,将搜索框(放在右上方等。
布局和间距 
信息等级:比什么更重要? 需要用字体大小强调哪些消息。
为交互性制作注释
您会将呼叫置于何处? 它们应该有多大?
什么类型的图像、交互可能有助于传达信息
您会在哪里放置信任建设元素?


以这种方式来看框架,相信您也能成为制造杀手级B2B网站的差异制造者。

【声明】内容源于网络
0
0
无非经济
跨越无限,链接全球!
内容 231
粉丝 0
无非经济 跨越无限,链接全球!
总阅读147
粉丝0
内容231