Ruby (furigana) i html

Eftersom jag både bygger sajter som hobby är språknörd, så blev jag glatt överraskad när jag härom dagen upptäckte att det finns en html-notation i HTML5 för att skriva ruby. Dessutom redan med bra stöd i nya webbläsare.

Ruby är vad typografer kallar de små tecken som används på exempelvis japanska (där kallas de furigana) för att tala om hur tecken ska uttalas, när det inte är uppenbart. Furigana, och motsvarigheterna på kinesiska och andra språk, skrivs med små tecken ovanför huvudtexten (i horisontell skrift) eller till höger om den (i vertikal skrift).

Uppslag ur en japansk bok, med ruby (furigana) på många ord. Heibon av Futabatei Shimei, 1908.

Jag kunde inte låta bli att märka upp japanska översättningar av råvarunamn på Säsongsmat med ruby, bara för att det går.

Syntaxen för ruby i HTML5, som förslaget ser ut nu, är rätt omständlig: För att skriva hakusai (Pak choi) med både kanji och furigana skull koden kunna se ut så här:
<ruby><rb>白</rb><rp>(</rp><rt>ハク</rt><rp>)</rp><rb>菜</rb><rp>(</rp><rt>サイ</rt><rp>)</rp></ruby>

…vilket ger följande resultat:

(ハク)(サイ)

Har du en hyfsat modern webbläsare bör kanjin (de kinesiska tecknen 白菜) ha kompletterats med furigana, en liten rad som anger uttalet ovanför. Här står det ハクサイ, hakusai, med den japanska stavelseskriften katakana. (Just här skulle man nog normalt sett bara ha använt katakana.) I en del versioner av android-webbläsaren verkar det som att ruby-tecknen alltid hamnar till höger, som i vertikal skrift, vilket kan se lite konstigt ut. Om du har en äldre webbläsare, utan stöd för ruby, så bör du se kanjitecknen följda av katakana inom parentes.

Grundprincipen är enkel: Hela uttrycket omsluts med ruby.taggar, sedan sätt huvudtecknet inom rb-taggar och rubyn inom rt-taggar. <ruby><rb>白</rb><rt>ハク</rt></ruby> Dessutom finns en rp-tagg för att kunna stoppa in parenteser (eller egentligen vad som helst), för att få ett snyggt och begripligt resultat även i de webbläsare som inte förstår ruby-taggarna. Sådana webbläsare ignorerar bara taggarna, och skriver ut tecknen emellan som de står.