Display formatting symbols (invisible characters) on webpages and text forms

spellcheckspellingtext-editorweb appweb-browser

I am using various online tools for translation and proofreading, and I find that it would be very interesting to be able to display the most common formatting symbols in a browser.

enter image description here

(Spaces and non-breakable spaces are be very different and important, as is being able to count line breaks at a glance for example).

I believe that since they are encoded by different HTML codes, there should be a way to display them within a webpage, but couldn't find any way to do this no matter what browser I looked into.

Here's what the difference looks like in the HTML between non-breakable space and regular space:

jusqu'à 19 heures

It seems that it would be so simple to program it into an app or as an add-on (replace regular space with the regular space symbol, replace   with non-breakable space symbol, etc), that I can't understand how there's almost nothing about such a feature online.

Best Answer

I don't know of any browsers that will show invisibles, but there are work-arounds. Since you are already "using various online tools for translation and proofreading," I assume you are also copy and pasting between the tools. The easiest solution would to just paste the text into a different text editor as an intermediate step. This should reveal tabs vs. spaces, and different types of line endings.

This will not show the difference between non-breaking spaces and spaces, though. You could view the source and search for " " but that will be hit or miss, because people aren't consistent.