See snailplane's link in the comments: How to find alternative writings of a kanji in electronic form?. There's nothing at all wrong with the encoding -- what you're observing is purely a font issue in how the browser (or other app) renders the character encoded in the source HTML.
This is vaguely similar to how the same "letter" in English might have different glyphs (i.e. specific symbol shapes). Compare a and ɑ (lower-case A with a hook on top, or just rounded), or g and ɡ (lower-case G with a double loop, or just a single loop and a hook on bottom). In my example letters here, I've used different Unicode characters (U+0061
and U+0251
for the A variants, and U+0067
and U+0261
for the G variants), and depending on your browser and font settings, the browser might render different Unicode codepoints the same way (both A variants might appear the same, and/or both G variants might appear the same).
For the Japanese character 直, you're running into a different but related issue, where a single Unicode codepoint (U+76F4
) might be rendered in multiple different ways depending on browser and font setup.
Technically speaking, the version with three joined boxes under a cross and the extra line on the left border is the Japanese simplified version (新字体 or shinjitai), while the version with four joined boxes under a cross and a long bottom line is the Chinese version. It is possible that your browser is guessing the language of the individual character and choosing a different font based on that. Either way, to fluent readers of Chinese and Japanese, both glyphs (specific symbol shapes) are recognizable as indicating the same thing and they could be considered the same character, same as the different A shapes or G shapes.
See the Shinjitai article on Wikipedia and the 直 entry on Wiktionary for more detail.