我又回来了
曾经几度对自己的博客开了又关,最初一个博客应该是在读初中的时候建起来的,使用的是 wordpress。但都没写什么文章,每次想写点什么,就觉得没什么好写的,或者写不出来。。等域名过期或是vps过期,然后也就这么丢掉了。比起写博客还是建博客比较好玩😊况且有了生成式人工智能,写作负担会小很多。
框架选择
我对前端不是很熟悉,SSG(Static Site Generator) 框架除了主流的 Hexo, Hugo, Jekyll 之外,我几乎不认识其他的。这几个框架在我看来都不是很灵活(不好整活)。
正好我发现某位页面仔群友也在用重写博客,使用了 Astro。之后我也去了解一下关于这框架的 features,令我比较感兴趣的是 Component Islands,它可以使用任何被支持的UI框架(比如 React, Svelte, Vue)作为组件,还有 MDX,这就相当有利于整活。SSR 的支持也是有的,以后可能会用来显示动态内容,比如评论。于是就选择了 Astro。
目标
- 很快的页面打开速度
- 无障碍
- 搜索引擎友好
- w3m 友好
- 尽可能避免 JS
大概就是灯塔跑分要4个100,最初设定的目标算是达到了。
过程记录
设计
起初,我打算根据 Material You 的风格来设计我的博客,也就是现在(2023) Google 的设计语言。我模仿了 Material 官网的超大的R角(Radius: 40px),但后来我发现,过大的圆角严重影响了内容的展示。这里的逻辑是,为了看起来更协调,大圆角需要足够的留白,这就导致了内容展示的空间变少了。有空我一定要写一篇《圆角批判》!
色彩方面使用了 Material Theme Builder 进行调色。后面为了方便使用了 tailwind-material-colors 作为插件,只要设定一个 primary color 就能计算出其他的颜色,DarkMode 也自动适配好了。 写这篇博客的时候,使用了 #405e0d 作为主题色。以后看心情换。
CSS
初版使用纯正的 CSS 进行页面布局,写着写着越来越乱了,第一次写规模稍大的页面,不知怎么管理 CSS。后面使用 Tailwind CSS 负担小了很多,首先不用 template 和 css 来回切,不知不觉找不着 tab 了。如果要问为什么不写在 <style>
,因为我不想看到 Network 里一大堆 stylesheet(这什么强迫症),实际上对加载速度也没很大影响。
最后的话
接下来,我将继续优化和完善这个博客,还有很多想法没实现呢。就这样。
测试下评论?