Divi 设计展示:2019 年 4 月以来的新提交

已发表: 2019-04-29

又到了我们每月一次的 Divi 展示会的时候了,我们来看看社区成员制作的 10 个令人惊叹的 Divi 网站。 每个月我们都会展示从我们社区提交的最佳 Divi 网站,今天我们想与您分享 4 月份的前十名网站。 在整篇文章中,我将指出一些我最喜欢的设计功能,这些功能将我吸引到每个网站。

我希望你喜欢他们!

Divi 设计展示:2019 年 4 月以来的新提交

1. 运动大学

本网站由安德鲁·巴特利特提交。 该网站使用带有黄色和橙色(严格来说是脏棕色)高光的白色文本的深色背景。 所有背景图像都是黑色的。 英雄部分显示了描述站点的背景图片。 叠加层中的文本包括左侧的标语和 CTA 以及右侧的播放按钮。 播放按钮在悬停时更改,并在单击时在弹出窗口中打开视频。 其他部分以文本和图像两列显示信息。 当您滚动时,布局会交替变化。 在各个部分之间,有带有用于推荐的语音气球的小缩略图。 全角 CTA 提供带有订阅表单的图像。 更多的推荐性语音气球会创建一个显露的页脚。

访问网站

2. 京东设计

本网站由 James Dawson 提交。 它显示一个带有背景图像和深色覆盖的全屏滑块。 叠加层使用大文本来描述站点并提供 CTA。 滚动显示另一个部分,在描述公司的白色背景上带有大文本。 服务以文本形式显示,标题和描述之间有一个有趣的点分隔符。 投资组合部分显示带有叠加层的图像。 此部分使用波浪形部分分隔线和灰色背景,从布局的其余部分中脱颖而出。 其他几个部分使用这种设计,但有蓝色背景。 我喜欢带有超大客户徽标的部分。 它们在四列中以深灰色显示。

访问网站

3. Swwwish

本网站由 Daniel Neumann 提交。 该网站显示全屏背景,带有深蓝色覆盖层和一侧的白色文本 CTA。 服务显示在带有框阴影和动画图标的简介中。 背景图案是通过简介看到的。 悬停会增强框阴影效果,因此它们会脱颖而出并使广告语完全不透明。 几个两栏部分交替使用一侧的文本和另一侧的图像布局。 这些部分中的文本显示动画图标和突出显示的文本。 定价页面很好地使用了带有白色定价表的简单蓝白设计。 我喜欢定价表按钮上的红光。 红色高光带来了足够的颜色并完美地脱颖而出。

访问网站

4. HH 仪器

本网站由 Mathias Rue 提交。 该网站使用带有图标的橙色到红色渐变背景来创建工程设计。 覆盖层的一侧显示公司信息、按钮和搜索功能,另一侧显示联系表。 下拉菜单包括联系页面的全角按钮。 合作伙伴徽标显示在带有供应商页面链接的滑块中。 Blurbs 用于链接到服务和信息。 它们包括 2 色图像作为图标,并且它们有一个有趣的边框,使宣传语脱颖而出。 参考部分使用了类似的设计,但它们要大得多,并且包含图像的客户徽标。 该设计也用于博客部分。 该布局还包括来自 LinkedIn 的嵌入文章,背景与英雄部分相同。

访问网站

5.智商动画工作室

本网站由 Saurabh Patil 提交。 英雄部分在一侧显示标语、信息和 CTA,在另一侧显示动画图形,并通过深蓝色背景渐变。 动画图形很有趣。 我想要一个这样的咖啡机。 其余的背景和按钮使用更深的蓝色。 四列简介显示带有标题的动画图标。 它们使用深蓝色背景和灰色边框,该边框足够轻以彼此分开。 将鼠标悬停在任何简介上都会将其背景变为橙色。 类似的设计用于其他提供信息的宣传语。 一个有趣的 about 部分展示了在视差中的酷艺术品上的动画。 这些页面还显示了很酷的加载动画。

访问网站

6.幼儿园小姐

本网站由 Chris Cadalzo 提交。 该站点在菜单下方的中央显示一个超大徽标。 下一部分在顶部和底部使用波浪形部分分隔符——每个分隔符都有不同的设计和多种深浅的背景颜色。 此部分还将主题显示为方形图像,在悬停时缩小并更改其边框。 资源部分和博客部分(但具有更高的图像)使用相同的设计。 关于部分以圆圈图像和与徽标相同的脚本字体样式显示站点所有者。 注册表单显示免费赠品和标题的脚本字体。 博客和侧边栏的样式也与网站的品牌设计相匹配。

访问网站

7. 德曼

本网站由 Jake Braught 提交。 视频背景在带有标语的叠加层后面播放。 滚动向特定类型的客户端显示服务的多色图标。 类似的服务部分显示在页面底部。 推荐信以全宽显示在带有倾斜部分分隔线的绿色背景上。 这部分非常突出。 更大的推荐部分出现在布局底部的多列中,具有交替的颜色和样式图像。 几个部分通过嵌入视频和大文本统计数据以及更多信息的链接显示客户的故事。 视频图像显示了多个设备上的网站。 靠近页脚的开头是山形切口后面的一座视差山,一个带有倾斜部分分隔线的联系表格,以及一个显示带有统计计数器的评论网站徽标的部分。

访问网站

8. 苏帕国际

本网站由 Ben Dale 提交。 这是一个 2 页的设计。 产品标签以视差显示在背景中,覆盖层中带有标语和 CTA。 下一部分以较小的字体在一侧显示详细信息,在另一侧以较大的文本显示缩短的语句。 接下来的几个部分显示了带有标题和文本的产品图像。 图像彼此垂直偏移,使设计具有有趣的视觉风格。 服务显示的图像包括带有标题和编号文本的叠加层。 更多产品展示在大型 4 列画廊中。 该站点充分利用了大标题文本和图像。

访问网站

9. 英雄为你

本网站由 Bram Chauvin 提交。 这个网站有趣地使用了图形。 英雄部分使用顶部部分分隔符,实际设置标题样式。 标题文本很大,并显示一个标语和几个按钮。 背景以真实视差显示,包括被下一部分的云部分分隔线重叠的云。 Blurbs 使用带圆圈的图形显示服务。 宣传语中的按钮与宣传语重叠。 我喜欢 CTA,它显示了超级英雄智能手机的大图。 页脚也很有趣。 它显示了具有真实视差的图形背景,在叠加层中带有倾斜的部分分隔线和接触式 CTA。 该博客遵循相同的设计并使用页眉和页脚元素。

访问网站

10. VS & 组装

本网站由 MJ Swart 提交。 该站点有趣地使用了图形元素和大块来创建布局。 英雄部分使用带有不同颜色块、点和垂直文本的深色背景来创建视觉图案。 这些模式贯穿布局的其余部分。 接下来的部分使用多栏布局,背景色块、样式标题、超大标题和滑块显示他们的服务、公司信息、体验、文化、办公室等。 单击菜单中的联系人链接会在菜单中打开一个联系人表单。 我喜欢在这个网站上使用颜色、文字和滑块。

访问网站

在结束

这是我们四月份提交的 10 个最佳社区 Divi 网站。 这些网站看起来很棒,我们一如既往地感谢大家的提交!

如果您想考虑您自己的设计,请随时通过电子邮件发送给我们在 nathan 的编辑,地址是优雅的主题 dot com。 请务必将电子邮件的主题设为“DIVI SITE SUBMISSION”。

我们也希望在评论中收到您的来信! 告诉我们您喜欢这些网站的哪些方面,如果他们做了什么,您希望我们在博客上教给我们。

精选图片来自 MSSA/shutterstock.com