超大网站页脚的设计技巧

所以你想要一个漂亮的页脚,既好用又好看?没问题!

对于有效的页脚,您可以做很多事情,而且有这么多的变化,因此有很大的测试空间。我最喜欢的页脚样式之一是超大页脚设计。通常你会在公司网站或大型博客上看到这一点。

有了所有的空间,你可以添加品牌图形,额外的链接,或者把你的主要页面分成几个部分。

每个网站页脚应该使导航更容易。用一个大的超大页脚,你给自己甚至更多的空间使航行变得轻而易举。这正是我在这篇分享技巧和趋势的文章中所要讨论的,在网上设计可用的超大页脚。

组织链接层次结构

这是创建页脚设计最常见的原因之一。如果你要建一个大的页脚,那么你需要大量的空间的东西,对吧?

所以试着用这些空间来填充一些链接。

您可以添加最流行的文章和类别从您的网站的博客到不同的列。或者你也可以组织一些不太重要的小页面,因为它们不适合你的顶部导航。

只要确保使用标题和标题来组织你的链接,这样就很容易浏览。我立刻想到了YoDiv站点。

yodiv超大的页脚

他们的页脚分成多个列,每个列都有一个顶部的“主”标题。这使得浏览链接很容易,所以你可以清楚地告诉页脚层次结构,而不需要太多的努力。

当然,他们的设计也很不错。我非常喜欢网页设计中的插图,而YoDiv很顺利地做到了这一点。

你也可以在亚马逊主页上找到类似的东西。

亚马逊大页脚

然而,他们是一家大公司,除了实体产品外,还有几十种服务。所以亚马逊真的需要所有的空间来创建标题和相关链接。

事实上,你在页脚看到的每个小文本框是它自己的链接。没有副标题或链接列表。

这种方法适用于亚马逊,因为他们有太多的链接。对于小公司的网站来说,这可能行不通,但尝试一下也无妨。

我个人最喜欢的层次结构设计风格是将大标题文本和小页脚链接组织成列。《游戏开发市场》在他们的脚注中使用了这种风格。

GameDevMarket主页

这些链接不会跳出页面,以免与其他颜色发生冲突。但他们也不觉得无法阅读。

良好的链接层次结构应该是明显的,即使是在浏览网站的时候。当您有几个较大的列时,它会变得更困难,但是如果您正确地规划您的链接,您将找到一种方法使它工作。

添加一个联系人表单

我只推荐这种趋势的投资组合网站设计为企业或个人使用。

我的理由是,很少有作品集有很多页。这意味着你的大页脚不会被太多的链接填满,但它应该填一些东西。

看看Zoyogurt的页脚。它们在设计中突出了联系人信息和联系人表单。

Zoyogurt网站

我认为这很有效,因为大多数人都想与企业建立联系。他们想知道地点、电话号码、时间,甚至可能想通过电子邮件发送。

如果你的网站没有太多的页面,那么我建议你添加一个联系人表单。

实际上你甚至可以把整个页脚带有联系人表单。这看起来就像Vanila完全围绕表单设计的脚注。

香草香精触点形式

最终,这又回到了站点的需求和目标上。不想收到太多陌生人的信息?然后放弃联系表格和填补你的脚注与其他东西。

添加品牌和图形

品牌是一种微妙而强大的提醒,提醒每个访问者他们在哪个网站。

如果你有空间在你的脚注尝试添加一个小标志,图标,或图形来说明你的品牌。它可能看起来不多,但人们会记住。

Smashing Magazine主页

以最新设计的Smashing Magazine为例。在他们的页脚,你会发现一对夫妇的插图与他们的猫吉祥物和一个友好的鸟。

即使人们不知道他们的猫,最终也会发现它是吉祥物。它出现在他们的许多产品上,在他们的会议上,在他们的书上。

树立自己的品牌,让人们永远记住你的网站。

但你甚至不需要进入全面插图或自定义设计。你可以只是重复的颜色,纹理,图案,或图标在网站早期使用。

Branded7页脚布局

例如,Branded7 Art在整个页面中使用浅色背景。

他们的脚注重复这个说明,以连接该网站与这一艺术作品。这是一个非常微妙的品牌技术,但你也可以这样做,如果你有任何可平铺的模式或背景,你可以重用。

推送大量相关内容

我通常用两种方式看页脚内容:

  1. 分享网站上没有找到的链接
  2. 推动独特的内容,鼓励人们留下来

如果你有一个投资组合或商业网站,那么你可能想要第一个选择。但如果你有一个大的博客或内容网站,那么你可能会选择第二个。

试着添加相关的产品,博客文章,社交源,任何能吸引人们点击的东西。用链接填充你的超大页脚,鼓励人们点击你的网站,并保持与你的网站的联系。

杰森·圣玛丽亚作品集

Jason Santa Maria在他的大页脚中使用了很多自定义链接。

从推广他的最新项目到推荐一些书籍,甚至连他的社交账户都有一个小插件。

只要确保你分享的内容是有价值的你的听众。人们可能不关心你在Instagram上吃午饭的照片。但如果你更新更多的设计照片,那么一个IG页脚小部件可能会为你赢得更多的追随者。

类似地,像Giftrocket这样的大型商业站点可以通过添加位置链接来利用它们的页脚。

Giftrocket页脚

这借用了我前面提到的层次结构思想。你会发现一个完整的公司链接列表,以及一些流行的类别和服务的流行城市。

所有这些都包裹在一个超大的页脚与一些相当令人印象深刻的brading。总的来说,这是我见过的最好的页脚设计之一,它与整个布局非常匹配。

想想人们希望在你的页脚中看到什么样的链接。如果你没有那么多的东西要塞进去,那就不要流汗!

但如果你确实有很多内容要分享,试着把你的页脚都安排好。为每样东西腾出一点空间,让访客有更多的选择。

也试着捕获电子邮件

如果你运行电子邮件通讯,那么你就知道建立一个列表是多么困难。

设计一份好的时事通讯是很困难的。但是,在你看到真正可靠的数字之前,收集注册用户可能需要几个月的时间。

一个不错的地方,添加一个选择进入的形式是在你的页脚。RunSociety在这方面做得很好,一个很大的电子邮件字段占据了页脚的顶部。

RunSociety主页

还有一个很好的列结构的链接,这些都很容易通过。没有人说你一次只能使用其中一种趋势!

但是页脚电子邮件字段只是人们注册你的列表的又一个机会。这是一个伟大的方式来建立用户,而不占用宝贵的房地产在更“中心”领域的布局。

另一个很好的例子可以在WebDesigner Depot上找到。

网页设计师仓库电子邮件选择进入

当然,这并不是一个真正的超大页脚开始。它基本上保存了电子邮件字段以及标签和类别的列表。

但它有一个美丽的风格,真的在页面上形成对比。这肯定会吸引眼球,并有可能在长期内增加用户总数。

看看你最喜欢的一些博客,看看是否有使用这种设计趋势。

ConversionXL电子邮件注册页脚

ConversionXL的人员甚至在页脚中都没有选择进入的字段。相反,它连接到页脚的顶部,在那里它是独立的。

这里没有绝对正确或错误的答案。只是设计策略和想法,让你开始工作的自定义页脚设计。

前进

我总是建议设计师列出他们喜欢的网站。你可以把所有你喜欢的网站中最好的超大页脚加入书签,并把它们组织起来供以后研究。

但我当然希望这些建议能帮助你走上正确的道路。这将为您提供大量的测试趋势,并让您的大脑思考新的设计思想,以便在未来的项目中使用。

一旦你超越了页脚的设计,看看这些相关的文章,帮助你制作你的网站的其余部分:

2020-01-01 21:54
相关热门