|
Are you using images and symbol pictures? Fact is that readers will remember strong pictures more than your text desert. Sorry to all the Pulitzer Price worthy text producing bloggers out there. Images create readers attention. The standard human brain is a remarkable pattern recognition machine. Visualize your article subject and people will remember that specific content and all related information much stronger than without images. Performancing.com image posting tips, related articles and where to get free pictures… |
 |
How-To Insert Photos And Images at Performancing.com
- On performancing.com picture upload is not supported. You have to hotlink article images to another server.
- Inline styles are not supported as IMG attributes. Working image attribute: align=”right”, Not working: style=”float:right;”
- Standard is that pictures are shown non-floating at the left side. Make sure to have some breaks before and after the image to avoid messy formatting.
- When writing a blog entry at performancing.com at least this little picture symbol above the blog entry form supports basic IMG source code building. (As you see the border=”1px” attribute is not supported/filtered)
Related articles on performancing.com
- General: Search for Images
- Images: Another Problogging Ace Up Your Sleeve
- Go Easy on the Eyes: Use Images in your Posts
CSS Formatting
The following CSS declaration makes sure that inside the CSS ID ‘content’ an image tag inside a paragraph is floating nicely left of your other content.
#content p img{ float: left; border: none; margin-right: 15px; margin-bottom: 10px; }
Despite defining a CSS formatting declaration for a certain CSS ID I would recommend to have different semantic CSS Classes for article images. An ID declaration (#) is only allowed once per page!
Instead I would use the CSS classes “.article-image-left” and “.article-image-right” to have two classes for pictures floating right or left in the text. Sometimes an “.article-image-top” for the top picture is useful.
Example: Four pictures floating around on a small space. The big one to the right is the standard image position. The two small ones just float left one after another at the top of the article text and the small photo below is above the sub-headline. The last one would need some fine tuning but I didn’t bother 🙂
The easiest workaround if you want one image to float left instead of floating right is to have a single style declaration for the single picture which will override the standard CSS stylesheet rule:
Always think ahead and define a set of appropriate classes for all your content elements!
Where to get free pictures for your blog
|
Let there be light… |
Some sources are mentioned in the related articles above but beside the ‘almighty’ image search with the search engines I would recommend the following lists:
And of course a search on specialized photo community sites will help to find the right article images.
|
Bonus: Valuable discussion about ‘hotlinking’ pictures
Don’t miss the comment thread here: Is Hotlinking a Copyright Violation?
4 thoughts on “Splicing Images In Your Readers Head”
Follow-Up: 110 sources for free photos (Link tip)
> “that light gray line”
It’s a CSS table formatting ‘bug’. You can see it twice because I used two tables to place the pictures as I like it
Nice resource post. Thanks.
By the way, how did you create that light gray line that goes across the beginning of your post?
I knew the link to ‘text desert’ would be added 🙂
@All: Go there and check out that classy example for using a great article picture!
Comments are closed.