10 个具有很棒项目页面的 Divi 站点

已发表: 2018-07-23

项目页面非常适合向潜在客户展示您所做的工作类型。 它们通常包括案例研究，这有助于展示您的专业知识，并使他们对期望的内容有一个现实的了解。 有多种方法可以使用 Divi 创建项目页面。 在本文中，我们将介绍 10 个 Divi 站点，这些站点具有出色的服务页面，以帮助激发您创建下一个 Divi 网站的灵感。

项目页面通常包括图像、画廊、滑块、视频、推荐和号召性用语等元素。 我将展示我喜欢的部分的图像并讨论我喜欢它的地方。 这些网站没有特定的顺序。 留到最后一些链接可以帮助您升级自己独特的项目页面。

1. BCBD

这一张在笔记本电脑屏幕的一侧显示了该项目的屏幕截图，另一侧显示了更大的屏幕截图。 图像下方是两栏部分，其中一栏包含标题、描述和网站链接，另一栏是提供的服务列表。 在此下方是一个部分，其中包含在不同设备上显示的网站屏幕截图、来自客户的推荐、分隔符和用于查看下一个项目的按钮。

见网站

2. 朱珀

此项目页面显示项目图像，后跟客户名称、项目名称和分隔符。 下一部分使用框阴影在左侧列中显示描述，在右侧显示成品图像。 更多带有框阴影的图像在单个列中显示成品，然后是号召性用语。 CTA 在顶部和底部使用分隔线，并使用带有可点击电子邮件的文本。

见网站（网站已关闭。）

3. 传播设计合作伙伴

这显示了一个带有背景图像、徽标、菜单、标语、分隔符和公司描述的全角标题。 滚动显示 2/3、1/3 行，较大的列中有项目的大图像，较小的列中有描述。 描述包括项目的细分，包括标题、客户名称、简要描述、解决方案以及将项目下载为 PDF、联系表格和返回到投资组合页面的链接。 项目中的一组图像以及带样式的文本用作 CTA。

见网站

4.立方狐狸

此项目页面在坐在桌子上的计算机屏幕上显示项目的图像。 文本位于图像旁边，显示项目名称、客户、年份、CMS、提供的服务以及查看网站的链接。 下面是该项目的三个截图示例。 单击任何图像会在灯箱中打开它们。 我喜欢屏幕截图，因为它是一个真实的例子。

见网站

5. 金·维斯特加德

该网站显示了一个黑色的小部分，其中包含指向网站不同区域的链接。 滚动会在单列中显示项目中的图像。 图像显示了使用的字体、调色板、项目设计（这是一个标志），然后是许多如何使用它的例子。 这些示例以不同颜色显示徽标，作为桌面背景，在标题中，在使用不同设备的网站上，在海报广告示例中以及在社交媒体上。

见网站

6. 学习

这个使用干净的设计，带有全宽图像和视差项目标题。 在此之下是一个标题，然后是两列。 第一列是文本，提供项目描述并包括一份以粗体显示的推荐信。 第二列使用灰色背景突出并提供有关学校的信息。 在此部分下有一个链接，可将项目信息下载为 PDF。 另一个全角部分提供了相关项目的链接，然后是全角 CTA。

见网站

7. 帕蒂休斯顿

这一张显示了项目标题和描述，然后是多列布局中的项目图像，从两列到一列以及短图和高图交替。 一个部分包含图像旁边的文本，以提供有关该项目的更多信息。 帖子导航提供了上一个和下一个项目的链接。 分隔线将项目与使用文本和按钮构建的 CTA 分开。 我喜欢这个的布局。

见网站

8. 蓝水建设者

此项目页面显示一个全角标题，带有带有叠加层和标题的背景图像。 项目信息在全角部分内以垂直分隔线分隔的文本形式提供。 两列显示项目图片库和带有文本的详细信息。 在此之后是带有公司徽标的部分，用于查看其他项目，用于亲自查看项目的地图，以及发布到下一个和上一个项目的导航。

见网站

9. 肯尼佩耶罗

此一在两列中显示项目。 第一个显示标题、位置、描述、用于移动到上一个和下一个项目的帖子导航，以及一个由方块组成的按钮，可将您带到投资组合页面。 第二列在网格中显示项目的图像。 单击任何图像会在灯箱中打开它。

见网站

10. 齐默尔曼集团

这是列表中最详细的之一。 它使用带有背景图像、渐变和客户名称的全屏标题作为项目标题。 滚动显示两列，其中包含有关客户端的信息和图像旁边提供的服务的简介。 接下来是关于客户的视频、项目图像，包括网站和广告活动（包括一个很酷的时间线）、背景渐变上的项目概述和 CTA。

见网站

结束的想法

这就是我们对 10 个 Divi 网站的看法，这些网站具有有趣的服务页面，以帮助激发您进行下一个 Divi 设计的灵感。

ET 博客上有很多设计和操作方法文章，非常适合构建项目页面。 项目页面是一种自定义的帖子类型，可以使用 Divi Builder 构建，他们经常利用画廊等元素和博客文章等页面设计来展示作品。 我提供了涵盖画廊和博客文章以及一般页面布局的教程链接。

  • 3 个免费漂亮的项目页面布局（以及如何使用 Divi Builder 构建更多）
  • 如何使用可过滤的投资组合和帖子导航来组织 Divi 的案例研究
  • 如何使用 Divi 创建可滚动文本预览平板电脑
  • 关于展示我们的作品，11 个最佳作品集网站可以教会我们什么
  • 如何使用 Divi 创建令人惊叹的画廊推荐
  • 使用 Divi Gallery 模块创建灰度到彩色画廊
  • 免费 Divi 照片库布局包：5 种令人惊叹的图库页面布局合二为一，方便下载
  • 使用 Divi Gallery 模块创建带有自定义填充的平铺画廊
  • 免费的 Divi 博客文章布局包将使您的 Builder 支持的文章更上一层楼
  • 在 Divi 中设计破碎网格布局的秘诀
  • 如何使用 Divi 设计独特的对角线布局

我们希望听到您的意见。 您最喜欢哪些具有出色项目页面的网站？ 让我们在评论中知道。

精选图片来自 PODIS/shutterstock.com