Why does text on certain portions of websites, usually when adjacent text contains special characters, become jumbled into seemingly random sets of characters that are not in any way jumbled when viewing the source of the webpage? How can I fix this?
When viewing most text on most websites, it displays properly. However, there are two instances where text will either tend to, or consistently, become jumbled into a mess of seemingly random characters. Oddly enough, these seemingly random characters are not, in fact, random. The same weird character will be used to replace the same regular English text character consistently across the entire area that has been jumbled. The two instances where this tends to occur most often, or consistently in some cases, are, first, when a paragraph or particular section of formatted text contains special characters, such as Chinese or Japanese characters, or accented letters. When this happens, usually the paragraph that contains the special characters is completely jumbled, while the rest of the text on the page will have intermittent jumbling on a word or two. Most often, the word "the" is jumbled in this case. The second instance where this happens is when a website uses specially formatted text in some form or another. I, not being an expert at web development, am not sure what kind of formatting causes it, but I can provide consistent examples in lieu of my experience:
- Example 1:
Example 1 shows a portion of a screen-shot of the website "Joystiq.com". Every single article title on the front page of this blog is consistently jumbled, while the text of the article itself remains untouched. Please note that when this jumbled text is highlighted, it is visible un-jumbled in the right-click menu as well as in the source code of the page. Other consistent instances can be found within many search fields on various websites. For instance, the search bar located at the top right of "Kotaku.com" consistently displays jumbled characters both on its default text of "Search" and on any text that is typed into the search box itself.
Example 2 shows both the jumbling of the paragraph containing the character "☆" as well as the subsequent peppering of the rest of the article's text with small jumbled words. Below this is the DOM Source of the selected text which shows how the text itself is being rendered properly within the site's source. Additionally, for convenience, I have edited on to the bottom of the image a small snippet of what the search bar on the same page looks like. Notice how the grayed-out text that normally would read "Search" is instead jumbled.
This issue has been plaguing my browser for the past year or so, and I had hoped that it would go away with subsequent Firefox updates. It has not gone away.
Thank you for reading! Please help!
This issue can be caused by an old bitmap version of the Helvetica or Geneva font or (bitmap) fonts that Firefox can't display in that size. Firefox can't display some old bitmap fonts in a larger size and displays gibberish instead. You can test that by zooming out (View > Zoom > Zoom Out, Ctrl -) to make the text smaller.
Uninstall (remove) all variants of that not working font to make Firefox use another font or see if you can find a True type version that doesn't show the problem. There have also been fonts with a Chinese name reported that identify themselves as Helvetica, so check that as well.
Use this test to see if the Helvetica font is causing it (Copy & Paste the code in the location bar and press Enter):
data:text/html, Helvetica<br><font face="Helvetica" size="25">abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ</font><br> Helvetica Neue<br><font face="Helvetica Neue" size="25">abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ</font>
You should reset the network.http prefs that show user set on the about:config page.
Not all websites support http pipelining and if they do not then you can have issues with images or other problems.
I think you're spot on about the Helvetica not being supported at that certain size; the article titles on Joystiq.com corrected themselves when I zoomed out, as you suggested. However, the issue still remained on the Kotaku.com page where the whole paragraph was jumbled. No matter how much I zoom out, it's still jumbled.
Also, in terms of removing the Helvetica, would I just use the standard Windows Fonts file in the Control Panel, or is there a more specific way to affect only the fonts Firefox handles? All I see in the Windows Fonts file is "Helvetica Vanling tekst," and it is in TrueType format. Additionally, how would I go about checking to see if these Chinese-named fonts exist?
I also reset the network.http prefs set to "user set" back to "default" as you instructed, but it didn't appear to affect anything.
Thanks a lot for the help so far!
I have jumbled web page download problem - it does not appear to be the Helvetica font problem because the helvetica test ran perfectly any suggestions - what is the charachter encoding option supposed to be set to ?