虽然每个设计师在建立网站时可能有不同的计划，但他们确实有一个共同的清单。无论您如何尝试避免它，每个网站都应该（通常是！）包含一些元素。

从大量的空白和精美的图像，到搜索功能和清晰的号召性用语，这些常见元素是用户在轻松使用网站时所期望的。今天，我们来看看您应该在网站上优先考虑的十个元素，每个元素的完美设计示例，以及如何在下一个网站设计项目中使用每个元素的技巧。俗话说，“魔鬼在细节”。

1. 空间

1. 空间是最重要的设计工具之一，因为它决定了一切——从流动到可读性。设计师开始以十年前我们在网络上看不到的方式使用空间。更多的网站设计包括广阔的空间、增加的文本行间距以及开放空间的整体使用。

2. 关键的空间关系包括间距的一致性。相似的元素应该包括相似的间距。段落中各行之间的空间量应该相同，环绕图像的量也应该相同。

3. 在为用户创建焦点时，空间也很重要。与挤在设计中较小或较紧凑位置的图像或文本相比，由空白包围的图像或文本会显得更大、更重要。

4. 同样重要的是要注意空间并不总是白色的。它指的是缺乏元素，同样可以是背景颜色或纹理。

5. 如何使用它：例如，从导航菜单等关键元素开始。确保元素的组织方式包括元素之间的设置间距。这将使每个按钮或单词单独更清晰地突出。

6. 2. 简单导航

1. 航不需要很复杂。它应该易于识别和使用。将导航菜单保持在最低限度也很重要，这样您就不会让用户不知所措。根据网站的类型，五到十个菜单导航项是您应该瞄准的最高端。

2. 导航还包括帮助用户浏览网站的工具。例如，具有视差滚动功能的站点通常包含方向箭头以使站点更加用户友好。人们越容易在您的网站上使用和导航，他们与之互动的时间就越长。

3. 上面的例子展示了两种截然不同的导航类型：Zola它包括一个简单的菜单和进度导航，可点击的文本作为按钮；Anet Design显示了更时髦、更有创意的按钮样式。两个站点的共同点是主导航永远不会移动或更改，从而在每个站点上创建一致性和流程。

4. 如何使用：使用简单的导航作为您网站构建的框架。请记住，用户希望从导航中获得一些关键信息：了解他们在网站上的位置、返回（或回首页）的方式和方向（如果您的网站具有不寻常或更复杂的界面）。

5. 3. 关于我们

6. 对于小型企业或网站所有者来说，告诉用户他们是谁尤其重要。（这对于家喻户晓的大公司来说不太重要，尽管它仍然是一种常见做法。）

7. “关于我们”页面应该告诉用户你是谁以及你做什么。它可以概述公司的理念或目标或网站是如何形成的。此页面也可以是客户或用户推荐和成功案例的地方。这种类型的页面还可以作为通往相关页面甚至社交媒体资料的门户。

8. 关于我们页面经常发生的一个问题是它们变得冗长冗长。保持页面简单；为用户提供足够的信息以使其感兴趣但不会感到无聊。并记住保持设计有趣。

9. 如何使用它：使用“关于我们”页面为您的品牌赋予一点个性。考虑包括您团队的照片和简短的公司传记。

10. 4. 联系方式

11. 联系信息通常以两种方式之一显示 - 在标题/主导航中，或作为带有表单或扩展信息的联系我们页面。根据您的网站设计，这两种选择都可以很好地工作。

12. 关键是让它高度可见，拥有联系信息（例如电话号码、实际地址或联系网站所有者的表格）可为您的网站和业务增加合法性。如果用户想要找到您并且网站上未明确列出信息，这可能会令人沮丧。

13. 如何使用：将联系信息添加到所有静态页眉或页脚。如果您有实际的营业地址，请提供位置信息。考虑一个联系表格，以便用户可以直接从网站发送电子邮件。

14. 5.号召性用语（或注册）

15. 在大多数情况下，网站是采取行动的门户——进行销售、提供信息、收集联系信息。为了确保这一行动，号召性用语提示需要明显而有力。

16. 首先，确定您的网站应该做什么。然后设计它，使动作显而易见并引导用户使用它。颜色、对比度和空间等技术可以帮助引导用户找到“正确”的按钮。例如，Connect Mania 希望用户下载应用程序。登陆页面上滚动条唯一可点击的空间将您带到 App Store。

17. 另一个流行的号召性用语是注册表单。如果这是您的目标，请将表格放在主要位置并突出显示其大小。使表格简单且易于填写。（如果您需要两到三条以上的信息，请考虑使用后续电子邮件，而不是复杂的注册表单。）

18. 如何使用它：使号召性用语显而易见。展示位置应位于页面的显眼部分，并位于与其相关的项目旁边。按钮应采用对比色，并准确说明您应该做什么：立即购买、加入、下载、免费注册。

19. 6. 搜索

20. 您有多少次想要查找较旧的信息或您记得在喜欢的网站上看到的内容？这就是搜索的用武之地。该工具对于重复用户至关重要。以不显眼但易于使用的方式设计盒子。确保该框足够大，可以输入您网站上的术语。如果您使用图标进行搜索，则无需发明新东西；使用标准放大镜。

21. 如何使用它：设计一个简单的框，位于您网站的顶部以供搜索。右上角是最受欢迎的位置，使用该空间是预期的并且易于用户找到。

22. 7. 信息页脚

23. 页脚是您如何在不妨碍设计的情况下通过大量信息与观众联系的方式。由于页脚位于页面底部，因此它是放置小型站点地图、公司或联系信息、链接和站点上下文的合理位置。

24. 使页脚有用并保持简单。无论您选择几个按钮还是链接式设计，页脚都应该设计为与您的网站相结合，但可能具有更简约的感觉。使其易于使用。

25. 如何使用它：一些最好的页脚结合了上述许多元素。页脚通常是在其他地方找到的元素的重复（例如在主导航中的页面顶部添加搜索，然后在页脚中再次添加搜索）。如果设计方案中没有其他逻辑位置，它也可以引入上述一些元素并容纳它们。

26. 8. 按钮样式

27. 网站上的每个按钮都应该可以识别为按钮。无论目的或位置如何，它们都应该具有相同的形状、设计效果和感觉。对于具有大量可点击项目的网站来说，创建一组独特的按钮可能是一项艰巨的任务。考虑使用设计套件来创建一组一致的元素。

28. 如何使用它：开发一组您网站独有的按钮。创建一致的颜色主题，每个按钮都是单一色调或整体风格，如形状或纹理。

29. 9. 精美图片

30. 人们喜欢在行动中看到事物。创建令人惊叹的视觉效果以吸引用户访问您的网站。出色的图像或插图是实现此目的的一种简单方法。使用相对较小的一组精美照片，您可以展示产品、人物等任何吸引用户访问您网站的内容。

31. 上述两个网站都在展示其产品和风格的图像方面做得很好。这种类型的自定义图像很重要。小心使用过多的库存图片，因为您的网站最终可能看起来像其他东西。

32. 如何使用它：聘请摄影师或插画师为您的网站开发和创建一组出色的图像。依靠自定义图像而不是库存图像来获得独特的视觉体验。

33. 结论

34. 虽然有效的网站设计有很多重要的组成部分，但包括这十个关键元素可以产生影响。小心设计空间、简单导航、关于我们、联系信息、号召性用语、搜索、页脚信息、按钮和图像。这些经常被忽视的细节可以成就或破坏您完整的网站设计。

    图文来源网络