本站在允许 JavaScript 运行的环境下浏览效果更佳


如何快速完成中文排版优化

141

前言

手动优化的方法就是照着 中文文案排版指北,复制或创造一套自己的排版指南,并且以此作为方法论来指导网站内容排版。

快速优化的方法就是使用现成的工具。

《中文文案排版指北》已经附上了不少相关工具可供参考
仓库 系列 语言
pangu.js pangu JavaScript
pangu-go pangu Go
pangu.java pangu Java
pangu.py pangu Python
pangu.rb pangu Ruby
pangu.php pangu PHP
pangu.vim pangu Vim
vue-pangu pangu Vue.js (Web Converter)
intellij-pangu pangu Intellij Platform Plugin
autocorrect autocorrect Rust, WASM, CLI tool
autocorrect-node autocorrect Node.js
autocorrect-py autocorrect Python
autocorrect-rb autocorrect Ruby
autocorrect-java autocorrect Java
autocorrect-go autocorrect Go
autocorrect-php autocorrect PHP
autocorrect-vscode autocorrect VS Code Extension
autocorrect-idea-plugin autocorrect Intellij Platform Plugin
jxlwqq/chinese-typesetting other PHP
sparanoid/space-lover other PHP (WordPress)
sparanoid/grunt-auto-spacing other Node.js (Grunt)
hjiang/scripts/add-space-between-latin-and-cjk other Python
hustcc/hint other Python
n0vad3v/Tekorrect other Python

本文将简单介绍三款最常用的工具,希望能为你的选择提供参考。

AutoCorrect

🎯 AutoCorrect 的愿景是提供一套标准化的文案较正方案。以便于在各类场景(例如:撰写书籍、文档、内容发布、项目源代码...)里面应用,让使用者轻松实现标准化、专业化的文案输出 / 校正。

项目链接:huacnlee/autocorrect

AutoCorrect 是一个用于改进中英文混排文本中的空格、标点符号的代码格式化工具和 Lint 工具。主要针对中文、日文和韩文(CJK)与英文之间的文本格式进行自动校正,确保文案的准确性和专业性。

AutoCorrect 项目亮点

  • 支持超过 28 种文件类型(Markdown、JSON、YAML、JavaScript、HTML 等),通过抽象语法树(AST)分析仅检查字符串和注释部分。
  • 此外,此项目还提供了一个 LSP 服务器 autocorrect-lsp
  • 此项目支持 Linux、macOS、Windows 和 WebAssembly 的跨平台,还可通过对应的 SDK 在不同的编程环境中使用,如 Rust、Ruby、Go、Python、Node.js、JavaScript (Browser)、Java。

如何使用 AutoCorrect

安装非常简单,在 CLI 中使用时可以通过包管理器如 Homebrew 或 Scoop 安装,也可以通过命令行直接安装。允许允户通过命令行界面直接对文件进行格式化或 Lint 检查。

此工具还可以集成到各种持续集成(CI)环境中,例如 GitLab CI、GitHub Action 和 Travis CI,以自动检查和格式化代码提交。

用户可以定制 .autocorrectrc 配置文件来调整规则,例如自动为中英文之间添加空格、调整标点符号的全角半角,以及配置特定的文字或文件的忽略规则。

赫蹏(hètí)

赫蹏(hètí)是专为中文内容展示设计的排版样式增强。它基于通行的中文排版规范而来,可以为网站的读者带来更好的文章阅读体验。

项目链接:sivan/heti

赫蹏(Heti)是一个专门为中文内容设计的 CSS 库,它旨在通过增强样式来改善中文内容的展示。Heti 基于中文排版规范,支持包括预置的古文和诗词样式在内的多种文本排版需求,使网站内容展示更加美观和专业。

赫蹏项目亮点

  • 为中西文混排提供自动空格和全角标点挤压功能,减少手动调整。
  • 支持简体和繁体中文,以及自适应黑暗模式,适合各种浏览环境。
  • 提供多种预设样式,如行间注、多栏、竖排等,以及兼容常见的 CSS 重置方法,如 normalize.css。
  • 移动端友好,确保各设备上的阅读体验。

如何使用 Heti

使用 Heti 的方式非常简单,只需要在 HTML 文档的 <head> 部分引入 heti.css 文件,并在目标元素上添加 class="heti"。此外,还可以通过 JavaScript 脚本进一步增强功能,如自动添加空格和挤压标点。

Pangu 系列

有研究显示,打字的时候不喜欢在中文和英文之间加空格的人,感情路都走得很辛苦,有七成的比例会在 34 岁的时候跟自己不爱的人结婚,而其余三成的人最后只能把遗产留给自己的猫。毕竟爱情跟书写都需要适时地留白。

与大家共勉之。

项目链接:vinta/pangu.js

Pangu.js 介绍

Pangu.js 是一个用于处理中文与西文字母、数字、符号之间自动添加空格的 JavaScript 库。这个库的主要功能是提高中英文混排的可读性,根据中文排版指南,自动在中文和其他字符之间插入空格,使得文本更为清晰易读。

Pangu.js 项目亮点

  • 轻量级且高效,适用于网页和服务器环境。
  • 支持浏览器和 Node.js 环境,易于集成到现有的项目中。
  • 提供了多种接口,如直接作用于 HTML 元素、处理字符串等,使用方便灵活。

如何使用 Pangu.js

使用 Pangu.js 的方式非常简单,只需要在 HTML 文档中引入对应的 JavaScript 文件,然后调用提供的函数即可实现文本中自动添加适当的空格,以优化中英文混排的排版效果。

在 Node.js 中,也可以直接使用 pangu.spacing(text) 函数来处理字符串,并返回添加了必要空格的新字符串。

另外也支持在 CLI 中使用。

注意:不应该直接将此库用于调整 Markdown 文档的空格,因为这个库是专门为 HTML 网页和不含任何标记语言的纯文本设计的。

盘古系列概述

用户使用

  • Google Chrome (2019-02-09 更新):提供 Chrome 浏览器扩展,自动调整网页上的文本间距。
  • Mozilla Firefox (2019-02-09 更新):为 Firefox 用户提供类似的扩展。

开发者使用

  • 官方支持:
    • pangu.go (Go):适用于 Go 编程环境。
    • pangu.java (Java):可集成到 Java 应用程序中。
    • pangu.js (JavaScript):适用于浏览器和 Node.js 环境,便于 Web 项目中使用。
    • pangu.py (Python):适用于 Python 脚本和应用程序,自动化文本间距修正。
    • pangu.dart(Dart):为 Dart 开发者提供,可用于 Flutter 应用中保持文本呈现的一致性。
    • pangu.space (Web API):一个 API 服务,可从任何编程环境调用以应用文本间距修正。
  • 社区支持:
    • pangu.clj (Clojure):由社区开发的 Clojure 应用程序库。
    • pangu.dart (Dart):为 Dart 开发者提供,可用于 Flutter 应用中保持文本呈现的一致性。
    • pangu.ex (Elixir):适用于 Elixir 编程,有助于 Phoenix 项目或任何基于 Elixir 的应用。
    • pangu.objective-c (Objective-C):适用于 iOS 和 macOS 应用开发。
    • pangu.php (PHP):允许 PHP 应用自动处理文本间距。
    • pangu.rb (Ruby):为 Rails 或纯 Ruby 应用提供 Ruby gem。
    • pangu.rs (Rust):用于 Rust 应用,确保混合语言文本的可读性。
    • pangu.swift (Swift):适用于 Swift 开发的 iOS 和 macOS 应用。

结语

如果您对文中提到的工具有其他疑问或补充,欢迎在评论区一起交流探讨。