{
"path": "/3lukcyypixm2z",
"site": "at://did:plc:bpotnohnlgcj3fbmp7ugx4en/site.standard.publication/3mc3hctrn6ca2",
"tags": [
"tiddlywiki",
"tips",
"guhitdalisay",
"sahangganan",
"youronlyone"
],
"$type": "site.standard.document",
"title": "TiddlyWiki Legibility Tip: font-size",
"content": {
"uri": "at://did:plc:bpotnohnlgcj3fbmp7ugx4en/app.greengale.document/3lukcyypixm2z",
"$type": "app.greengale.document#contentRef"
},
"updatedAt": "2026-01-20T18:27:09.137Z",
"description": "Enhancing your TiddlyWiki legibility",
"publishedAt": "2025-07-22T11:13:07.497Z",
"textContent": "Did you know that you can set your TiddlyWiki font using the latest in accessibility CSS? <!--more--> Simply go to > > > and set the following: - Font size: - Line height: - Font size for tiddler body: - Line height for tiddler body: Basically, what is saying is to set the minimum font size to and the maximum to . Depending on the viewport, adjust the font sizes by . While for the content, it's , same as the default but the minimum font size is . These are good settings for the following reasons: 1. It is flexible to the viewport size 1. It is small screen friendly, minimum font size of for the content while for everything else 1. It is good for desktop and larger screens with a maximum of 1. The user can still zoom or set their own user font size Why and ? - is the generally accepted hard size for minimum font legibility - is the recommended minimum font size for reading Any smaller than these is generally hard for adults and senior citizens, and thus, not good for accessibility. Why ? is the most common default browser size and what we are used to when surfing the net. is also a good choice if one wants to give more larger font size for larger screens, but unfortunately for tablet devices, even a small one, they go by the maximum if in landscape mode. Of course, if one wants to, it is possible to resolve this by adding viewport-based CSS, but that is beyond the scope of this blog post. Line height I found is excellent for (UI elements) while for (reading). This is a personal preference. However, do note that if you're writing using various scripts—Hangeul, Nihongo, Baybayin, Hebrew, Phoenician, Latin/Roman—the line height should match each script otherwise it she glyphs might cramp together and make it harder to read in small viewports or consume too much space in larger screens. For example: - Latin/Roman script: is good as a minimum - Hangeul and Nihongo: - Baybayin: - Hebrew and Phoenician: That's it for this quick, no-edit blog post! <!-- / SPDX-SnippetBegin / / SPDX-SnippetCopyrightText: © 2025 JC John Sese Cuneta <https://im.youronly.one/p/contact-us/> · Yelosan Publishing. SPDX-License-Identifier: BSD-3-Clause / --> <footer class=\"h-entry copyright calcopyright\" prefix=\"spdx: http://spdx.org/rdf/terms#\" property=\"copyrightNotice\" typeof=\"CreativeWork\" vocab=\"http://schema.org/\" style=\"padding: 1rem; border-top: 1px solid; margin-top: 2rem;\"><small style=\"font-size: clamp(0.7rem, 0.8rem + 0.2vw, 1rem);\"> «<cite class=\"calwork\" lang=\"en-PH\" property=\"name\" typeof=\"CreativeWork\" style=\"font-style: normal;\"><a class=\"h-card p-name u-url\" href=\"https://dalisay.youronly.one\" property=\"url\" title=\"Guhit Dalisay (구힛 달리사이): The Wayfarer's Frozen Codex\" typeof=\"WebSite\" style=\"color: unset; text-decoration: underline;\">Guhit Dalisay (구힛 달리사이): The Wayfarer's Frozen Codex</a></cite>» © <time datetime=\"2026\" property=\"copyrightYear\">2026</time> <span class=\"calsource\" lang=\"fil\" property=\"author\" typeof=\"Person\" style=\"text-transform: capitalize;\"><a class=\"h-card p-author p-name u-url\" href=\"https://iam.youronly.one\" property=\"name url\" rel=\"author noopener noreferrer\" title=\"Yohan Yukiya Sese Cuneta\" style=\"color: unset; text-decoration: underline;\">Yohan Yukiya Sese Cuneta</a></span>.<br> License: <span class=\"u-license\" property=\"license\" typeof=\"spdx:License\"><a href=\"https://creativecommons.org/licenses/by-sa/4.0/\" property=\"spdx:name\" rel=\"license spdx:CC-BY-SA-4.0\" title=\"Attribution-ShareAlike 4.0 International (SPDX-License-Identifier: CC-BY-SA-4.0)\" style=\"color: unset; text-decoration: underline;\">Attribution-ShareAlike 4.0 International</a></span> (<span class=\"u-license\" property=\"license\" typeof=\"spdx:License\"><a href=\"https://creativecommons.org/licenses/by-sa/4.0/\" property=\"spdx:licenseId\" rel=\"license spdx:CC-BY-SA-4.0\" title=\"Attribution-ShareAlike 4.0 International (SPDX-License-Identifier: CC-BY-SA-4.0)\" style=\"color: unset; text-decoration: underline;\">CC-BY-SA-4.0</a></span>), except otherwise noted. </small></footer> <!-- / SPDX-SnippetEnd / -->"
}