很久之前就想写篇关于迅雷网站的设计分析文章了,迅雷看看一直是我在线看电影的网站,也是我比较喜欢的网站,所以我也比较乐于分析一下它的设计,先从结构上分析,也就是导航、搜索、详细信息展示、以及播放页面的顺序。

1、导航

全局导航

迅雷首页导航是非常清晰的,一目了然,如图:

根据人的视觉路线来看,除了阿拉伯等少数语系之外,大部分人都是从左到右,从上到下,也就是图中的红色箭头所示。这也是它能做到一目了然的原因。再来细看导航:

迅雷看看Logo是可点击的链接,用于返回首页,其实,Logo能不能点击问题不是很大,不可点击,也不会给用户带来太大的困扰,但对于一些专家用户来说,是一个返回首页的捷径,增加此处设计能增加用户体验度。

可用性导航很醒目很简洁,放在了Logo的旁边,减少了用户的记忆负担,当用户想登录的时候,他能马上把鼠标移到Logo旁边。同时也给右边的广告腾出了空的地方。

主导航放的是频道列表,内容频道的划分非常合理,上来迅雷看看的用户有一些时间是比较空闲的,可能比较喜欢看电视剧,也有一些用户时间不是很富裕的,像我就没有太多时间,我的空余时间不够我看电视连续剧,只好看电影,所以我一上来就直奔电影频道。

副导航在这里就显得不大显眼了一点,副导航采用的是专题形式,专题有个好处就是能推荐很多内容,且能抓住当前大部分用户关注的话题来推荐。

说完了首页导航再来看,频道内导航:

从各个频道来看,一致的布局,一样的颜色,每个频道最顶上的全局导航颜色要比下边的当前主频道要浅很多,让用户的视觉聚焦到频道主导航上来。每个频道的主导航旁边都有一个检索框,方便用户进行直接查找,放在右边还有一个好处,就是尽量不影响主导航,毕竟有具体查找目标的用户相对于根分类来查找自己喜欢的内容的用户来说还是少数。

分类导航

频道主导航右上边的热门分类,可以帮用户迅速定位到当前热门上。

从上边频道截图还可以看到,频道主导航都有一个“分类”的标签,从这个小细节能看得出来,迅雷看看比较重视使用分类来导航的。以电影频道的“分类浏览”来看,点击“分类浏览”,页面如图:

选择了一个分类,之后页面如图:

到了这个页面之后,左边仍然显示分类等筛选条件,每切换一个条件,右边的检索结果则会根据选择条件显示相应的结果。整个流程很清晰,不用用户思考,让人感觉到不到导航的存在就直奔自己想看的电影去了。

关联导航

在关联导航上,迅雷看看做得非常,在这个方面,它从没有让我失望过。在首页有一处很有意思的地方:

“猜你会喜欢”,虽然迅雷看看在这个推荐信息不一定能做到百分百猜得对,但是迅雷为每个用户都不同的推荐信息,给了用户一种被重视的感觉,而且标题标签的右边还允许用户关闭,还可以设置下次不显示,减少对用户的打扰。

2、搜索

搜索有两种情况会用到,第一种用户有明确具体的搜索关键词,第二种情况是在当前导航找不到自己想要找的资源最后不得不求助于搜索。所以从这个观点来说,搜索不用放在很重要的位置,只要我想要使用它,我能立刻知道它在哪就成。

迅雷看看首页的搜索条放在了主导航的底下:

相对于页面的主导航来说,搜索条的颜色浅很多,视觉焦点在主导航上,但检索条的位置遵守了大多数网站默认设计,放在主导航和内容区之间,所以当用户想要用搜索条的时候,找起来还是很方便的。

频道首页的搜索条,放在了频道主导航的右边:

这里也遵循占用地方不大,位置很显然的原则。

3、详细信息页设计

其实在迅雷看看,详细信息页面的地位不是很受重视,很多页面上的链接是直接链接到在线播放页面去的,只有在搜索结果页面,有详细信息页面的链接:

详细信息页面,设计也是比较清晰简洁:

标题很明显,重点链接很突出,没有太多的空白,也没有拥挤。

给用户提供推荐信息:

4、在线播放页面

在线播放页面是最终的服务页面,这个页面是整个系统里边至关重要的页面,也是决定用户体验的终极页,系统其它地方设计得再好,也不能弥补这个页面的不好。迅雷看看的在线播放页面的在线播放也和详细信息页一样,很简洁:

迅雷看看网站设计分析相关推荐

  1. 摘自迅雷视频网站基于CSS+HTML实现大气清新的蓝色导航

    代码简介: 这个导航条做的不错,是模仿迅雷视频网站的,完全基于CSS和HTML代码,大气清新,请运行一下看看效果如何. 代码内容: <html xmlns="http://www.w3 ...

  2. 发现一个巨好的迅雷资源网站

    家里装了宽带,发现通过迅雷下载的东西比较快,BT特别的慢,好像电信封掉了一样. 这个网站的webcast真多,我一口气下了一大堆,慢慢看,能更加深入的学习MS的技术了. http://blog.xun ...

  3. 网站设计分析:banner中的字体结构

    对于我们通常所看到的网站banner,它的本身形状决定了其固定的构成方式一般为矩形,横幅,左右结构和居中,它的文字特点是主题式,一般分为主标题和副标题,文字较多,设计的时候还需要考虑应用到网站各种尺寸 ...

  4. 【转自VeryCD]中小型企业网站设计分析

    分析中小型企业网站建设,公司网站建设应注意的重点与原则分析,希望对大家有所帮助. 一.面向买家和潜在消费者 一个中小型企业的网站,需要告诉你的买家和潜在消费者:你是干甚么的,你生产或者销售甚么样的产品 ...

  5. 韩国商业网站设计分析

    一.页面结构 韩国网站的页面结构相对来说比较简单,可以说几乎是统一的风格,顶部的左边是网站的logo,右边就是它的导航栏,和国内网站不一样的地方它甚少采用下拉菜单的样式,而是把各级栏目的下级内容放在导 ...

  6. 电子商务网站设计分析--首屏设计

    首屏(above the fold)是指不滚动web网页屏幕就能被用户看到的画面. 世界著名的网页易用性专家尼尔森曾经有报告显示,首屏以上的关注度为80.3%,首屏以下的关注度仅有19.7%.这两个数 ...

  7. 故障排错-解决迅雷播放器在Windows 10中长时间停止响应

    这两天在几家客户那里介绍微软的Windows Azure,有几个精彩的demo我还录制了视频.没成想迅雷播放器在我的Windows 10预览版上似乎得了水土不服之症,每次打开视频,最起码要卡10~15 ...

  8. linux系统可以用迅雷吗,在Linux系统下使用wine运行迅雷5的方法

    在Linux系统下使用wine运行迅雷5的方法 一.下载ies4linux 去 http://www.tatanka.com.br/ies4linux/page/Installation 下载ies4 ...

  9. asp实训报告摘要_个人网站实训报告---asp.NET 动态网站设计

    个人网站实训报告---asp.NET 动态网站设计 网站开发技术实训报告 学生姓名 学 号 学 院 专 业 计算机应用技术计算机应用技术 题 目 asp.NET asp.NET 动态网站设计动态网站设 ...

最新文章

  1. OCP-052 053部分答案解析
  2. iphone 使用popViewController如何避免内存泄露
  3. javascript 值传递与作用域
  4. Boost:实现异步客户端
  5. java学习(2):学生管理系统2
  6. linux jobs
  7. 4.3. tensorflow2实现相关分析概述与简单相关系数计算——python实战
  8. html/css静态网页制作
  9. Java编程基础知识(一)
  10. 为什么这么多人会选择单页设计?
  11. TypeScript 之 More on Functions
  12. WPF实现VS界面效果
  13. 数据库ALTER语句使用
  14. #萌新日志#3.使用pix2pix CycleGAN和3d CycleGAN实现T1和T2加权模态的互转
  15. github镜像网站_Jenkins把GitHub项目做成Docker镜像
  16. 一分钟教你如何批量处理图片
  17. oracle 手机壁纸,Android修改手机壁纸功能
  18. 信息资源管理【三】之 信息系统资源管理
  19. 数学优化入门:凸优化
  20. 如何改变胆小怕事的性格?

热门文章

  1. storage与cookie的相同点和区别
  2. 深浅拷贝的概念?如何实现深浅拷贝?
  3. Ps 初学者教程「52」如何更改照片中的天空颜色?
  4. mysql 迁移 ibdata1_mysql ibdata1文件迁移
  5. 手机端html5 打开文件,H5关于手机本地系统文件的写入、读取及删除
  6. Java Web当中使用EasyUI|快速建立漂亮的后台网站(教程+源代码)
  7. html翻页控件,jQuery分页插件pagination.js
  8. MySQL插入汉字报错的解决方案
  9. JavaScriptCore全面解析 (上篇)
  10. 如何解决excel输入第一个单元格时卡顿的问题