Why are images of text, code and mathematical expressions discouraged?

Question

Often I see new users posting images, containing the text of the question they were intending to ask, or a part of it. This is especially true for the science and math based sites where new users don't know how to use MathJax. I tried searching through the previous questions on Meta SE, but couldn't find a Q&A thread dedicated to this. As we know, the common reasons are along the lines of "images are not text-searchable", "can't be read by screen reader applications", etc.

I know threads addressing this issue exist in some of the child metas but they're way too scattered. It would be nice to have it summarized under a single thread on the mother meta.

---

Related:

• Discouraging the use of textual screenshots in questions - Physics MSE
• Why should I not upload images of code/data/errors? - Meta Stack Overflow
• Why do people post screenshots of their terminals? - Meta Ask Ubuntu
• idownvotedbecau.se/imageofcode
• Self-delete my criticized question?
• Why image cannot be used for explaining my maths problem? - Math SE

Answer 1

Because of OP's invitation, I'm going to extract part of my answer in the from Math.Meta.SE.

More efficient (math) searching

We can easily find a bunch of questions with math expressions like "n < 2ⁿ" with the help of Approach0.

Figure 1: Logo of the math search engine Approach0
Image source: Approach0's GitHub profile

Figure 2: Approach0 search for "n < 2ⁿ" with "induction".

Figure 3: corresponding Approach0's search results

As we can see from Figure 3, the matched expressions get highlighted, notably "n < 2ⁿ". Moreover, it can also highlight "k < 2ᵏ". That's not something that usual web search engines (including the built-in one on SE) would do. This helps the community to spot out possible duplicates despite difference in the choice of variables.

Machine's interpretation of text images

The accessibility issue has been discussed in details, while others also mention the poor searchability of text images.

I'll post some examples illustrating how those pictures are read by machines.

"Google Does Not Extract Text from Images"

Figure 4: Google's misinterpretation of text image "GOOGLE"
(Image) source: Did Google Just Read the Text on My Image and Can This Affect My Rankings? by Razvan Gavrilas

If everything has been typed out, then a web search engine can interpret its content. Compare these two version of a math question in terms of SEO:

1. Original version of the main site question
2. Typed out in LaTeX by @TheSimpliFire.

Google sees an image by its alt attribute. In many questions, it's simply "enter images description", which is not descriptive. Therefore, a text image alone can hardly be useful to the search engine.

From the previous comparison, it's clear why SE moderators and staff prefer users to "type everything out".

Remarks: In general, it's advised to give descriptive alt text to a web image.

Participation on SE for persons with disabilities

As the name "Stack Exchange" suggests, this network promotes and facilitates the exchange of ideas between individuals. In the next section, you're going to see why SE's moderators are against the use of text images.

Despite Euler's blindness, he had been contributing to the math that we're now using. While standing on the shoulder's of disabled savants, should we help interested (potential) readers with disabilities in return?

Figure 5: Leonhard Euler, mathematician
Image source: Wikipedia

Answer 2

It's an accessibility issue for 2 reasons:

1. Screen readers cannot read text in pictures.

2. Text is often blurry in zoomed-in images.

I encourage you to use a screen reader and try it out. I will also provide an illustration of zoomed-in text.

When someone zooms-in on an image, here is an example of what they might see:

Zooming-in on text as part of an image:

Text zoomed-in, not an image:

To someone with a visual impairment, zooming-in on text may be the only way to read it. But if the text is an image, it may be too blurry to read. For the rest of us, it is difficult to read.

For all of us, please post your code and other text as text, not images!

Answer 3

My process for answering a code-related question often involves:

1. Copy and paste the OP's code into a sandbox on my machine.
2. Debug the code.
3. Copy and paste my code back into the answer.

If my answer helps, I assume the OP will copy and paste my code into their environment. (And hopefully modify it to serve their needs with their new-found knowledge.)

Obviously, a screenshot requires me to retype the code in step #1. It's always possible I'll make a typo and answer the wrong question. It's also irritating since the OP could have copied the code directly rather than posting a screenshot. So maybe I won't try to answer that question after all.

Answer 4

There are several reasons, as far as I am concerned:

• Images of code can be very hard to read. Especially if a person takes a picture of a screen with a phone. It can be very difficult to cipher one's way through it.

• Images of code frequently chop out bits of material. Not all terminals have a good wrap function, and even the ones that do often make it difficult to tell exactly where line ends are.

• Images are not searchable. A picture of code will never be found by others looking for similar problems unless the description is sufficient to match what a future user is searching for.

Answer 5

In addition to the other answers, I add one reason that, from my point of view, is the most important.

When answering a question, one often needs to quote a piece of text from the question or report an equation. If the piece of text or the equation are contained in a picture, the answerer needs to rewrite them completely, wasting a lot of time.

And you don't want to annoy potential helpers in this way.

Answer 6

There is a very good reason for discouraging images of text and code: they are not accessible to people with specific vision impairments.

• While it is possible to provide a text alternative (or image description), this is only intended for relatively short descriptions and not for repeating, e.g. a long code excerpt.
• Text content (in a broad sense, i.e. including formulas rendered from MathML) can be enlarged, transformed into synthetic speech and/or Braille and rendered with stylesheets that change colours and/or contrast for people with vision impairments. When raster graphics are enlarged, you eventually end up with visible pixelation.

See also Understanding Success Criterion 1.4.5: Images of Text in the W3C's Understanding WCAG 2.1, which encourages text rather than images when possible:

The intent of this Success Criterion is to encourage authors, who are using technologies which are capable of achieving their desired default visual presentation, to enable people who require a particular visual presentation of text to be able to adjust the text presentation as needed. This includes people who require the text in a particular font size, foreground and background color, font family, line spacing or alignment.

If an author can use text to achieve the same visual effect, he or she should present the information as text rather than using an image. If for any reason, the author cannot format the text to get the same effect, the effect won't be reliably presented on the commonly available user agents, or using a technology to meet this criterion would interfere with meeting other criteria such as 1.4.4, then an image of text can be used.

Source code and mathematical expressions can definitely be presented as text (if we include using MathJax in our broad definition of text), so using images of code or formulas should be discouraged.

(Of course, there is also the issue of indexing and searching, and of copying code to try things out, but my first reaction is to look at it "through accessibility eyes".)

Answer 7

In addition to other reasons offered I suggest that it is discouraged because it means people are less likely to answer since taking a picture rather than inserting the text appears rather lacking in effort.

Answer 8

I would like to add one more (perhaps minor) reason as to why images should not be used in the content of a post unless absolutely necessary.

Syndication Feeds

For those who use syndication feeds to follow a topic/question/answer/user, images are a nightmare. The images included in a post, for obvious reasons, cannot be included as text in the content-summary in the feed -- they are only included as external hyperlinks. Especially in terminal-based feed aggregators, this means that one would have to leave the feed aggregator and open a hyperlink to understand the content of the post if the image is crucial to understanding the post. Thus, if possible, it is always better to include all the necessary information in the body of the text.

Answer 9

Yes people shouldn't use image, screenshots, etc. But the fact is that people do. And sometimes when you are showing a problem in the context of the application the screenshot contains other information that just the error string would lack. So there is value to screenshots also. Maybe Google's text search in image isn't working well, from personal experience Microsoft OneNote text search in image is very helpful. Especially when someone shared a step-by-step how-to with screenshots. So let's not just blame the users and let's see the opportunity here for StackExchange / Stack Overflow to implement the OCR AI so text from images can be searched and extracted.

https://support.microsoft.com/en-us/office/search-for-notes-in-onenote-for-windows-10-01f1da59-8b41-4dc7-b060-9a220ad2ec57