clock menu more-arrow no yes mobile

Filed under:

How To Post Awesome Images In Comment Threads

There's been a whole lot of really big images popping up in threads lately. Let's size them down!

This guy was excited to learn how to resize pictures
This guy was excited to learn how to resize pictures
James Lang-US PRESSWIRE

Everybody loves images and gifs.  I love them, you love them, your friends all love them, and when done properly adding an image or a gif to a comment thread is a nice little splash of hot sauce on the scrambled eggs that are most comment threads.  In short, they're cool.

But!  There's been a preponderance lately of really, really large images making their way to threads, and this causes problems.  It's less of a problem on the desktop than it used to be, thanks to collapsible images, but massive images on mobile phones are somewhat of a nightmare to load, not to mention to scroll through, so this is your periodic reminder to please, please, please, scale down your images.

Another, and an arguably bigger, reason to limit image sizes is that large images are big data hits - which severely impacts people with mobile connections who don't have unlimited data plans.

BUT DAMMIT, THOUGHT POLICE, you're saying, I WANT TO BE ABLE TO POST MY PICTURE WHY DO YOU DO THIS JUST LET ME DO MY THING.

Hold on.  Nobody's saying you can't post your picture.  We like pictures.  For instance, I can't read, so I depend on the pictures to tell me what's going on in any given thread.  All I want to do is educate you on how to properly size down your image so it can be enjoyed by everyone without loading/scrolling grief or huge hits to data plans.

HOW TO POST AN AWESOME PICTURE EVERY TIME:

1.  In a comment, put your cursor where you want the image to be.
2. Copy the URL of the picture you want to use.
3. Click the little blue window next to the link icon at the right edge of the row of icons above the comment box.
4. Paste the URL into the box that appears and click OK.
5. The resulting URL will look something like this:

< img src="http://unconfirmedbreakingnews.com/wp-content/uploads/2010/12/BullwinkleRocky.jpg" / >

HERE'S THE IMPORTANT BIT!

6. In between the word img and the word src of the URL in the comment, put in the words height="300", thusly:

< img height="300" src="http://unconfirmedbreakingnews.com/wp-content/uploads/2010/12/BullwinkleRocky.jpg" / >

(note that in the actual code as pasted there will be no space between the < and the img and the / and the >)

That will limit your picture to 300 pixels in height, which is about as big as any picture really needs to be.  If you must make your picture bigger, might I suggest using a textual link to the image you want to show, which by now, being the savvy SBN'ers you all are, you all know how to do, right? If not, here's how!

When you do a link, it looks like this:

< a href="http://4.bp.blogspot.com/-fQbf9GK2WxE/UlFGO8QldiI/AAAAAAAAAMg/rXgvNo-this/s1600/lets+do+this.gif">your link

To force that link to open in a new tab, put target=new at the end of the link and prior to the end bracket, like this:

< a href="http://4.bp.blogspot.com/-fQbf9GK2WxE/UlFGO8QldiI/AAAAAAAAAMg/rXgvNo-this/s1600/lets+do+this.gif"TARGET=NEW>your link

It doesn't have to be in caps, I just did that for highlighting.

Bookmark this post and refer to it when you want to paste an image, and everyone's phone/tablet (and phone bill) will be much happier!