54
edits
(typos) |
|||
(8 intermediate revisions by one other user not shown) | |||
Line 135: | Line 135: | ||
The <syntaxhighlight lang=shell inline>Apl385.ttf</syntaxhighlight> font file must be placed in the same directory as the HTML file, and all APL code must be wrapped in <syntaxhighlight lang=html inline><pre></syntaxhighlight> or <syntaxhighlight lang=html inline><code></syntaxhighlight> elements. | The <syntaxhighlight lang=shell inline>Apl385.ttf</syntaxhighlight> font file must be placed in the same directory as the HTML file, and all APL code must be wrapped in <syntaxhighlight lang=html inline><pre></syntaxhighlight> or <syntaxhighlight lang=html inline><code></syntaxhighlight> elements. | ||
== Bad rendering == | == Bad rendering == | ||
The [[wikipedia:Blink browser engine|Blink browser engine]] instructs the [[wikipedia:HarfBuzz|HarfBuzz]] text shaping engine to prefer fidelity in typeface over fidelity in glyph shape. As a consequence, text using a font that lacks the <syntaxhighlight lang=apl inline>≢</syntaxhighlight> glyph ([[Tally]], [[Not Match]]) often ends up looking like <syntaxhighlight lang=apl inline>≡/</syntaxhighlight> (Match reduction), causing great confusion. The issue affects diverse things like Android WebView, Chromium Embedded Framework, all [[wikipedia:Electron (softwareframework)|Electron]] apps, [[wikipedia:Qt software)|Qt software | The [[wikipedia:Blink browser engine|Blink browser engine]] instructs the [[wikipedia:HarfBuzz|HarfBuzz]] text shaping engine to prefer fidelity in typeface over fidelity in glyph shape. As a consequence, text using a font that lacks the <syntaxhighlight lang=apl inline>≢</syntaxhighlight> glyph ([[Tally]], [[Not Match]]) often ends up looking like <syntaxhighlight lang=apl inline>≡/</syntaxhighlight> (Match reduction), causing great confusion. The issue affects diverse things like Android WebView, Chromium Embedded Framework, all [[wikipedia:Electron (softwareframework)|Electron]] apps, [[wikipedia:Qt software)|Qt software]]), as well as many popular web browsers, like Amazon Silk, Google Chrome, Microsoft Edge, Brave, Opera, Vivaldi, and the Yandex Browser. | ||
In browsers, it is possible to mitigate the problem by overriding the used font, | In browsers, it is possible to mitigate the problem by overriding the used font, either by configuring the browser to override all font specifications, or via a user style manager like [[wikipedia:Stylus (browser extension)|Stylus]] or [[wikipedia:Stylish|Stylish]], which gives more fine-grained control. | ||
<syntaxhighlight lang=css> | |||
div.message pre,div.message code{font-family:"APL385 Unicode"} | Here are examples of appropriate user style rules for some common websites: | ||
</syntaxhighlight> | |||
{|class=wikitable | |||
! Domain !! Rule | |||
|- | |||
| chat.stackexchange.com || <syntaxhighlight lang=css inline>div.message pre,div.message code{font-family:"APL385 Unicode"}</syntaxhighlight> | |||
|- | |||
| stackexchange.com || <syntaxhighlight lang=css inline>.s-prose code,.comment-copy code{font-family:"APL385 Unicode"}</syntaxhighlight> | |||
|- | |||
| discord.com || <syntaxhighlight lang=css inline>code{font-family:"APL385 Unicode"!important}</syntaxhighlight> | |||
|- | |||
| github.com || <syntaxhighlight lang=css inline>textarea,.cm-line,.blob-code-inner{font-family:"APL385 Unicode"}</syntaxhighlight> | |||
|} | |||
== Changing font in Dyalog RIDE == | == Changing font in Dyalog RIDE == | ||
[[Dyalog Ltd]]'s cross-platform RIDE interface, which is the default GUI interface on all non-Windows platforms, | [[Dyalog Ltd]]'s cross-platform RIDE interface, which is the default GUI interface on all non-Windows platforms, did not expose a font setting until version 4.5. However, it is trivial to change font: | ||
* Open ride-base.css[[#loc|*]] | * Open ride-base.css[[#loc|*]] | ||
* Find the line that says <syntaxhighlight lang=css inline>src: url('./fonts/Apl385.woff') format('woff'), url('./fonts/Apl385.ttf') format('truetype');</syntaxhighlight> | * Find the line that says <syntaxhighlight lang=css inline>src: url('./fonts/Apl385.woff') format('woff'), url('./fonts/Apl385.ttf') format('truetype');</syntaxhighlight> | ||
Line 160: | Line 170: | ||
==Designing a font== | ==Designing a font== | ||
Making a good APL font is no small task. Since many [[glyph]]s share sub-glyphs due to the history of [[overstrike|overstriking]], multiple dimensions of commonality | Making a good APL font is no small task. Since many [[glyph]]s share sub-glyphs due to the history of [[overstrike|overstriking]], multiple dimensions of commonality need to be aligned. The following table can help: | ||
{|class=wikitable | {|class=wikitable | ||
!Class !! Glyphs | !Class !! Glyphs | ||
|- | |- | ||
| alphas || <code>⍺⍶</code> | | alphas || <code>⍺⍶@</code> | ||
|- | |- | ||
| arrows-down || <code>↓⍗⍖</code> | | arrows-down || <code>↓⍗⍖</code> | ||
Line 178: | Line 188: | ||
| brackets || <code>[]⌈⌊⌷</code> | | brackets || <code>[]⌈⌊⌷</code> | ||
|- | |- | ||
| circles || <code> | | circles || <code>○⍥⍟⌽⍉⊖⍜⊙⌾∅</code> | ||
|- | |- | ||
| colons || <code>:⍠÷⌹</code> | | colons || <code>:⍠÷⌹</code> | ||
Line 184: | Line 194: | ||
| commas || <code>,⍪;⍮</code> | | commas || <code>,⍪;⍮</code> | ||
|- | |- | ||
| dashes || <code>- | | dashes || <code>-+÷⌹⌿⍀⍪⍏⍖⊢⊣</code> | ||
|- | |- | ||
| dels || <code>∇⍒⍫⍢</code> | | dels || <code>∇⍒⍫⍢</code> | ||
Line 192: | Line 202: | ||
| diamonds || <code>⋄⌺⍚</code> | | diamonds || <code>⋄⌺⍚</code> | ||
|- | |- | ||
| diereses || <code> | | diereses || <code>¨⍨⍥⍤⍣⍢⍡⍩∵</code> | ||
|- | |||
| dots || <code>.:;?!⍰∵‼</code> | |||
|- | |- | ||
| epsilons || <code>∊⍷</code> | | epsilons || <code>∊⍷</code> | ||
|- | |- | ||
| equals || <code>= | | equals || <code>=≠⌸⍯</code> | ||
|- | |- | ||
| iotas || <code>⍳⍸</code> | | iotas || <code>⍳⍸</code> | ||
|- | |- | ||
| jots || <code> | | jots || <code>∘⍤⍛⍝⍎⍕¤⌾⟃⟄</code> | ||
|- | |||
| letters || <code>⍺⍶∆⍙∂∊⍷⍳⍸λπ⍴ϼχ⍵⍹∫</code> | |||
|- | |- | ||
| omegas || <code>⍵⍹</code> | | omegas || <code>⍵⍹</code> | ||
|- | |- | ||
| quads || <code>⎕⌸⌹⌺⌻⌼⍁⍂⍃⍄⍇⍈⍌⍍⍐⍓⍯⍰</code> | | quads || <code>⎕⌸⌹⌺⌻⌼⍁⍂⍃⍄⍇⍈⍌⍍⍐⍓⍯⍰</code> | ||
|- | |||
| quotes || <code>'!⍘⍞"‼</code> | |||
|- | |- | ||
| shoes-down || <code>∪⍦</code> | | shoes-down || <code>∪⍦</code> | ||
|- | |- | ||
| shoes-left || <code> | | shoes-left || <code>⊂⊆⍧⟃</code> | ||
|- | |- | ||
| shoes-right || <code> | | shoes-right || <code>⊃⊇⟄</code> | ||
|- | |- | ||
| shoes-up || <code>∩⋔</code> | | shoes-up || <code>∩⋔</code> | ||
|- | |- | ||
| slashes || <code>/⌿⍁%</code> | | slashes || <code>/⌿⍁%⫽</code> | ||
|- | |- | ||
| slashes-back || <code>\ | | slashes-back || <code>\⍀⍉⍂⑊</code> | ||
|- | |- | ||
| stiles || <code><nowiki>|</nowiki>⌽⍒⍋∥⍭⍦⍧</code> | | stiles || <code><nowiki>|</nowiki>⌽⍒⍋∥⍭⍦⍧$</code> | ||
|- | |- | ||
| tacks-down || <code>⌶⊤⍕⍑⍡</code> | | tacks-down || <code>⌶⊤⍕⍑⍡</code> | ||
Line 224: | Line 240: | ||
| tacks-up || <code>⌶⊥⍎⍊</code> | | tacks-up || <code>⌶⊥⍎⍊</code> | ||
|- | |- | ||
| tildes || <code>~ | | tildes || <code>~⍬⍭⍱⍲</code> | ||
|- | |- | ||
| underscores || <code> | | underscores || <code>_⍙⍷⍛⍸⊆⊇⍊⍜⍶⍹⍮⍚⍘ⒶⒷⒸⒹⒺⒻⒼⒽⒾⒿⓀⓁⓂⓃⓄⓅⓆⓇⓈⓉⓊⓋⓌⓍⓎⓏ</code>* | ||
|- | |- | ||
| wedges-down || <code>∨⍱⍌</code> | | wedges-down || <code>∨⍱⍌</code> | ||
|- | |- | ||
| wedges-left || <code>< | | wedges-left || <code><≤⍃ᑈ«</code> | ||
|- | |- | ||
| wedges-right || <code>> | | wedges-right || <code>>≥⍄⍩ᐵ»</code> | ||
|- | |- | ||
| wedges-up || <code>∧⍲⍓</code> | | wedges-up || <code>∧⍲⍓</code> | ||
|- | |||
| miscellaneous || <code>➥∞√˝⇐</code> | |||
|} | |} | ||
:<nowiki>*</nowiki> [[Dyalog APL]] maps the traditional APL underscored alphabet to [[Unicode]]'s circled uppercase letters. | |||
== References == | == References == | ||
<references/> | <references/> | ||
{{APL development}}[[Category:APL character set]][[Category:Lists]] | {{APL development}}[[Category:APL character set]][[Category:Lists]] |