| 网站名称 | 无念流的UE基地-用户体验踩坑博客 |
|---|---|
| 域名地址 | https://wunianliu.xyz |
| IP地址 | 128.199.277.172 |
| 站长 | 黄钦勇 161013042 |
为同样学习研究用户体验的同学提供一个专业的学习平台,也为用户体验设计的相关从业者提供一个友好的交流平台。
图片来源花瓣网
小彬
年龄:22
身份:大学生
就读于某高校交互设计相关专业
痛点:在日常的学校课程之外,经常在网络上寻找高质量的相关专业学习资料,但网络上的学习资料良莠不齐,难以辨别伪劣
图片来源花瓣网
阿豪
年龄:26
身份:产品UI助理
就职于某互联网公司产品设计岗位
痛点:刚入行未久,工作中碰到诸多疑点,希望有一个可以学习充电的地方
网站内容更新频率为每周跟新一篇至两篇文章,更新内容为文章部分。
网站logo、导航栏设置、侧边栏内容模块设置不会经常更新。
在国内的互联网行业,用户体验设计越来越被重视,用户体验设计的学习人数和从业人员越来越多,而国内这一方面的研究整合还有发展空间。所以本网站力求建设一个面向用户体验设计学习和从业人员的博客网站,整合网络上现有的部分优秀学习资料,提供给用户。
因为是个人运营维护的博客网站,所以采用成本较低、市场占有率较高的的Wordpress博客平台作为内容管理系统。
网站根据文章分类目录设置导航选项,一篇文章可拥有多个标签分类,所以部分文章会重复出现在不同分类页面内。
除去自己制作的图片,所有非原创图片出处全部在文章内部标明;未使用文章内部图片作为封面的三篇文章,也都在文章内部注明封面出处。
文章《WWDC19全回顾:苹果第五大系统诞生最强电脑到来》封面来源:Pexels
文章《用户研究之访谈法:该如何对用户进行访谈》封面来源:unsplash
文章《SEO心得分享》封面来源:Pexels
PS:
文章图片注明出处展示(部分):

原创文章图片注明:

图库风格以简约为主,在选用图片时剔除修饰点缀过多的图片。图库图片服务于文章,配合文章突出需要说明的重点。色调上大多选区冷色调图片,配合网站主题传达风格。


GitHub学生开发包傻瓜式申请指南
DigitalOcean搭建WordPress傻瓜式架站手册
基于腾讯云的域名绑定IP地址手册
- 背景:本站采用简约的UI设计布局,剔除不必要的装饰元素,同时又借用Material Design的设计理念,将物理世界的视觉规律引入界面设计,网站背景为模拟一张大卡片嵌套于一层浅色背景上,通过阴影制造悬浮效果,无边框卡片式的阴影,引导用户视觉,促进用户对界面信息的理解。
- 字体:文章大节标题使用20号,加粗,黑色;小节标题字体大小为16号,不加粗,黑色;主内容字体大小为13号,偏灰色。三个文字等级,在字号和字重上拉开对比,用户在视觉上有了对比层级,方便用户阅读理解。同时白色背景上使用黑色字体是可读性最高的设计方案。

- 配色:配色上采用科技蓝为主配色大面积留白,蓝色冷静、大气,诚信、专业的情感属性也给人可信任之感,带有用户体验设计理想与感性结合的特征,诚信、专业的情感属性。

- 有文章和字体呈现的地方,背景一般规范为白色,保证黑色字体在网站上的高效可读性。
1页面载入时,侧边栏会从左侧逐个滑入链接地址

2浏览文章时,浏览到该图片,则图片会自动放大强调链接地址

1使用Posts Grid构筑页面布局,进行文章类别筛选链接地址

2使用Posts Carousel在“用户研究”页面结尾添加相关领域文章的帖子轮播链接地址

3使用FooGallery插件,在文章设置各类icon汇集画廊,在文章《如何系统的学习功能图标》末尾
链接地址

使用域名可直接可直接访问我的网站:无念流的UE基地:

我启用了Wordfence安全插件来保护我的网站。目前网站的数据安全平稳正常,防火墙与扫描能力都在正常数值,说明网站目前还没有安全问题:



查看数据发现近一个月内,wordfence阻止了一次针对我的网站的攻击:

整体上看网站安全系数较高,无明显的安全隐患。:
我使用了site24x7监视网站性能,以下是截止到撰写网站报告时(6月27日),site24x7所反馈的网站在不同地区登陆的数据:
8个监视器当下八个监视器运作正常,无停机问题:
在截图的时候(6月27号5:10)我设置在世界各地的8个监视位置(新加坡、
墨尔本 、
圣保罗 、
华盛顿、
哥本哈根、
北京 、
深圳 、
广州 、)中,位于深圳的监视器连接超时::

于是我查看了深圳的具体监视数据:

发现深圳的监视器在6月27号多次连接不上我的网站,也就是说,用户从深圳的用户如果访问我的网站,其用户体验将极差,急需优化。
而查看网站的整体监视数据发现:

国内三个位置的服务器访问我的网站,总停机时间接近45小时,可用性偏低;而国外的地址访问我的网站却畅通无阻。这是个不好的消息,意味着作为最为重要用户群的国内用户,在访问我网站的时候大概率会因为响应时间过长而放弃。也意味着我网站可用性不高,继续优化响应速度。
百度站长认证
已进行的百度的站长工具验证,百度已索引我的网站(验证链接):
但始终无法通过bing的搜索引擎找到我的网站:

上网查阅原因,被给到的建议是可能网站内容太少,遂向网站添加了10偏相关文章;但截止到撰写报告,依旧无法被索引
站长验证前后的数据对比:
六月五号开始验证,在这期间网站寥寥几个我自己的访问量,6月十号时,网站的访问量开始显著上升:

18左右,期间,我开启了Site24x7监视我的网站,猜测这之后网站的大部分访问数据来之监视器,但也不排除搜索引擎站长工具的认证带来的影响:

方法一:主动向搜索引擎提交网站链接
通过向百度和bing主动提交网站URL;的方式,提高网站页面或文章被搜索到的概率:
手动向百度提交网站链接:

方法二:安装百度自动推送代码
给网站内所有页面文章安装百度自动推动代码来提高网站被索引率:
在百度站长工具处copy其主动推送代码:
然后在网站后台安装Header Footer Code Manager插件,这个插件可以为网站内所有页面文章统一添加代码:

安装完毕后,使用该插架统一向网站所有页面粘贴百度自动推送代码:

方法三:主动向搜索引擎提交网站地图sitemap
向百度站长工具和bing网站管理员提交网站的站点地图:
百度站长工具:

方法四:关键词优化
通过YES插件,每一篇文章和页面进行关键词优化,寻找符合文章而又容易被索引的关键词:
示例:

方法五:页面url域名有意义化
按照文章和页面的特征,设计每个页面和面每篇文章的域名url,让其不再是简单的乱码,通过域名直观了解页面属性:
示例:
SEO优化前后数据网站数据对比:
因为几个SEO优化方案同时实施,故数据只能统一统计:
24号晚进行SEO优化后,网站访问量飞速上涨,效果显著。
我选择了++用户访谈++和++A/B测试++两种用户研究方法:
一、用户访谈(录音文件)
问题设置:
- 你对这个网站的整体印象是什么?
- 你认为我的网站主要是做什么的?
- 你觉得这个网站有什么亮点或者缺点吗?
- 你最希望我的网站就行哪方面的改动?
反馈总结:
- 80%用户表示能从网站的内容和配色配图中看出网站的属性。
- 40%的用户提到专业、清爽等关键词。
- 80%的用户表示希望给文章增加封面图片。
- 20%的用户希望将搜索功能放置到更明显的地方。
- 60%用户表示封面不统十分影响界面美观,20%用户表示可以去掉尺寸不统一的封面图。
- 40%的用户希望侧边栏“近期文章” 栏目去掉文章封面设置。
- 60%用户委婉表示希望网站的访问速度难以忍受。
改进方法:
- 在导航栏增加搜索功能
- 为文章增加封面图片
- 统一文章的封面尺寸
- 去除侧边栏“近期文章”模块文章的封面图
- 升级服务器主机,加快网站整体加载速度
改进前页面布局方案:
文章没有封面图片、不足以吸引用户目光,文章内容的传达不够直观。
搜索功能布局于侧边栏,位置不够明显

增加文章封面后,文章封面不统一,布局混乱:
增加侧边栏“近期文章”模块的文章封面,结果发现反馈并不友好:

根据用户访谈反馈改进后的方案:
为文章增加封面图片,并统一封面尺寸:

在导航栏增加搜索功能按钮:

去除侧边栏“近期文章”模块文章封面:

在digitalocean升级服务器主机,改善网站加载速度:

二、A/B测试(录音文件链接)
考察网站二级页面下的文章陈列的两种布局方式
A方案:
二级导航页面内,通过文章后添加分类目录标签区分文章类别:

测试方法:
给定AB组用户共同的任务:不使用搜索功能的情况下,使用网站导航寻找wordpress建站技术文章,再从旁考察他们两组在不同布局方案下的用时。
结论:
B组用户平均用时不到40秒就完成了任务,而A组平均用时在一分钟左右,所有可看出,B方案比A方案更有利于用户理清页面信息,网站架构。
我的网站作为一个分享传播知识资讯的博客,用户的大部分使用场景可能都会是碎片化的,这就对网站的加载速度有一定的要求,加上网站更新速率并不会太高,所以权衡之下,在升级了主机服务器的同时,决定使用WP Super Cache插架,这个插件可以在用户访问网站的设备上自动生成网站缓存,优化用户的访问速度。

网站内部分我个人的原创内容和授权转载的其他网站的资源,为保护知识产权和原创内容,决定
使用WP Content Copy Protection & No Righ Click 插件,防止网站内容被右键复制粘贴,保护网站内容版权

网站域名添加了SSL证书,访问域名上有https(链接查看):

















