4种方法来设计完美的分屏主页

一个屏幕分成两个。

这种分屏技术在电影工业中早已为人所知，早期的例子可以追溯到20世纪初的无声电影时代，如今它仍然是电影和电视中流行的一种设备。

当全屏元素被划分为两个或多个垂直部分时，将使用分屏布局。电影《斯科特·朝圣者与世界》的场景

然而，这对于web设计行业来说是一种相对较新的技术。拆分屏幕在2016年年中才开始流行，现在我们有越来越多的网站使用这种设计模式。这种设计模式之所以如此流行，有几个原因:

它有很好的审美质量。正确执行时，它可以为用户提供精彩的观看体验。

对于响应式框架来说，这是一个很好的选择。分屏设计可以适用于各种屏幕，甚至小屏幕。当涉及到更小的屏幕时，比如移动显示器，面板就可以堆叠起来。

它有助于指导导航。使用简单的设计技巧，你可以将用户的注意力吸引到屏幕的某个特定区域，或者鼓励他们点击。

当分屏运行最好的时候

当你有两件事要做时，分屏特别好。例如，当一个站点提供两个完全相反的变体时。这种方法允许设计人员突出两件事，并允许用户快速选择它们。

当你应该避免分屏

分屏设计不会随着内容的增长而扩展，因此不建议将其应用于内容繁重的布局。保持屏幕的简单是很重要的，因为复杂的分割屏幕使UI看起来是超负荷的。这就是为什么分屏布局将是极简主义网站设计的完美选择。

如何决定分屏对你有好处

如果你正在为你的网站考虑一个分屏技术，我建议你问自己几个问题:

它适合你的内容吗?

是否有足够的负空间来进行布局工作?

你的用户会喜欢它的布局吗?还是会把它们弄混?

将用户的注意力分成两半是否可以?

最重要的是要记住内容是king，而分屏应该是向人们传递信息的一种简单方式。

用于分割屏幕的设计技术

1 .工作明亮的色彩和生动的字体

由于平面和材料的设计，充满活力的色彩和戏剧性的印刷是现在的大趋势。充满活力的色彩在视觉上是刺激的，戏剧化的字体增加了文字内容。简单地把两者结合起来，你就会创造出一个视觉上有趣的设计。Baesman已经做到了这一点。它们对两个元素都同样重要，同时允许用户快速地选择它们。

2.将用户的注意力吸引到CTA按钮上

除了一个简单的图形趋势，将屏幕分割为两个不同的部分提供了一种原始的方式来引导用户通过您的站点。当你想要创建一个更大的行动焦点时，这是一个很好的选择。在下面的例子中，你可以看到负空间如何产生一个垂直的划分，给两个不同的选项赋予相等的权重。

3.创建视觉流之间的”屏幕”

当分割屏幕表示单个对象时，重要的是在内容容器之间建立连接。一种可能的方法是使用一种颜色。简单地复制一种不同的颜色，以建立两个屏幕之间的视觉流动。这在很大程度上与一个品牌的颜色或颜色有很大的对比。使用颜色可以在两部分内容之间传递更强的连接。

创建强连接的另一种可能方法是将单个元素分层，比如跨屏幕的文本拷贝:

重叠的文字连接两个屏幕

最后但同样重要的是，你可以使用彩色叠加来达到这个目的:

考虑屏幕的左边部分

4.使用动画来鼓励用户采取行动

优秀的动画和互动效果鼓励用户点击。看看下面这个“契诃夫活着”网站的设计。这个设计让你点击找到你的角色。

结论

访问者需要大约3秒的时间来决定你的网站。因此，如果你想降低回弹率，你的布局应该始终是友好的。分屏技术可以帮助你实现这一点。分屏设计是一种有趣的、功能性的、响应性的设计方式。