惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

C
Check Point Blog
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
L
LangChain Blog
云风的 BLOG
云风的 BLOG
M
MIT News - Artificial intelligence
A
About on SuperTechFans
J
Java Code Geeks
量子位
博客园 - 三生石上(FineUI控件)
博客园 - Franky
博客园_首页
H
Hackread – Cybersecurity News, Data Breaches, AI and More
IT之家
IT之家
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
Apple Machine Learning Research
Apple Machine Learning Research
Engineering at Meta
Engineering at Meta
雷峰网
雷峰网
D
DataBreaches.Net
人人都是产品经理
人人都是产品经理
Martin Fowler
Martin Fowler
有赞技术团队
有赞技术团队
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻

OhYee 博客

小鹏辅助驾驶测评|OhYee 博客 小鹏非支持手机开启自动解锁|OhYee 博客 使用函数计算实现 301 重定向|OhYee 博客 针对 HTML 内容使用 Ant Design 图片弹框|OhYee 博客 博客进程泄露及僵尸进程解决|OhYee 博客 蓝易云服务器体验|OhYee 博客 SSH 调起本地 VSCode|OhYee 博客 【2022 秋招内推】阿里云后端研发工程师|OhYee 博客 使用函数计算获取 IP 地址信息|OhYee 博客 正确获取客户端 IP/HTTP Header 也可能重复|OhYee 博客 评测 Oculus Quest2 及 BigScreen|OhYee 博客 NextJS 热重载保留状态|OhYee 博客 如何优雅地贴 gist 代码|OhYee 博客 Linux 精细化文件权限|OhYee 博客 VSCode 容器开发环境|OhYee 博客 Clash 的不兼容更新排查|OhYee 博客 Zeek 导出 PCAP|OhYee 博客 记一次 ssh 配置问题|OhYee 博客 Git Commit 规范化工具|OhYee 博客 谈谈《星之卡比-探索发现》|OhYee 博客 VSCode 快捷键绑定 Shell 命令|OhYee 博客 ASN.1 语法及 X.509 证书格式解析解析|OhYee 博客 腾讯企业邮箱忽略 MX 记录发信|OhYee 博客 Chrome/Edge 标签组插件|OhYee 博客 【应届内推】阿里云后端研发工程师|OhYee 博客 损坏的 Typecho 备份处理为 JSON|OhYee 博客 VS Code VIM 插件高效使用|OhYee 博客 SSH 正反向代理|OhYee 博客 Let's Encrypt 根证书过期引发的问题|OhYee 博客 OpenWRT 忽略内核依赖|OhYee 博客
博客前端字体选择|OhYee 博客
2021-11-16 · via OhYee 博客

博客前端字体选择

根据字体效果选择了一个清晰易读还尽可能不那么常规的可商用字体

这是一篇最后编辑于 5 年前 的文章,其内容可能与目前实际情况差异较大,请注意甄别

博客前端字体选择

一般来说,如果有一个比较不错的字体,那么可以给访问者留下不一样的印象。友链里 Yle 的字体就很好地满足了好看 + 不影响阅读两点。
F12 查看了下对应的字体是 https://cdn.jsdelivr.net/gh/ZhongZN/ZFonts/13.woff2

简单测试了下,该字体的效果挺好的

@font-face {
    font-family: btfFont;
    src: url(https://cdn.jsdelivr.net/gh/ZhongZN/ZFonts/13.woff2) format('woff2')
}

body {
    font-family:"btfFont" !important;
}

汉仪唐美人字体汉仪唐美人字体

该 CDN 来自于 ZFonts 项目,使用字体识别软件识别的结果是 汉仪唐美人体,很不幸这是一个非商用字体。
虽然严格来说个人博客不属于商用,但是真较真也是存在隐患的

(4)但是,无论如何,尽管有上面的许可,您不得将许可字库或其中的任何字体设计用于您或其他人的经营等任何商业活动中, 包括但不限于:不得对外销售或提供许可字库或其中的任何字体,无论通过何种技术方式; 不得将许可字库或其中的字体加载到您或第三方经营的产品中; 不得将许可字库中字体或单字用于企业名称、商号 、商标、包装、装潢、网页设计、广告或产品/ 服务宣传材料中;

但是有了换字体的想法,就还是希望能把这个功能落地。所以针对可商用的字体进行了选择。

首先要明确目标:字体应用在博客内,博客属于高密度文字场景,难以识别的字体必然不能选择。因此常用于设计的手写体、艺术体实际上都无法使用。同时,还需要考虑由于具体的内容,繁体字库也不能考虑,因此实际上可供选择的范畴很小。

字由free-font 进行了对比挑选

主要有了如下选项

  • 素材集市康康体

    素材集市康康体素材集市康康体

  • 杨任东竹石体

    杨任东竹石体杨任东竹石体

  • 仓耳周柯正大榜书

    仓耳周柯正大榜书仓耳周柯正大榜书

  • 站酷快乐体

    站酷快乐体站酷快乐体

  • 摄图摩登小方体

    摄图摩登小方体摄图摩登小方体

  • 腾祥嘉丽准粗圆简

    腾祥嘉丽准粗圆简腾祥嘉丽准粗圆简

对比后,摄图摩登小方体本身汉字体验较好,但是英文不够突出,因此额外引入了英文的 Bitter 作为替换

LICENSE