Bloffy 在阅读者的页面上只需添加一个小的 3.2KB 脚本。您可以决定是否运行广告，使用哪些分析工具，以及在哪个域名上发布。可以在编辑器中自由书写。纯文本没有语义。块编辑器很难表达语义。Bloffy 的设计使得 Markdown、HTML、CSS 和 JavaScript 让您精确表达您想要的语义。源预览 < style > .highlight { background-image : linear-gradient ( 90 deg , rgba ( 91 , 46 , 229 , 0.7 ), rgba ( 139 , 107 , 255 , 0.4 )); color : white ;} </ style > ## Bloffy 编辑器确实方便。左侧是编辑器，右侧是预览：这种分屏写作体验。方便，是吗？### 来吧，这就够了吗？一点也不。Bloffy 的另一个魅力是优化之上的优化。您的博客旨在在 [PSI 标准] ( https://developers.google.com/speed/docs/insights/v5/about ) 上达到 < strong class = "highlight" > 100 分的 Web Vitals 和性能、最佳实践、SEO 和可访问性。 </ strong > 快，是吧？< small > 好吧，这可能因博客而异。 </ small > 让我只问您三件事。``` mermaid flowchart LR Q1([我想拥有自己的博客。]) -->|是| Q2([自托管维护太繁琐。]) Q1 -->|否| P[平台博客就足够] Q2 -->|是| Q3([性能对我很重要。]) Q2 -->|否| W[自托管] Q3 -->|是| B[Bloffy] style B fill:#5b2ee5,stroke:#8b6bff,color:#fff ``` 如果三者都是“是”，Bloffy 值得一试。而且... 您可以带上自己的域名，自由使用 CSS 装饰博客，支持多种语言发布，通过 IndexNow 快速被搜索引擎索引，依赖于保护域名声誉的基础设施，添加成员到您的博客，等等... ~~我就说到这里。~~ 每种风格的主题您想要什么样的博客？一本杂志封面、一个文学季刊、一个时事通讯、一幅照片马赛克……选择您喜欢的并应用。没有一个合适？围绕自己的品牌塑造它。单靠按钮和下拉菜单无法提供精确的控制。使用 CSS 精确自定义您的博客。CSS 预览自定义CSS 72 --color-surface-1 : #ededea ; 73 --color-surface-2 : #e4e4e0 ; 74 --color-hairline : #dcdcd7 ; 75 --color-hairline-soft : #e6e6e1 ; 76 --color-ink : #1a1922 ; /* 16.2:1 */ 77 --color-ink-muted : #55525f ; /* 7.1:1 */ 78 --color-accent-iris : #5b2ee5 ; 79 --color-accent-iris-deep : #4a23c4 ; 80 --color-accent-iris-bright : #6a3df5 ; 81 --color-link : #5b2ee5 ; /* 6.6:1 */ 82 --color-link-hover : #4a23c4 ; 83 --color-focus : #5b2ee5 ; 84 --color-on-accent : #ffffff ; /* 7.1:1 on an iris fill */ 85 color-scheme : light ; 86 } 87 88 /* 深色主题。深度来自于提升表面，而不是边框。 */ 89 :root [data-theme="dark"] { 90 --color-canvas : #0a0a0d ; 91 --color-surface-1 : #141318 ; 92 --color-surface-2 : #1d1b23 ; 93 --color-hairline : #28252f ; 94 --color-hairline-soft : #1b1921 ; 95 --color-ink : #f5f4f6 ; /* 18.0:1，淡白色，以减轻眩光 */ 96 --color-ink-muted : #9b97a5 ; /* 6.9:1 */ 97 --color-accent-iris : #5b2ee5 ; 98 --color-accent-iris-deep : #4a23c4 ; 99 --color-accent-iris-bright : #8b6bff ; 100 --color-link : #8b6bff ; /* 5.31:1，深色背景下纯虹彩色只有 2.79:1 */ 101 --color-link-hover : #a892ff ; 102 --color-focus : #8b6bff ; 103 --color-on-accent : #ffffff ; 104 color-scheme : dark ; 105 } 106 107 /* 根据用户的系统偏好自动选择颜色方案，直到明确选择主题。 */ 108 @media ( prefers-color-scheme : dark ) { 109 :root :not( [data-theme] ) { 110 --color-canvas : #0a0a0d ; 111 --color-surface-1 : #141318 ; 112 --color-surface-2 : #1d1b23 ; 113 --color-hairline : #28252f ; 114 --color-hairline-soft : #1b1921 ; 115 --color-ink : #f5f4f6 ; 116 --color-ink-muted : #9b97a5 ; 预览 现场查看 / 无需安装，无需 Cookies 无 Cookies，无需存储 IP，也不将任何信息交给第三方，因此也没有 Cookie 横幅要放置。您的读者隐私至上。博客、工作区、用户。灵活，结构良好 一个博客可以有多个成员，您可以运营多个博客。所有的一切都生活在一个工作区中。写作和管理博客是不同的权限。工作区 您的工作区 您的科技博客 博客 您的个人博客 博客 您的团队博客 博客 Kim Miller Cater 工作区 其他工作区 您公司博客 博客 博主 成员 成员 成员 成员 您 博客所需的一切 帖子 原文 1，翻译 5 英语 如何构建一个轻量级博客 lightweight-blog 您已发布 1,284篇 西班牙语 Cómo crear un blog ligero lightweight-blog-es 您已发布 417篇 法语 Comment créer un blog léger lightweight-blog-fr 您已发布 236篇 日语 軽量なブログの作り方 lightweight-blog-ja 您已发布 188篇 韩语 가벼운 블로그를 만드는 법 lightweight-blog-ko 您已发布 142篇 繁体中文 如何打造輕量部落格 lightweight-blog-zh-hant 您的草稿 - 本地化 将一个原文及其翻译放在一起。PageSpeed Insights 100 表现 100 可访问性 100 最佳实践 100 SEO Web Vitals 良好 FCP 0.8s LCP 1.7s TBT 0ms CLS 0 性能 查看所有四个 PageSpeed