How to show off your pics. Read this tutorial first!

[Norseman]

This is a short tutorial on how to reduce picture size for uploads on the web in general and here on YD in particular.

With today's cameras you get huge maybe 8 megapixel pictures at perhaps 5 megabyte that requires a lot of space on the computer and that consequently requires time to download for people to watch.

There are three things you want to do in order to reduce the bytewise size of the picture before uploading:

1: Change actual width and height of picture to fit the screen
2: Change the resolution, the number of "points" within the picture.
3: Change the quality of the picture.

Starting with No 1:

There is no standard screen width but most have at least set their screen resolution to at least 800 x 600 pixels. When just showing your pictures it's therefore unnecessary to make your pics bigger than that since many will then have to scroll sideways or up and down to see the whole picture. In order to upload your images to YD's own site the pics apparently cannot be wider than 650 pixels anyroads.

No 2:
The resolution is the number of dots in the pictures. On computer screens more than 72 is a waste since it won't be shown anyway. That's how a these screens work! Reducing the pixels/dots per inc (dpi) is therefore important in order to reduce the size of the image.
This is done with "Save for web" in Photoshop and I'm sure other programs as well.
Here are step 1 and 2 done at the same time:



The last step, No 3, is the one that really is going to help you. The quality of the picture is determined by the amount of "shortcuts" done by your photoeditor. Press "save as" and look for somewhere you can change the quality of the pic. Sometimes you have to press an additional "Advanced" button for the quality-option to show up.
The lower the quality, the more sets of colour dots are collapsed into just one. A normal underwater picture with not too many colours set to a width of 650 pixels will give you a size of around 40kb at 60% quality. If there are more colours, such as a wall of anenomes, you'll need to decrease the quality more in order to get all the colours to "fit" in.
Now of course at 60% the quality won't be too good but I think you'll find that the pics are more than adequate for use on the web.

Here's how it's done in ARCsoft's editor:



Uploading your pictures:

Now having resized and saved your pics, hopefully with a different name than the original so that you're ending up ruining all your originals, you can upload them either by attaching them to one of your posts using the "Manage attachments" button or by using a webhost.
I've been using www.photobucket.com for a while now and this site seems to work very well. When you've uploaded pics there you get a an [IMG]-tagged address line that can be copied and pasted directly into your post.
An image should then look a bit like this in your post:

[IMG ]http://img1.photobucket.com/albums/atckyrre/ughabugha.jpg[/IMG]

Notice the difference between the [IMG] and the [/IMG]-tag, while the last one is necessary to "close the deal" so to speak.

Please comment on the tutorial and should you have any additional inputs they will be implemented in this original post.

Kyrre

[Jules]

You read my mind... I was thinking that we needed to make that thread ,where you showed me how to sort the pictures, into a sticky.. but this is better.

It's good to see so many poeple posting pics now!

Jules

[JohnK]

Excellent - now all I have to remember is to set my camera on the right pic quality - last time I used low quality and was really pi$$ed when I uploaded them.

Great tutorial - thanks

[Dr Stevil]

Nice work Kyrre, I never even realised the "save for web" function was there, do you erm... wanna do a whole series on using Photoshop

[Norseman]

Originally Posted by Steve W

Nice work Kyrre, I never even realised the "save for web" function was there, do you erm... wanna do a whole series on using Photoshop

Ahem.. Well I did a wee one on picture editing but that one seems to have disappeared with that last upgrade. Did anyone save the text so I don't have to write it all again?

Now photoshopping in general really isn't my forte. I've fiddled about with the tools but I'm very slow and only understand a fraction of all the features...

Kyrre

[Clowny]

Now photoshopping in general really isn't my forte. (Quote)


It is for me. Anyone needing tips. Post it. I'm new on here 'cos I've only just found you guys. Infact this is my second post. If Anyone is interested in my stuff...www.picturetrail.com/christrent

Any tips given as far as possible. My last photo student was a Japanese guy, spoke no English, keen on photographs, teaching him photoshop for 2 hours before he finally found the pigeon English for colourblind. True story.

[Jules]

Clowny
Fantastic pictures thanks for sharing them! We look forward to you doing an idiot guide to photoshop for us!
Jules

[DaveB]

Originally Posted by Norseman

[IMG ]http://img1.photobucket.com/albums/atckyrre/ughabugha.jpg[/IMG]

Notice the difference between the [IMG] and the [/IMG]-tag, while the last one is necessary to "close the deal" so to speak.

Please comment on the tutorial and should you have any additional inputs they will be implemented in this original post.

Kyrre

Thanks for this - just a minor point, you have an extra space in the [IMG] command - this might cause confusion if people cut and paste it (like me!)

[Jules]

Bumped shamelessly for those people who are asking how to post pics on YD. Kyrre details the photobucket method which gives the best reults.

Can we make this is sticky again? I think it used to be?

Jules

[David]

Kyrre good post :-)
ok so having changed my pic how do i get pic to show in my post on YD and not just the link to where the picture is. I can see other people doing it but I have no clue even waisted time trying to work it out, now i just dont even bother :-(

David