?_20231127

网站作为提供信息及服务的平台,页面的用户体验十分重要。合理的设计网站页面布局可以有效的提高用户体验。通常的网站页面层次模型分为网站首页、网站内页(栏目页面和内容页),有的网站还会因需要设计专题页面。

一、网站首页布局设计

网站首页是网站给用户的第一印象,首页页面布局需从主题、导航、内容等方面入手,下面以百度百科的页面为例进行首页页面布局分析。

1、首页主题

首页是网站的核心页面,首页的主题也就是网站的主要核心。首页主题需让用户很容易的了解网站是做什么的。首页主题体现在网站的标题、关键词、描述上,其中最重要的是标题,用户在搜索引擎上看到的搜索结果就是你网站的标题和描述内容。例如下图的百度百科,用户通过图中内容及可了解到百度百科是做中文百科的,以及百科涵盖的知识及服务领域。

在首页页面上,首页主题还体现在logo及网站标题上。准确概括的首页主题可以很好帮助用户选择自己有确切需求的网站。

2、首页导航

网站导航可以看做是对网站内容的分类,把网站的内容进行细分,方便用户跟据个人需求选择浏览相应栏目页面。网站首页导航要做到分类清晰,导航栏目间不重复。百度百科的首页导航做的很好,我们可以学习一下。

3、首页内容

布置好网站首页导航就可以进行网站首页的内容布局设计了。页面的内容布局需先对网站的用户群体进行需求分析,把用户关注最多的内容放置在首页的最重要位置。一般按照用户的浏览方式,页面内容布局按照内容重要程度由左上到右下进行布置。也就是说最重要的内容要放置在首页左上位置,而广告或最不重要的内容可放置在页面的右下位置。

网站首页布局除了做好主题、导航和内容外还需注意页面的尺寸、网站打开速度及友情链接布置等方面。

二、网站内页布局设计

本文这里所说的网站内页包含了网站的栏目页及内容页面。因页面的总体布局方式相似所以一起进行论说。

1、内页面包屑导航

为了更好的传递站内页面权重,内页需要设置面包屑导航。网站各层级的页面较多,尤其是大型网站,为了更好的让网站内页获得权重,内链是很好的方式,为内容设置面包屑导航就是最符合用户体验的内链形式。面包屑导航不但可以分配页面权重还可以方便用户在各层级页面间进行切换。

2、网站内页模板

常见的内页模板有两栏和三栏两种形式。两栏的形式多用户小型企业站几博客网站。两栏页面的主要位置是文章内容,另一侧为用户互动内容,例如热门文章、推荐文章等。两栏栏目页面主要位置为栏目下文章列表,侧边为互动内容。栏目页需注意,文章列表每页条目不要太少,用户多次翻页会不便于用户浏览,还会出现网站页面层次过深的问题。三栏的内页布局和两栏的差不多,中间主要位置为文章内容,两侧方式相应的互动内容或广告。内页模板我们可参看百度百科的页面布局形式。

按照80/20法则,80%的结果是由20%的努力产生的。作为一个为用户服务的网站,抓好用户体验问题就是抓住了产生大结果的20%核心要点。影响用户体验的方面很多,本文所介绍的网站页面布局无疑是提高用户体验的重要方式。

关注中国IDC圈官方微信:idc-quan 我们将定期推送IDC产业最新资讯

查看心情排行你看到此篇文章的感受是:


  • 支持

  • 高兴

  • 震惊

  • 愤怒

  • 无聊

  • 无奈

  • 谎言

  • 枪稿

  • 不解

  • 标题党
2014-12-17 11:24:00
互联网 PPTV聚力黄彦林:视频云平台保证佳直播体验
PPTV聚力的上市计划已提上议程,这一期限将锁定在未来2-3年内。为此,PPTV聚力在人才引援和内部激励计划也将启动,将从完善用户体验、构建技术壁垒、持续创新角度为上市做 <详情>
2014-11-15 10:44:24
互联网 Facebook将限制品牌商打免费广告 改善用户体验
该公司今天宣布,它将从明年1月开始限制动态消息(News Feed)中的“宣传性页面帖子”。Facebook在博文中写道,这意味着你从品牌商那里看到的鼓动购物或者“参与促销和抽奖 <详情>
2014-09-24 14:36:16
互联网 畅读书城1.5版本发布 社交阅读新体验
近日畅读书城发布1.5版本,该版本中结合了“访问书友书架”与“书友私信功能”,从而产生社交阅读的新理念 <详情>
2014-09-24 09:24:06
国内资讯 千兆宽带需求显现:鹏博士云管端平台提升用户宽带体验
同时,从打造云管端平台起,鹏博士就十分重视网络安全问题。据吴少岩介绍,鹏博士一直强调自主研发,从云平台建立起,鹏博士便一直进行着自主研发或是与国内厂商进行合作, <详情>
2014-05-12 14:47:20
互联网 谷歌测试新移动版Gmail:更注重移动体验
据科技网站Geek报道,谷歌新移动版Gmail增加了多个与桌面桌面版类似新功能。新移动版Gmail的用户界面与旧版相比,完全不同,新版用户界面的设计在保有功能性的前提下可与 <详情>