In my last post you learned how to put a picture into a post. But there’s a lot more to pictures than you think, how they are positioned, creating padding around them, making them readable for the search engines – even understanding how to prepare your pictures beforehand.
When I started working for my boss and her newsletter provider, I was astounded how her staff struggled to prepare the pictures so they were suitable to be inserted. Her newsletter system was very particular, and could only cope with jpegs that were below 30MB, and the software available to use was Paint, which didn’t even work on my computer!
It took me a while to persuade my boss to buy Photoshop Elements, but once purchased, transforming pictures became a doddle. I taught my colleagues about dots per square inch, and that 72dpi is the most suitable for the web. I showed them how to crop a picture to show the best subject matter, how to reduce it in size without distortion, and how to to save it within the required size-frame. I even showed them how to collect images from different sources and convert them into jpegs so they could be used appropriately.
Suddenly the newsletters started to brighten up, look more interesting and attract more attention. And the same can be for your blog.
Click on your newly inserted picture, and you’ll get these icons:
It’s obvious that the red circle on the right means delete, but if you want to edit your picture, click on the left icon and you’ll get this menu:
Here you can change the alignment of your picture, whether it is placed left, right or centre within the page (from where you place your cursor) and the text will be automatically wrapped around it. (If this doesn’t work, which might be the case in some WordPress.org blogs, then you’ll need to add in a caption because then the image will be placed in a caption box which the text can wrap around.) If you don’t need to worry about your picture’s alignment, leave it as ‘None’.
I explained about alternative text in my previous email: alt tags describe the pictures for the benefit of the search engines who can’t read images, so use appropriate and relevant keywords, and for blind people whose computers read the alt tags.
Below that you can see the picture’s special URL, which will link to the picture’s allocated page within your blog. But you can edit that field to any other URL destination, internal or external to your blog, or to your email by typing ‘mailto:’ immediately before your email address.
If you’re happy with these changes, click on ‘Update’.
However, there is an ‘Advanced Settings’ tab at the top:
Here you can change the size of your picture to whatever you want. A tip: change either the width or the height, and then leave or make the other field blank, WordPress will adjust the picture accordingly without distorting it.
I use the image properties for creating ‘padding’ around my pictures. (This isn’t necessary if you have a caption, as padding is automatically created for your caption box.) Padding is the white space in between the picture and the text, preventing them from jutting against each other, and using this can make a big difference when presenting your pictures. I generally put anything from 5 to 10 in the boxes (vertical and horizontal), but you can experiment to what suits you.
The border box obviously provides a border for your picture, but be lenient – use between 1 to 3 unless you want to make a statement!
Again, once you’ve finished editing your picture, click on the ‘Update’ button.
So to sum up, make sure your picture is the correct size, is 72 dots per square inch, is aligned within your text, has alt text added to it, has a link added behind it, and has appropriate padding for ‘breathing space’ within the text. Then you’ll see a difference between professional picture placing and those that don’t know…