Reply #12: Wrapping Text Around Images

[mrfrapp]

You can wrap text around pictures in DU by using a bit of CSS. All you need to do is embed your picture in a div tag and specify a style, in this case a float position and perhaps a margin. For example:

[div style="float: left; margin: 1em; margin-left: 0em;"]/path/to/image[/div]

I don't know if this trick works in all browsers but it certainly does in Firefox.

Web surfers rarely read entire blog posts. Instead, they scan them for relevant information then move onto another site. Therefore, your goal as a blogger should be focused on making scanning rewarding so that readers are encouraged to return day after day for more information.

My experience with this site has been that this pattern works best for reader retention and return visits:

The red areas are where you should place the main points of your blog entry. The blue areas are ideal spots for pictures, graphs or bullet points that reward the human eye for scanning the page.

The red areas are where you should place the main points of your blog entry. The blue areas are ideal spots for pictures, graphs or bullet points that reward the human eye for scanning the page.

One of the most common mistakes writers make with their blogs is that they forget that the internet is not printed with ink. Unlike paper, computer screens are a strain on the eyes. Very few people have the patience to read 1,500 words of text on a monitor, no matter how well-written or astute the essay is.

If you want a blog that will help create social change, you have to be able to get your message across first. To do this on the blogoshere, work within the limitations of the medium: Reward the reader with images, keep your posts to under 500 words and make darn sure that your main points are written within the red zones of the "Magic F".

In blogging, how you lay out your text is more important than the quality of your writing.

Make the Magic F your friend, and you will be richly rewarded.