photo posting - three

from flickr

uploaded directly to blogger and enlarged to 500 pixel width

uploaded to blogger, 400 pixel width

Here at last is the promised photo posting post. Apologies its taken so long. If you haven't seen the other instalments I talked here about what equipment I use and here about the simple editing I do to improve my photos. The last step is putting those photos online and I have a couple of tips. (And sorry I'm using Blogger and can't help with other formats.)

I think the best way to improve the look of your photos is to upload photos to Flickr first and then link from there. I find it quicker and easier too.  When you upload photos straight to Blogger they are stored in Picasa. For some reason I always find the directly uploaded pics are muted and slightly fuzzy and that used to really bug me (you can see the difference in the examples above) . Then I read about uploading through Flickr  and switched to that method. The difference is quite noticeable I think you'll agree, and with the recent changes to Flickr its now even easier to do.

First upload your pics to your Flickr account (you can get one of these free and they are a great way of sharing your photos, joining swaps, joining groups, seeing other great photos). Once uploaded go to the relevant photo page and click on the 'Share This' tab. Then click on the Grab the HTML/BBCode and you will be given a snippet of code to copy (I choose medium format here usually because my blog has a 500 pixel central column). Copy it and then go back and paste it into your blog post, in position. Importantly, make sure you are in the Edit HTML panel first.

As I said my blog layout is modified. The central column is 500 pixels wide and I like my pics full width, so most often a medium format fits perfectly for me. There are seven other sizes to choose from in the menu so you most probably find one you like.

Occasionally I need to enlarge or reduce the scaling to fit exactly, especially those pictures in portrait format. But this can be done with some simple changes. They might seem complicated the first time you try it but are quite easy once you get your head around it.

Look at the html you've pasted in, say the width was only 400 pixels and you wanted it larger (see original code first followed by modified code in the example below). You can type a different width value straight into the code, but don't forget you have to change the height proportionally as well, or the image will be distorted. To find the right height work out your enlargement percentage by dividing the final size (500) by the initial size (400). In this example you get 125%. Look at the html and see the original height size (285). Multiply that by 125% and as you can see in the code below, 258 becomes 356 pixels. You can do this the other way round and start with the height and then calculate the width. If you are making a radical size change use a larger size photo to begin with, or it will end up fuzzy.

I really hope this isn't too confusing. There is nothing to lose though, any mistakes can be deleted before you post. Or like me, get a second layout blog specially to mess around in. If you have any questions please leave them below and I'm happy to try and answer them.

* Download Flickr Uploadr app here: http://www.flickr.com/tools/uploadr/

see comments for info.