Better font for rendering IPA (esp. diacritics)

Question

A few years ago there was a discussion here about how to facilitate IPA entry. A user kindly provided this stack app to provide a fly-out keyboard, and in addition there are lots of online character pickers, such as

• http://ipa.typeit.org/full/
• https://r12a.github.io/pickers/ipa/
• http://westonruter.github.io/ipa-chart/keyboard/

as well as the SIL IPA keyboards that can be installed at the OS level. So to my mind the issue of how to get Unicode-encoded IPA symbols into questions and answers seems to be adequately addressed.

What is inadequate, to my mind, is the typography of IPA characters on the site. It was suggested here that IPA be rendered using the existing code formatting mechanism (surrounding all IPA text with backticks), and instinctively that is what I had been doing anyway, even before seeing that suggestion. It works well for isolated glyphs, but is pretty terrible even for the most common diacritics. For example: ã (nasalization), a̰ (creaky phonation), ḁ (devoicing), a̤ (breathy phonation), t̪ (dental). It's even worse when you try to use multiple diacritics, e.g.ː n̠̥ (retracted + devoiced).

I think this issue can be solved by changing the style sheet for Linguistics SE, so that either:

1. text enclosed in backticks is rendered with the Doulos SIL webfont or a similarly capable typeface, or
2. text not enclosed in backticks is rendered with the Charis SIL webfont (Charis because it has bold, italic, and bold+italic faces, so it can handle the markdown formatting).

If option 2 is chosen, then obviously the convention would be to not use backticks for IPA text, in which case it could optionally be delimited in the usual ways (i.e., [square brackets] for phonetic transcriptions, /slash brackets/ for phonemic transcriptions, <angle brackets> for explicit reference to a glyph and/or its orthographic use).

---

EDIT

Here is a screenshot of what I see on Firefox 37.0.1 on Linux:

Here's a second screenshot of diacritics in one of the comments (with a little shading added to make more clear the relevant parts):

Presumably that devoicing ring is supposed to be on the final a, not on the e in "etc".

Answer 1

I too browse from Linux, with both, Firefox and Chrome. My own rendering is not as bad as it is for you. Only the last two, t̪ n̠̥, are rendered wrongly for me.

To the right, you see a snapshot of the CSS for code.

When I modify the CSS options manually, to use my own computer's default monospace font, it gets better.

I am against the idea of using anything but monospace fonts for our code sections, because we sometimes need monospace text. Monospace text is not only useful for typing code and pseudocode, it is also useful for preformatted text.

Alternatively, I propose:

1. The admins should change the preferred fonts for code. I tested with Ubuntu Mono, Roboto Slab, and DejaVu Sans Mono, and it looks fine with each.
2. If the above change is not feasible for some reason, users should stop using code for IPA. So, just write it as [ãa̰ḁa̤t̪n̠̥], [ãa̰ḁa̤t̪n̠̥], /ãa̰ḁa̤t̪n̠̥/, or /ãa̰ḁa̤t̪n̠̥/ and let the existing selections for body handle its rendering.

Answer 2

You shouldn't be using the backticks for IPA transcriptions. They're not code. They shouldn't be written in monospaced type. Linguistics papers don't present IPA transcriptions in a different font. They present them in slashes (//) or brackets ([]). Now there could still be a font problem with those, but I haven't seen one before.

Answer 3

Aha. I hate to point fingers... I sort of recognize the problem. Here is my screen capture of your original examples:

It's an interaction between font and software, on user's system. Some fonts provide spacing metrics for combining characters "correctly", and some do not (i.e. Open Type vs. True Type). But the software also needs to be up to speed. So for example Word 2003 handles OTF fonts almost correctly, and Powerpoint 2003 does not (I guess Powerpoint is generally one generation behind Word). I've had similar problems where Word 2010 documents appear to me (using W 2003) as "Vietnamese" and combining characters -- in some fonts -- were totally wrong (combining grave was ì and combining acute was Í or vice versa), but the same file in Open Office same era came out correct. The general rule is: apparently nobody understands how to deal with combining characters.

I don't have a "practical" solution for you, other than experiment with changing everything you can imagine, like browsers and fonts. Or maybe there's a system-level compu tweek that's way above my pay-grade. I actually think this would be worth reproducing on Stackexchange meta, because this place is full of compu wizards.