12

The insert image button works like this:

[![enter image description here][1]][1]

  [1]: https://i.stack.imgur.com/zVL6w.png

Display:

enter image description here

But this shorter code does the same thing (I couldn't spot a difference):

![enter image description here][1]

  [1]: https://i.stack.imgur.com/zVL6w.png

Display:

enter image description here


Is there any difference between the two ways?

The second way is shorter in text and indirectly saves some storage of this website. So why isn't it the default way of inserting images?

While editing such posts, I hardly see someone who puts image description. In such cases, this one works too:

![][1]
13

In addition to being able to click on the upper link to open the image, which is not possible with the lower one, it is also possible to edit the upper link to display a thumbnail for larger images, thus:

[![enter image description here][2]][1]


  [1]: https://i.stack.imgur.com/S77Ux.png
  [2]: https://i.stack.imgur.com/S77Uxt.png

which renders as:

enter image description here

(Click the thumbnail for the original)


Other options for thumbnails can be found on the Imgur API page

| improve this answer | |
10

What Journeyman Geek says is correct. One situation where this matters in particular is large images:

  • A picture is automatically resized horizontally if it's too wide. If it would be desirable to see more details, you can use the [![enter image description here][1]][1] syntax and add a legend 'click the image to see more details'.

  • A picture is not automatically resized vertically. To prevent images (hosted on imgur) from taking too much space, you can add a size modifier before the extension, e.g. /zVL6w.png becomes /zVL6wm.png. You can easily modify the automatically inserted text to something like

    [![enter image description here][1]][1a]
    
    [1]: https://i.stack.imgur.com/zVL6wm.png
    [1a]: https://i.stack.imgur.com/zVL6w.png
    

    (depending on the image, the l modifier might be better)

| improve this answer | |
8

You can click on the one on top and open the image, not the one at the bottom.

In some cases, the former may be more desirable.

| improve this answer | |
  • Oh, I see. That works. But if I can see the image here, why should I click it to open the same thing again? – Ardent Coder May 19 at 13:02
  • 1
    @ArdentCoder Sometimes opening the image makes it bigger, certainly so if you use the imgur modifiers. – TheLethalCarrot May 19 at 13:11
  • @ArdentCoder it's in order to let you link to a bigger image, or link to another page. – Shadow Wizard Wearing Mask May 19 at 13:16
  • @ShadowKeepsSocialDistance That sounds interesting, how can I use the same link to image and another page? Ah, I get it. Sempai's answer made it clear. – Ardent Coder May 19 at 13:22
  • 1
    @ArdentCoder indeed. It's kind of a "template" that the user need to fill with data, but only optional. Think it came in response to a feature request at some point in the past, not sure. Will try to check. Edit: found it. :) – Shadow Wizard Wearing Mask May 19 at 14:32
4

There is a third (and fourth) way of adding images where you don't use a number reference.

Third way:

![enter image description here](https://i.stack.imgur.com/zVL6w.png)

enter image description here

Fourth way (with click target):

[![enter image description here](https://i.stack.imgur.com/zVL6w.png)](https://i.stack.imgur.com/zVL6w.png)

enter image description here

Additional note

Just wanted to make a note about this part of your post:

While editing such posts, I hardly see someone who puts image description. In such cases, this one works too:

![][1]

While it works, I try to make it a habit of putting a descriptive text to accompany the image. This text is used for the alt attribute of the image in HTML. This is used in case the image fails to load (gets removed or blocked, etc) so people know what it was supposed to be. It is also useful to people with disabilities (blindness) as screen readers will read the alt text aloud.

| improve this answer | |

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .