2个周末，历时100+小时，YourBatman新版Blog正式上线

今天是2021年高考第一天，作为过来人给广大考生的一个小小建议：不要提前交卷，因为即使最后35秒依旧可能拿下13分。

前言

你好，我是YourBatman。本文阅读起来很轻松，介绍我近期建站的一些心得和站点内容分享：https://yourbatman.cn

正所谓每个技术人都应当有个个人站点。最近花了些时间“翻新”了我那博客，决定“弄它”的冲动是觉得其布局有点跟不上时代了（虽然还只run了一年），且内容不算丰富，分类不够清晰，所以决定捯饬捯饬。

经过2个完整周末，历时100+小时，从0开始重新设计、开发、部署、搬运资料，于2021-06-01正式上线。贴几张图来提前“感受一下”：

亦可直接访问（使用PC访问效果最佳）：https://yourbatman.cn

首页01-动态背景
首页02-推荐文章
首页03-文章列表（时间倒序排列）

本文提纲

版本约定

  • YourBatman's Blog

正文

新站点采用更符合现代化的框架、主题来布局加以实现，所以整体呈现上还是不错的。下面附上老站点的图片：

个人觉得新站点相较于老站点：有如下优势：

  1. 宽屏布局，对宽屏显示器的显示效果更好，更时尚
  2. 响应式框架，对移动设备更适应（说明：虽说适配了移动设备，但使用PC访问效果最佳）
  3. 云主机独立部署，采用公开Robot协议，对搜索引擎更友好
  4. 加入交互动效，用户体验更好
  5. 技术文章内容页面更聚焦，消除杂音提升阅读效率
  6. 新增除了技术文章菜单外的更多“菜单”，体现出个人站点更具个性化
  7. 提供“湖人总冠军”、“小游戏”、“个人简历”等功能页面，能让站点多些人文气息。技术人并非一块木头~
  8. ...

下面按照菜单顺序，进行简单介绍下哈（前方多图预警）。

首页

相较于大多数技术博客，本站点的首页内容相对丰富，看点颇多：

  • 开屏页使用动态（视频）背景，内容：陈莹-一直很安静。如下图所示（由于移动设备无法很好的对视频进行展示，因此适配为背景图片）：

  • 公告栏：实时更新，公示站长（YourBatman）or站点的方方面面近况，如下图所示：

  • 文章推荐：you know，本站点是个纯技术博客。此模块用于在首页做文章推荐：推荐的文章可能是最新的，亦可能是“捞起来”的，避免了早期发布的“优秀”文章永远沉睡。如下图所示：

  • 文章列表：作为本站点的核心，拥有好的技术文章才是王道。本列表按照时间倒序排列且分页显示，如下图所示：


    为了抓住广大技术小伙伴的“视觉”，文章若没有自行制定封面图，系统将依据文章标题，自动从系统中匹配到一张靓图放上去，如上图就是看到的效果。

从底部的统计数据看：上线5天左右，PV有1000/天，UV约400/天。若能保持的话，这个量就已远远超出我的预期，服务器得升配了

  • 文章详情：作为本站点的的内核，除了文章内容自然必须硬核外，阅读体验也需要跟上。本part设计理念为：沉浸式阅读，去掉干扰项，又不失方便性，努力平衡。如下图所示：

技术专栏

我认为技术文章大都需要通过专栏的形式去学习、理解才能拥有更好效果，单篇文章篇幅有限导致一般只能浮于表面，并不能带来实质上的改变。

不管是我的公众号（ID：BAT的乌托邦），还是个人博客，主打的都是技术知识点以小而美的专栏形式呈现，做到合理拆解，逐个击破。一方面方便大家的阅读，另一方面我自己”复习“起来也非常方便。

本页面的作用便是对文章进行按专栏分类，方便读者能顺序聚焦和索引。如下图所示：

说明：新站点才建立，文章资料还只搬迁了很少一部分，这项工作将持续进行。包括公众号文章、CSDN的付费专栏等都会搬来免费供以阅读

图书馆

当下是个信息大爆炸的时代，查阅硬盘自己”搜藏“的（技术）电子书，那是真的只起到了搜藏的作用呀。要不是电子书，早就落灰很厚了。

技术路线到了”中年“也应该学会做减法，这是为了更聚焦。所以图书馆模块就是这样一个目的：放上10本左右”电子书“，提供在线浏览（当然也提供下载功能），随时随地可连续阅读，做到方便和聚焦，提高真实效率。如下图所示：

说明：书籍均经过高度压缩处理，体积相比压缩前小了5-10倍，提高在线阅读体验。PS：手机端暂不支持在线阅读，毕竟每本书也属”流量大户“

短视频

相较于我的老站点，新站点增加了人文生活气息，比如短视频模块就是体现。

本页面用于搜藏”经典“短视频，内容主要来自自制和抖音。相同的搜集理念：聚焦。因此数量不会很多，但尽力确保每个都值得留念，如下图所示：

PS：手机端只适配2~3个视频内容，更多内容请使用PC打开观看

湖人总冠军

2005年知道NBA，2006年开始看（关注）科比、詹姆斯、姚明、麦迪、艾弗森、安东尼、韦德、波什、邓肯、吉诺比利、帕克、纳什、斯达德迈尔、比卢普斯、阿泰斯特、巴蒂尔、加内特、雷阿伦、霍华德、奥尼尔、华莱士、JR史密斯、克里斯保罗...

北京时间2021年6月4日，湖人在系列赛败给保罗带领的菲尼克斯太阳队，詹姆斯史上第一次首轮游，我们青春真的结束了吗？仅以此页记录热爱篮球的热血青春。如下图所示：


文章

终于进入”正题“了，毕竟咱这是个地地道道的技术博客嘛，技术文章才是它的主题，要不怎么说把此菜单放在中心位置呢：

此菜单有2个子菜单，旨在帮你按不同维度，快速定位到你想要的文章/专栏。

  • 统计：按照标签、分类维度进行分类

  • 日历：按照时间维度（倒序）进行展示

我的

顾名思义，本菜单主要记录站长YourBatman的一些”私货“，所以它必然也分了好几个子菜单（后续还会持续扩充哈）：

  • 关于我：顾名思义喽，YourBatman的自我介绍哈



  • 碎碎念：有些东西不想发到wx朋友圈，就会通过手机发到这里来

  • 留言板：什么种草、灌水都可以来这里。但是，不可以定！外！卖！

  • 相册：光影留念，记录生活，留下瞬间


    当然喽，个人私密相册是加密的，需要密码才能访问，密码是：xxxxxx

更多

菜单栏的”名额“毕竟是有限的，因此对于一些周边性的功能就会放在此菜单类下面：

  • 我的简历：顾名思义，这是我求职会用得简历喽。密码是：xxxxxx

  • 小游戏： 程序员已经很卷了，此页面让你休闲一会、放松一下



  • 程序员导航：每个人的搜藏夹里都躺着众多网址，来，这个程序员导航帮你减负

搜索

现在大家获取信息的渠道重度依赖搜索引擎，因此本站提供了站内搜索功能：输入关键字即可快速找到相关内容。

Tips：站内搜索的范围是技术文章，毕竟这才是本站核心嘛~

总结

新站点内容较为丰富，除了干巴的技术文章外，还融入了简单的人文、休闲娱乐等模块。多次，体验过的小伙伴们反馈也是褒贬不一：

  • 不纯粹：作为技术博客，应该是白底黑字的网站，不要花里胡哨
  • 酷炫：增加动效、增加多媒体元素、增加休闲游戏，使得一看就出自程序员之手
  • ...

总的来讲，虽然有贬有踩，我自己还是比较满意的（自己都不满意的话，也不会上线嘛）。我赞同技术博客应该更纯粹些，但是我又觉得个人博客应该具有个性，多些个性化元素，百花齐放是最好的。毕竟它流量不大，让这里成为自己的一片自留地也无可厚非嘛。

本站因为准备时间不长，上线稍仓促，因此主要还存在如下两个问题：

  1. 老站点的资料、阅读量、评论等信息并未做完整迁移，待续......
  2. 存在一定性能问题：某些页面打开时CPU占用率会飙升，风扇也会响起（如果有前端同学，能否绑定为下是哪块耗性能呢？因为我是做后端的，这块确实不懂）

既然是“重生”，本站对技术文章将做到：分类更清晰，把关更严格，质量把控也会提升一个等级。毕竟重要的事可再重复三遍：本站为纯技术博客、纯技术博客、纯技术博客。

最后，欢迎大家来访、灌水、种草（使用PC访问效果最佳）：https://yourbatman.cn

系列推荐

System.out.println("点个赞吧!");
print_r('关注【BAT的乌托邦】！');
var_dump('私聊YourBatman：fsx1056342982');
console.log("点个赞吧！");
NSLog(@"关注【BAT的乌托邦】！");
print("私聊YourBatman：fsx1056342982");
echo("点个赞吧！");
cout << "关注【BAT的乌托邦】！" << endl;
printf("私聊YourBatman：fsx1056342982");
Console.WriteLine("点个赞吧！");
fmt.Println("关注【BAT的乌托邦】！");
Response.Write("私聊YourBatman：fsx1056342982");
alert("点个赞吧！");

YourBatman：Spring Framework开源贡献者，Java架构师，领域专家。文章不标题党，不哗众取宠，每篇文章都成系列去系统的攻破一个知识点，每个系列可能是全网最佳/唯一。注重基本功修养，底层基础决定上层建筑。现有IDEA系列、Spring N多系列、Bean Validation系列、日期时间系列......关注免费获取

posted @ 2021-06-08 18:53  YourBatman  阅读(453)  评论(3)  编辑  收藏  举报
TOP