博客主题完工啦～

[radishzz]

书接上文，为爱发电，花俩月时间做的博客主题 完工啦～

始于 V2 ，终于 V2 。最后再发这一次。

Retypeset 是一款基于 Astro 框架的静态博客主题，中文名为重新编排。本主题以 活版印字 为设计灵感，通过建立全新的视觉规范，对所有页面进行重新编排，打造纸质书页般的阅读体验，再现版式之美。所见皆为细节，方寸尽显优雅。

• 预览地址：重新编排
• 仓库地址：Retypeset
• 小作文：Retypeset 博客主题诞生记

[kneep]

挺好看的，不过，标题那个动画感觉有点多余，帧率好像很低，卡顿，按 back 键卡一下很明显。
能不能来个 hugo 版本？

[radishzz]

@kneep 你是说站点标题吗？我确实有考虑删掉这个动画。

掉帧的话，我猜你是不是 iOS 设备？ iPhone 上的 view transition 动画帧率特别低，其它设备上都挺流畅的。

移植 hugo ，我没有这个技术和精力啊 🥲

[katwalk]

可否移植到 hugo ？

[kneep]

@radishzz macOS 和 iOS 上都明显卡，换了浏览器也一样。

[Plumbiu]

astro 就是快啊

[radishzz]

@kneep #4 我在旧 Mac 上试一下，确实有点卡。

主要为了演示所有功能，我开了评论和 KaTeX ，它俩的 JS 不小。还有自定义中文字体的 CSS ，也有十几 KB ，导致动画就有比较卡了。自用的话，完全可以优化掉这些。

你试试 [astropaper]( https://astro-paper.pages.dev/)，同样的动画效果，只是它几乎没有任何 JS ，你看是不是流畅多了。

[radishzz]

@Plumbiu 确实快，性能杠杠的

[65r4Zgm364TDg652]

相对于这么漂亮的博客，我更希望找到个展示+联系表单的漂亮内容体，比如介绍自己，跳转自己的业务和服务，虚拟主机或者 cf 上就能部署最好。博客什么的写不动啊，ai 大潮一来，也没必要写了，要啥木有🤣

[radishzz]

@huguadao 我明白你的意思，就是一上来 “Hi ，我是 xxx 👋”，然后放几个社交图标那种。

怎么说呢，需求不同。你看我也不是程序员，也没有什么业务，也没想着打造个人形象。就单纯想有个载体，偶尔写点文章可以记录下。可能我这个主题更适合于生活、随笔、文学这种风格？

另外，有个老哥把我页面魔改了，就改成你说的那样了😂 https://www.sidhantdhar.com/about/

[metrue]

我也基于开源缝缝补补做了一个.

https://imgur.com/qsxpsMX

<img alt="blog.minghe.me" src="https://imgur.com/a/9OW4Att">

[OWLS]

汉字没有 20px 以上的我都看不下去；

[OWLS]

整体感觉舒适。

[radishzz]

@OWLS 到底是看不下去还是舒适啊😂，标题够大了吧，有 32px

[chengnuo0905]

很棒~

[KevinKL]

OP 是设计师吗？同为码字爱好者，自己还做了一个 app 写东西，最近正在改进内容排版，楼主有兴趣的话可以交流一下写博客的经验 bWV0YW5vdGUudGVhbUBnbWFpbC5jb20K

[lynan]

正文是不是也用 宋体 的话感觉上会比较统一

[radishzz]

@lynan 好问题。是这样的，我在标题中用的字体，叫初夏明朝体，它有很多不寻常的笔画。作为标题字体很合适，它会让人感觉有些不一样的小细节。但如果作为正文字体，本身宋体就不是最佳的屏显字体，再加上大量的异常笔画，会给阅读带来障碍。具体效果可以看： https://imgur.com/a/4pnxEJv

最适合的屏显宋体是思源宋体，但我已经在主题中内置了一套完整的初夏明朝体，包含简、繁、日[三种语言]( https://github.com/radishzzz/astro-theme-retypeset/blob/master/public%2Ffont%2FCommon%20Characters.txt)。如果再内嵌一套完整中文字体，主题就很臃肿了。虽然我有设置一个配置项，可以正文字体改成初夏明朝体，但考虑到阅读体验，我还是选择用黑体。

[radishzz]

@lynan 补下链接。

初夏明朝体预览效果： https://imgur.com/a/4pnxEJv

简、繁、日常用字： https://github.com/radishzzz/astro-theme-retypeset/blob/master/public%2Ffont%2FCommon%20Characters.txt

[lynan]

我的博客是用的
```css
@font-face {
font-family: "source han serif cn";
src: local("Source Han Serif CN"), local("Source Han Serif SC"),
local("Source Han Serif TC"), local("Source Han Serif TW"),
local("Source Han Serif"), local("Noto Serif CJK SC"), local("Songti SC"),
local("SimSong"), url(/fonts/SourceHanSerifCN-Regular.woff2) format("woff2");
font-display: swap;
unicode-range: U+4E00-9FFF;
}
```

`SourceHanSerifCN-Regular.woff2` 字体是用 https://github.com/ecomfe/fontmin 提取出用到的中文字符简化的文件，目前大小为 343 KB ，还在可接受范围内

[lynan]

Fallback 的字体也是 思源宋体