HTML: Uploading photos



I get asked this question a lot. How do you get such clear, crisp photos? In this session, I will be going into more detail about making sure you keep your photos crisp and clear without bogging down your reader's computer, information on where to host photos, how to upload photos and the some tips on the best photo storage online.

First, I'd like to talk about the pre-uploading things you need to be doing to keep your photos crisp and clear.

1. Camera: It's obvious that photo quality is greatly contributed to a camera. If you are snapping your photos with the smallest size setting on a little point and shoot, you might not get the best quality. I personally invested in the cheapest DSLR I could find... and I shoot my images on the "large" setting instead of the "small or extra large". I don't need to blow my images up into a poster, but I also want a nice clear photo on the blog.

2. Editing: During the editing process, if you are saving your photos out using Photoshop or another photo editing program, make sure you are saving your photos at 72 DPI. (DPI means dots per inch). For a screen, you only need 72 DPI. If you are saving your photos out at 300 DPI (which is more accurate for print instead of digital) you are going to bog down your reader's computers with slow loading time.

3. Image size: I could recommend figuring out the pixels of your blog post area. I know mine by heart because I use it constantly when working with my images. (435 pixels, exactly!) If you know the pixels of your blog post area, you can resize your images accordingly to fit right into that space. I would recommend saving smaller images into your blog. FYI: If I'm viewing a blog for the first time and the images take longer than 15 seconds to load, I'm gone. So, this is very important! If you still want to have high-res images available, upload them to your photo hosting site along with the smaller images for your blog and link them on your blog!

4. Hosting: Where you host your photos can contribute directly to the quality of the photo. I personally use Flickr. I purchase a $25 Pro account every year and it's the best $25 I spend on my blog. Flickr preserves photo quality amazingly, they have the best way to organize photos and it also serves as a great community! You can also host your images through Photobucket or even right through Blogger or your blog host. Note: Flickr is the best. Blogger is the worst.

5. Uploading images: Let me give you a terrible example of what you can do when you upload your image into your blog. You can upload your 4000 x 2000 pixel image directly into your blog without using an image host or resizing. You might think Blogger is resizing your image, but really it's just shrinking it, but keeping the file size there. It's nice because if you read a blog, click on the image and it will take you to a high-res version.. but really, not many people click on the high-res image or need it. But people will click off your blog if the images are taking too long to load. So take the pros with the cons and decide what's right for you, but I would recommend taking my advice. Resize your images for faster loading time.

Reader Question:: How do you get your images to line up in the blog posts exactly whether they are vertical or horizontal images?

Answer: Make sure that when you resize an image... you are saving ALL of your images with the same WIDTH pixel dimension. Height doesn't matter, but width is very important!

Adding an image to your blog post through another photo host:

To add the image to your blog if you are using Flickr or Photobucket, you can copy the "image address" of your photo, click on the little image button on Blogger or Wordpress and insert the image URL. If you click upload image, your image will appear. You can also choose the layout (left, middle right) and the image size. I always have large selected for image size (but I've already sized my image prior to uploading!) In blogger, you only get 1024 mb of space, so that's another great to reason to use a different photo-hosting site!


Pin It!