Text flow – when to say “no”?

What do you folks use as a general rule of thumb for flowing text around embedded images? I know everyone’s got different preferences in addition to standard rules; is there any time when you will place an image in line with text (i.e., with no text flow on either side) instead of allowing text to flow on one side or the other?

Obviously there are times when you’re going to want the image apart from the text flow for design purposes. The examples I’ve run into recently involve laying out HTML newsletters (which are fairly narrow – less than 600 px so they fit into the crappy little window Outlook gives you, and then it’s split further into a 2/3 + 1/3 vertical arrangement) and a brochure laid out with similar narrow vertical columns. With a vertical area this narrow it’s sometimes difficult to get recognizable images (none are larger than 250 px wide) and text without it looking like you’re getting “crumbs” of text.

Addendum: I know there are, in fact, times when you’d want the opposite – if I were laying out one of E.E. Cummings’ poems alongside a series of images, for instance, I would probably have zero issues with fragments of text alongside images since that could create a different flow / feel. This question doesn’t have to do with that – I’m looking for other folks’ preferences with more vanilla layout – magazine layouts with large images, web pages with narrow columns, etc.

Answer

The choice depends on the context, although I can’t think of a situation where putting an image strictly inline (where the height of the image controls the leading of the line) looks satisfactory.

If the image is very detailed and it’s important to show it in all its glory, then you should make it full width and break the text at a paragraph with the image and caption following.

enter image description here

Where the image is not full width, the judgment call comes in how much text will sit beside it, and whether the text is justified. Less than about 30 to 35 characters generally looks awful justified, especially in HTML where the only justification option is word spacing, which tends to leave gigantic gaps (you can see lots of examples in newspaper columns)…

enter image description here

…but can look okay if it’s ragged right.

enter image description here

Attribution
Source : Link , Question Author : lawndartcatcher , Answer Author : Alan Gilbertson

Leave a Comment