How to Inspect CSS font-feature-settings JIS04 Half-Width Forms in Safari Web Inspector

Modern Japanese dense tables, financial reports, and compact mobile sidebars frequently combine JIS2004 kanji standards with half-width (0.5em) alphanumeric and kana metrics. The OpenType jp04 feature tag paired with hwid (Half-Width Alternates) allows web designers to format modern kanji while compressing punctuation and numbers into disciplined half-width em-boxes. Safari Web Inspector provides native typographic tools to preview and audit JIS04 half-width typography on macOS.

Typographical Role of JIS04 Half-Width Forms

In structured tabular layouts, standard full-width alphanumeric glyphs take up excessive horizontal space. Combining JIS2004 kanji with half-width characters preserves modern stroke accuracy while optimizing spatial density. Specifying font-feature-settings: "jp04" 1, "hwid" 1; activates Apple’s CoreText substitution routines without altering underlying text strings.

Configuring JIS04 Half-Width Forms in CSS

Implement JIS04 half-width typography in your stylesheet:

.compact-financial-table {
  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  font-feature-settings: "jp04" 1, "hwid" 1;
  font-variant-east-asian: jis04 half-width;
  line-height: 1.6;
}

Inspecting Features in Safari Web Inspector

1. Open the webpage containing modern Japanese typography in Safari.
2. Right-click the target table cell and choose Inspect Element.
3. Switch to the Font tab in Web Inspector’s right pane.
4. Locate JIS2004 Forms (jp04) and Half-Width Alternates (hwid) under the Features list.
5. Toggle the switches to observe live glyph compression and stroke alterations rendered by CoreText across the character sequence.

Accessible Semantic Text Integrity

Because OpenType substitutions operate exclusively at the graphic layout layer, the accessibility tree retains standard semantic text representation, ensuring optimal search indexing and screen reader performance.