行业新闻

当前位置:

设计网站首页的基本技巧

浏览量:0

        主页是很多人在初次访问网站时看到的内容,它可以给您留下持久的印象(负面或正面),从而影响他们返回网站的决定。

在本文中,我们将介绍一些用于设计主页的Web设计技巧,并揭示构建强大而成功的首页所需的一些重要步骤。

确定网站的目的/目标

设计师应了解网站的目的,以便构建有效的首页设计。

设计网站首页的基本技巧

        主页是网站给人留下深刻印象的最初机会,因此网站访问者必须在到达时就准确看到他们在寻找什么。定义网站的目的将帮助您了解吸引用户访问该网站的因素。

请记住,网站的目的不同于网站的主题。例如,“房地产”不是目的的示例。

        “买房”也不是目的。有人不看第一手财产就可以通过网站购买房屋的可能性是什么呢?

与房地产示例保持一致,房地产网站的用途可能是以下之一:

  1. 展示要出售的新物业或特色物业

  2. 帮助访问者找到公司或经纪人的联系信息

  3. 协助访客找到适合他们需求的房地产经纪人

        这些目的中的每一个都可以引导访问者采取行动,并可以指导他们采取进一步的措施,作为访问网站的直接结果来获取财产。在此示例中,网站是进行房屋买卖的门户。因此,一个有效的房地产首页将包含房地产和房地产经纪人定位器,以帮助用户快速找到所需的信息,以便采取下一步行动购买房屋。

        我们可以使用的另一个示例是在线投资组合网站。投资组合的目的是什么?说“获得客户/工作”太笼统了,您应该将站点目的定义为切实可行的目标。

例如:

  1. “鼓励潜在客户与我联系”

  2. “打动其他设计师并在社区中赢得良好声誉”

  3. “打动潜在的雇主”

如果您的目的是“让客户建立联系”,则可以在首页上轻松使用Web表单。

如果主要目的是展示您的作品或打动潜在的雇主,则主页可能会展示投资组合作品的缩略图,以吸引访问者签出更多作品。

最终,所有这些目的都将带来更多的客户或工作,但重要的是确定您的有形目标,以便您能够了解如何制定首页布局策略。

        区分首页目标与网站目标

        要记住的一点是,整个网站的目标可能与首页的目标不同。怎么会这样?主页是一个切入点,尽管网站的总体目标可能是销售产品,但该网站的目标可能是引导用户访问使他们能够购买产品的网页。试图在首页上“进行销售”会阻止访问者。

了解新访客与回访者之间的区别

        规划网站(尤其是首页)设计的重要部分是要意识到,有两种类型的访问者:以前从未访问过该网站的人,以及回来访问更多网站的人。一个网站不能没有任何重复访问者就不能很好地运作,因此我们必须考虑促进重复发生的方法。

做到这一点的两种方法是:

  1. 使访问者对内容足够感兴趣以重新访问

  2. 提供提醒访客返回的资源。(例如,一个RSS feed。)

        如果设计人员具有直观的用户界面,他们可以轻松地假设新访客或重复访问者会在网站周围找到自己的方式。以用户为中心的设计是一种概念,其设计围绕着人们访问站点的原因。一个设计是以用户为中心,如果它可以回答“是”的问题,“如果我来这里做X,我可以完成它很快没有太多的想法或工作?”

通过对用户体验设计的深刻理解,可以轻松创建一个以用户为中心的出色网站。

        订阅和会员

主页上具有订阅选项可以鼓励重复访问。网站上最常见的订阅点之一是通过主页。

当用户从首页以外的登录页面访问您的网站时,下一步通常是转到首页,以查看可能感兴趣的其他内容并了解该网站的内容。

        Flickr是一个很好的网站示例,其首页设计可以有效地增加其成员资格,并且其设计根据您是否以会员身份登录而有所变化。

注销后,Flickr假定您是新访客或尚未启动Flickr帐户。因此,它引起人们对“创建您的帐户”按钮的注意,以吸引您进行注册。高亮显示,周围有大量空白。

这样可以促进首次使用的用户注册帐户。对于已登录的用户(即网站的现有成员),主页有很大的不同。Flickr引导您找到可以参与社区的方式,并帮助您轻松执行仅对拥有用户帐户的人员可用的站点功能(例如组织Flickr流)。销售产品或服务

一些网站主要是为了向您出售其产品或服务。亚马逊是一个很好的例子,说明如何有效地对待新访客和回头客,从而获得最大的销售额。

        查看注销的Amazon主页版本,将显示最受欢迎的产品或具有文化特色的产品。在下图中,您会注意到推荐的产品旨在实现“对地球友好”的目标。

        现在,让我们比较登录用户的主页:外观几乎相同,但是推荐的产品基于最近购买的商品。亚马逊能够自定义主页,以迎合新访客和回头客。

有效地突出显示内容

        选择最重要的内容时,请记住以下步骤。

步骤1:设定优先顺序

确定哪些组件和内容对于实现网站的目的最重要:按优先级顺序排列它们。您可以考虑突出显示的内容包括某些类型的内容(“特色作品或特色文章”),RSS feed和联系信息。

        这些组件的重要性取决于您希望实现的目的。牢记这些信息,您可以更好地了解如何以引起人们对最重要元素的关注的方式设计设计。

第2步:创建仅内容布局

现在,在没有其他设计元素的情况下,采用第一步构建的清单,并以正确的顺序吸引人们的目光来组织内容。

不要考虑网页设计,而应该考虑如何拼合布局组件。

        在F形图案通常用来确定的内容组织的网站上的顺序。左上角是眼睛首先降落的位置,然后是右眼和向下的位置。用户在页面上浏览得越远,对其兴趣就越少,阅读的内容就越少。步骤3:引起注意

除了总体布局之外,还有许多其他方法可以引起人们对某些内容的关注。

为了增强对关键布局组件的关注,请研究以下可能性:

  1. 从背景和周围元素增加组件的对比度

  2. 相对于周围物体增加尺寸

  3. 在其周围提供大量空白

例如,Problogger使用对比色来引起对订阅按钮的注意。

       示例:业务指导

最近的一个客户项目使我考虑了上述选项。武汉悟空云互联网有限公司通常在建立一个网站的时候,该网站强调其新闻通讯,联系/社交网络方法以及对品牌的关注。

有多个要关注的项目可能会造成混淆,并且必须根据需要确定优先级,布局并突出显示功能。

在以下示例中,您可以看到重要功能按重要性/优先级顺序突出显示。“注册”和“连接”区域具有更大/更大的元素,它们将访客的视线移向它们。最重要的是,该品牌因其位置和多余的空白而受到重视。标题也通过对比色突出显示。

       记住要包括必需品

如我们的设计师所知,用户希望在网站中找到重要的网站组件。因为大多数网站都有它们,所以花时间在其设计和布局中的战略定位上可以有效地创建功能强大且令人难忘的主页。

这些“必需品”包括:

  1. LOGO/网站标语线

  2. 网站搜索功能

  3. 导航菜单

  4. 联系信息

       在悟空云互联网提供的示例中,客户希望其LOGO和标语(品牌)脱颖而出,因此在布局中将其适当突出显示。

在首页上找到需要的内容,对它们进行优先级排序,使其引人注目。

       一切都有理

在网页设计师中,有关首页设计的一个常见错误是将随机的小部件,多余的导航和随机的内容直接放置在首页上,而对其功能和对整体网站设计的贡献却丝毫没有考虑。

您必须记住,在可用的功能性Web设计中,简单性非常重要。凌乱的设计会关闭用户,使用户难以查找和使用,并且减慢了页面响应时间。

       对您决定包括主页的每个元素提出疑问:它有什么作用?人们会使用它吗?它如何帮助您的网站?

       使用有意义的图形

       MailChimp的图形非常适合将访客的眼睛引到感兴趣的位置。黑猩猩的吉祥物为公司提供了强大的品牌形象,并吸引用户注意黑猩猩的发展方向:网站介绍,演示和注册功能。

       此外,在整个主页上都使用图标来引起人们对服务最受欢迎功能的关注,从而有助于进行“销售”。

       以上的所有图形均将视线引导至需要查看的内容。首先,页面上最大的图像在不同项目中轮换显示,展示了精选的作品集。以下是突出显示服务的较小图标。此设计中的图像用于为访问者创建逐步的层次结构:

  1. 他们看到(并希望给他们留下深刻的印象)特色作品

  2. 他们看到公司提供的服务

  3. 他们继续通过网站查看商店中还有什么

使用有意义的内容

除了使用有意义的图形外,您还应确保内容具有目的并有助于您实现首页和网站目标。

了解页面响应时间的重要性

由于首页通常是许多用户的第一站,因此需要快速访问它。加载缓慢的网站将使访问者感到沮丧,并增加访问者在您的网页完成渲染之前离开的可能性。

尽管有效的加载时间在整个网站上都很重要,但在首页上尤为必要。以下是减少网页加载时间的基础知识。

最小化和优化图形数量

评估对所有图形元素的需求。缩减到最低限度后,请考虑使用工具缩小其文件大小。

还可以考虑使用CSS图像精灵将图像分组在一起。这减少了网页渲染网页所需的HTTP请求数量,从而减少了网页响应时间。

        合并JavaScript和CSS文件

如果网站必须加载多个JavaScript文件或CSS文件,然后才能正常运行,这也会降低网站的速度。如果可能,将它们合并为一个文件。在谈论响应时间时,加载一个大文件比加载五个小文件快。

        缩小脚本

您可以缩小脚本,以减小其文件大小。这可以使您的代码具有可读性,因此,理想的情况是使用可以取消脚本最小化的应用程序:有关CSS的压缩和压缩,请参阅本文。

        设计首页既是一种科学形式,又是一种艺术形式。它需要注意细节,注意网站的目的和目标,并考虑网页性能。

        悟空云互联网希望这篇文章能使您对设计主页时要考虑的一些问题有所了解。随时在评论中分享您的想法和设计首页的技巧。




 


以上就是作者为您整理的内容。更多讯息请关注武汉悟空云互联网有限公司

[声明]本网整理的媒体稿件是为了分享更多的讯息。此类稿件不代表本网立场,本网不承担此类稿件侵权行为的连带责任。故此,如果您发现本网站的某些内容侵犯了您的版权,请把您的相关内容发至此邮箱【wukongclouds@163.com】,我们在确认后,会立即删除,保证您的版权。