Depending on your blog’s topic, post images can encourage reading. But where do we place those images? On the left or the right?
A common response to this is to place the content on the left, because Westerners read from left to right. That is true, and it does play a role in the decision, but not always in the way you would expect.
The Left Logic
Images work because they draw attention. The visual interest draw the user’s eye towards the picture, and hence the post. However, once the eye has been drawn, where does it go from there?
Assuming the image had the desired effect, the reader will now be looking to read the article. Those of us in the Western world read from left to right, so it follows that the most natural direction to scan is to the right of the image.
Beyond that, placing text to the right of the image means that the distance from the image to where the reader can start reading is shorter than if the text had been on the left. I would say that this factor is even more important than the preceding one.
The left aligned image makes reading on from the picture to the article easier on the eye.
The Not-Always-Left Logic
User eye movements are not the only factor in decided where to place your images. Your blog’s design will often play a vital role as well.
For instance, here on Pro Blog Design we use short post excerpts on the home page. Images take up a large proportion of those excerpts and if I placed all of the images on one side, I would end up with a column of images dominating my home page. To negate this, I alternate between one-left and one-right image (And no, the irony of this post being one of the righties wasn’t lost on me!).
Where do you place the images on your blog? What makes you do things that way?
Custom Search
Slevi (73 comments)10 October 07
Usually the right, although every now and then there’s a picture on the left as well. I don’t really use any logic to it, just end up picking which I think looks nice.
Macrike (3 comments)10 October 07
If it’s a big image like a screenshot or a something, I usually but it in the middle, with the max width. But if it’s a large vertical image or a small one, I normally stick it to the right.
I try to put it on the left but it just doesn’t look correct to me. :S
milo (72 comments)10 October 07
With the first letter element it’s possible to vary and balance the image placement, however it’s not the perfect solution if using a narrow post area, but it works perfect with an elastic layout.
Jonathan Franzone (4 comments)10 October 07
I used to place them on the right exclusively thinking that it would just be a nice decoration, but out of the way of the content. I never really thought about it drawing the eye towards the content.
Now when I do place a post image… well it just depends on my mood.
TechZilo (8 comments)10 October 07
Don’t you think it looks a bit awkward on your index? You have short excerpts, and they are crowded along with some images which have no borders or anything else to demarcate it. Not critique – I experience this problem myself, and the only solution is smaller images, or no images
redwall_hp (134 comments)10 October 07
My images are always on the right on Webmaster-Source, because I’m applying the left-to-right logic to AdSense placement.
Steven Bradley (7 comments)10 October 07
Michael I think in general if you’re placing an image at the top of a post the left side is better for the reasons you mention. However further down the page I think having an image on the right side works well, because it pulls your eye through the content. I think it helps someone who starts reading to continue further down the page.
A balance is good to avoid the image column that could result, though at times a column if images might be the a desired effect.
One other consideration I look to is the image itself. A face looking left will probably work best on the right. Your eye will more likely follow the cues from the face in the image. Since it looks left so do you. Placing that image on the left hand side leads to people looking outside your post, which may not be what you want.
Marco Ruelicke.net (43 comments)10 October 07
Where I place the image depends on the content. Most of the time I do place it on the left side though.
Also, if it is an image inside the text flow, I usually alternate the side to lighten up the text and make it easier to read.
I believe the best method of placing the images is to go by look and feel as Slevi mentioned already. It may not be logic, but usually you get the best results for your style of writing articles
Brian Purkiss (24 comments)11 October 07
I never really thought about that…
But it makes perfect sense!
Thanks for the post!
I often have images 500px wide that span the entire post width (like here or here).
But when I have small images, I put them on the left side of my post (like here).
I haven’t made up my mind on my favorite way yet…
Ballance is the key though.
adam (18 comments)11 October 07
i disagree. an opening image, especially if it’s not directly related to the post, because people don’t “read” them. they get a quick glance, but they’re not part of the reading flow of the article.
i generally only post an image on the left if understanding the post relies on having seen the image. otherwise, the image goes on the right, and only serves as a visual anchor.
Deron Sizemore (34 comments)11 October 07
I definitely agree with your points. I position my images on the left and if I have a larger image I just position it in the middle at the top taking up the full width.
kristarella (141 comments)11 October 07
Oh no! My browser sent a bad request
Anywho, what I said was that image with the arrows really illustrates what you’re saying about drawing your eyes – it would probably only work well with a certain sized image (couldn’t be too big?).
I too alternate my images so that the front page looks balanced. I think that’s fine a=on a well designed page – if you have enough white space etc then the readers eyes will be able to take in the page as a whole and read the things that look interesting. Where as a busy page will need to be scanned more thoroughly (probably left to right).
Steven makes a good point about pulling eyes through an article. *thumbs up*
WarriorBlog (5 comments)11 October 07
Should Adsense go on the left too? What about putting images in the middle?
I do agree with you here but I think it could also go in the middle if your image is big and it depend on your design I guess.
Pinyo (5 comments)11 October 07
I have the photo after the first paragraph, because I want it to be bigger.
I see your point about having it on the left, but I don’t like it because it sometimes make bullets look weird.
pablopabla (50 comments)11 October 07
I style it the way you do. Sometimes, however, I place it in the middle between paragraphs or above the post especially if it is a chart or something. It also gives variety to the regular readers.
kristarella (141 comments)11 October 07
pablopabla – variety is the spice of life!
Also if you’re demonstrating something with a chart, for example, it makes sense to put it near the explanation. If that’s in the middle of the post (like in this post) then that’s fine.
Ken Dahlin (3 comments)11 October 07
I always almost always position a photo to the left as a small teaser and perhaps have another larger image shortly after the introduction. This is nothing I’ve ever really sat down and thought about, it just seemed to look good to me. Thanks for having me think about it my analytically.
Bill (3 comments)11 October 07
I believe the left side is also good for the images b/c once a browser is opened it opens so that the top-left content is visible to the human eye even if it’s not maximized. This way the user/reader sees the image placed on the left first instead of the one placed on the right. I hope this wasn’t too confusing.
goldfries (81 comments)11 October 07
If it was the first paragraph, I’d put it on the right.
If it was any other paragraph, I’d put it on either side.
If the images are pretty close (within a screen perhaps?) then I would alternate sides. Stick to 1 side seems so…….. patterned.
Sorry, that’s the only word I could think of.
pelf (32 comments)11 October 07
I don’t usually pay much attention to the image on a post, especially if the image was taken from one of those free stock image libraries. Hence it doesn’t matter whether the image is on the right or left.
But I do, however, pay more attention to images of the blogger doing something, especially when the post is is about that “something”.
Slevi (73 comments)11 October 07
“I believe the left side is also good for the images b/c once a browser is opened it opens so that the top-left content is visible to the human eye even if it’s not maximized. This way the user/reader sees the image placed on the left first instead of the one placed on the right. I hope this wasn’t too confusing.”
.
Do some people really have their browsers so small that the actual content of sites is cut off? I know not everybody uses it maximized but minimizing it that far
If it is done though this upside of placing an image there as first thing to be seen might also be the downside, since what if the image isn’t appealing enough? Will they even bother to increase the size of their browser?
sarahG (15 comments)11 October 07
I put my images to the left. Simple reason, because the text then lines up beside it. Unless you’re using justified text, the text is jagged next to the image if it’s on the right which I think looks messy. For some reason the text being jagged on the right of a paragraph, without an image, isn’t an issue as it’s more natural, but I prefer it to look neat around a photo, so it goes on the left!
kristarella (141 comments)11 October 07
That’s an interesting take on it sarahG – looks like you do have things justified though
I like your layout a lot! Nicely gridded (for lack of a better description), pleasing to look at.
Starfeeder (13 comments)11 October 07
Great post
never thought it of that way, I love to use lots of imagery in my posts when I can.
sarahG (15 comments)11 October 07
kristarella, I’ll admit I prefer justified text too, I didn’t realise I had it on my blog though! Shows how much attention I pay to it
Unfortunately I can’t take credit for my layout as it’s a free theme. I’m not a designer and haven’t a hope of doing anything decent! 
Slevi (73 comments)11 October 07
Images on the right do look better with justified text, but unfortunately justified text on itself has some flaws with double spacing or even more appearing within the sentences. That’s something which especially if long words are used can end up making the lines look quite messy again
.
goldfries (81 comments)11 October 07
I prefer justified text though. I rather have larger space than jagged left and right margins.
redwall_hp the webmaster resource king (3 comments)11 October 07
Bleh. I can’t stand justified text. The irregular spacing makes it harder to read.
Goldfries, I alternate image alignment if I have more than one image in a single post as well. I always start on the right, though, because of my AdSense block.
Madhur Kapoor (12 comments)11 October 07
Basically i dont place any text around the images so i place them in the center .
kristarella (141 comments)11 October 07
Darn it! I just got that “400 Bad Request” thing again and lost my comment. Anyone else had that or is it somehow my fault?
What I said was something like: obviously justified text is a personal preference. Unless the post space is quite small, uneven spacing is generally at a minimum.
I see the jagged edges as much of a “flaw” in some layouts.
Slevi (73 comments)11 October 07
They’re both flaws, definitely true. Which is more annoying is completely a personal preference, it’s to be hoped that one day with either the help of CSS or just browsers themselves the justification can be worked out more seamlessly even if bigger words within a certain sentence are used.
As for the 400 bad request errors no issue here, although sometimes I do get ending up with a white screen after commenting from wp-comments.php, but I have that on my own blog too. So unless me and PBD are both hosted by the same host (lunarpages in my case) I don’t think that’s a server related matter.
Ryan (7 comments)11 October 07
Yup. Great post. This idea dates back to the days of single page newsletters where users are simply more used to looking to the left for points of interest and to the right for any type of navigation (back then it was more of a table of contents or index)
Armen (9 comments)12 October 07
That’s really strange. I’ve always thought images looked better on the right. Plus, images on the left actually make it more awkward to the read the text because the beginning of the sentance is half way across the page, rather than at the beginning, if you catch my drift.
Definately food for thought though. Thanks!
redwall_hp (134 comments)12 October 07
Armen has a great point. I’ve thought that myself in the past.
Michael Martin (1285 comments)12 October 07
I’m really starting to fall behind on this commenting business! Ready for another beast of a reply everyone??
Slevi – Fair enough. If it feels right, it often is.
Macrike – I center large images as well, but why do you feel the left isn’t right usually?
milo – I’m a little lost there. Do you mean for formatting the post itself?
Jonathan – If it’s just a decoration, and you wanted it out of the way, is it worth having at all? The images do help out your posts.
Techzilo – Sometimes, yep! I started out with images 234px wide, and quickly went down to 216px. Lately I’ve been wondering if another drop would be worthwhile…
Redwall – Sounds good. Sorry to throw a spanner in the works, but have you ever tried it the other way around? If the image draws the attention, then they read the first line to the right, then read straight onto the ads? It’s just a theory, but you could trial it.
Steven – That’s very true. I only looked at the opening images in this article, your reasoning makes a lot of sense for deeper images. And great point about the image itself. Some images will just “feel” right in certain locations, like others have mentioned.
Marco – Yep, it’s certainly worth giving special considering to various other aspects of the post formatting.
Brian – Glad ya liked it. I think they look good on the left in your blog in particular because of the strong right sidebar. Adds a little more balance.
Adam – But can’t the image sell them on the article in the first place though? (Check out the link at the start of the post for the discussion on that. Would love to hear your thoughts on it.
)
Deron – I center large images as well. They’re too big to squeeze content down the sides of them.
Kristarella – Yikes. I’ve lost a fair few comments that way as well! On my long ones, I now copy everything before submitting. Just incase.
Warrior – I’m not sure about adsense. I haven’t tested it, but I don’t think it would be much better on either side. The text ads don’t really draw the eye in the way that an image does, making this logic less applicable. Placing the ad on the right makes sense to me because the reader would read along the article and straight into the ad (wheras if the ad is on the left, they could just skip it and go straight to the content). Good question!
Centered images are grand though (Provided they’re quite wide).
Pinyo – That’s true – I sometimes have trouble with bullets and images as well.
pablopabla – I like that variety as well.
Ken – Thanks for the comment. Good to hear someone who naturally put them on the left (Most of the comments so far have been righties!
)
Bill – That’s very true. Sort of like how you should place content in the left-most column.
goldfries – Alternating is good, but is there any particular reason why you add the image to the right usually?
pelf – As you said, the images aren’t all that useful to the reader if they’re not related (Something I know I’ve been guilty of a few times!)
Sarah – That’s a very good point. I’d forgotten about that!
Starfeeder – Considering your blog’s topic, I imagine there are some very nice images to be used!
Madhur – lol – So the decision wasn’t too hard for you then?
Kristarella (again) – Twice now? No-one else has mentioned it at least. Is it happening to you on other blogs as well?
Ryan – I imagine that would apply to some people, but with the popularity of the web nowadays, not everyone will have read that sort of newsletter back in the day.
Armen – That’s true, but the cincher is, where does your eye start from on the page? If it starts scanning at the far left, then you could well be right. But what if it starts at the image?
As for the whole text discussion; I tend to like left aligned text. The spacing in justified text tends to put me off, and you run into really problematic lines every now and again (And on the web, the only way to fix it easily is to re-word).
PS – 758 words. Some day I’ll write a 1000 word comment. Can’t wait.
goldfries (81 comments)12 October 07
goldfries – Alternating is good, but is there any particular reason why you add the image to the right usually?
I want the content to the primary focus, the picture is just secondary.
The starting point of each line is always on the left. Adding a picture to it would shift a bunch of lines quite far from the left margin.
After the text finishes the height of the picture, it goes back to the left again.
So basically, I’m giving my readers the same starting point for each line of text. The pictures just accompany the lengthy text, just to make the page more vibrant and the chosen picture would be related to the paragraph.
Michael Martin (1285 comments)12 October 07
It’s true that there tend to be less text-wrapping problems with right-aligned images, but are your images only for decoration?
In some cases they are, no doubt. But images can draw attention and could well encourage more people to read your article, but for that to be true, then the pics have to be the first impression, with the content being second (Even if the content is more important in the long run).
If your images are acting as attention pullers like that, then I’d still say that left aligning is easier for your visitors usually (Provided you don’t mess up the post formatting, as you’ve said).
kristarella (141 comments)13 October 07
Sorry Michael, but it’s never happened anywhere else.
redwall_hp (134 comments)13 October 07
No I haven’t thought of that (“the image draws the attention, then they read the first line to the right, then read straight onto the ads?”). It would be hard to do that though. The images in the posts are floated to the right, while the post template contains the ad, which is floated to the left. It’s not easy to change the ad/image positioning now.
Though I’ve thought about trying-out a 468×80 ad between the post title and the post instead. Then I could alternate images like you do.
Michael Martin (1285 comments)13 October 07
Kristarella – Hmm… If it keeps up, I’ll look into it. I mean, nothing has changed lately. Perhaps the server was having a little hitch that day? Sorry again.
Redwall – Seems there are a few possibilities. With advertising, I think the recommendation is usually to experiment. At the very least, it will freshen up your ad layout for a bit, even if you go back to the original in the end?
ses5909 (8 comments)14 October 07
For me it depends on the post I’m making. If the picture is simply a small accent, I will usually align it to the right. If I want it to grab attention, I will post it on the left. Nice question Michael!
Michael Martin (1285 comments)14 October 07
Ses – That seems a good system.
goldfries (81 comments)14 October 07
Yes, the pictures in my article has always been for decoration.
The thumbnails in game review on the other hand, occupy the whole row. (refer to my game reviews)
Screenshot / Illustrations will take up the bulk of the area. (refer to my wp plugin post)
Charlene Hendricks (1 comments)13 November 08
wdwlbxkhn4yurc20
Web Host Right (16 comments)20 August 09
I place my images on the left, i tend to use little 150 x 150 images and like the text wrapping around them, as long as theres enough text to justify using an image within the post.
Genry (1 comments)23 September 09
I really like, thanks!
hostpapa review (1 comments)29 October 09
yes i agree. there’s a research said that reading route, or heat area on the web page similar with alphabet ‘F’. people usually with start reading from left to right, then goes to next line, afterward go straight away down.
just my thought
technically, everything left approached works well.