The first time I really thought about the images I use on web pages was when I noticed that I had almost used up the “free” space on my blog. I don’t like having to pay for extra space, anywhere! And I do like to use lots of images, especially in blog posts and tutorials. How about you? Do you know how to handle photo images for publishing online? On web site and blog posts?
Every time I work with someone who is new to creating and publishing content for web pages, blog posts, etc. – I know I need to explain how to handle photo images to get the most benefit and the least amount of bloating. (Yes, even a web site has problems with bloating!)
I’m assuming as I write this email that you know why it’s good to use images on your web pages and in posts as well as social media posts. In fact, not only does it attract people and illustrate your points, it seems that using images as the main meal deal a la Instagram has caught fire. At Facebook, it’s video that’s hot – live video.
So, let’s get straight to some how-to’s for handling photo images for publishing online. Here’s the simple step-by-step:
- Organize: Create folders to organize your original images and after you have downloaded (from your camera or your phone, for instance), go back to name your photos so that you can find them easily.
- Save: Save original photos as .JPG files if you have the option as you are downloading.
- Backup: Consider saving your original photos on an external hard drive (one of the larger ones with lots of memory, 1 or 2 terabytes, versus a thumb drive), and backing up by storing in the Cloud (Dropbox for instance).
- Preserve: Don’t use these original photos to upload to your web site. They are memory hogs. Keep them stored to preserve the quality and to re-use and re-purpose.
- Copy and Edit: Select photos to use on a specific web page or in a blog post.Edit them using an easy and free image editing software. The two most common things you will do are a) re-sizing and/or b) cropping.
- Save for the Web: After editing a copy of your original photo, save your image as a .PNG file and name it using targeted keywords.
- Add Alt Text: When you upload your image, you will be able to add “alt text” or Alternative text and you should ALWAYS do this and include the targeted keywords.
The Importance of Re-Sizing Photo Images for Publishing Online
Your original photos are likely to be over 1000 pixels in height and width but when you post to a web page or post, you don’t want any image to be larger than the full width of the body (let’s say 960 pixels) and most you’ll want to be smaller with text to the right or left of the image. And you want your images to take up less memory space on the server which saves you costs down the road – and also makes your pages load more slowly for your reader.
The Importance of Cropping
Cropping is important to focus your image so that anything ugly or extraneous (doesn’t match the key point you are making in your post) is cut out of the image. Sometimes, cropping is important to the shape of the image, for instance when you want a square image but your photo is rectangular.
So, it’s important to edit a COPY of your original and re-size for use on the Web then save as an image file type that takes up less space. I recommend saving as a .PNG file.
The Importance of Naming Your New File
The name of your file should include keywords, especially the keywords you are going to target for your page or post. If you are using only one image per post, consider naming the photo using the target keywords you use in the 1) page or post Title, 2) the Description, 3) the Excerpt, 4) the first paragraph, and 5) a sub-heading or two.
The Importance of ALT Text
Your Alt text is the text that you see when you mouse over an image on a web page. It’s the text that page readers, used by people with visual impairment, hear read to them that tells them what your image is about. And it’s the text that Search Engines “read” to understand and index your content, so another opportunity to get more “search engine juice” or SEO.
Summary: How to Handle Photo Images for Publishing Online
To organize and get best use from images, store your downloaded images in folders with names that make your images easy to find later. Store and backup your original images in at least one place that is separate from your hard drive and is easy to access when you want to use your images.
Edit copies of your original photo images by re-sizing and cropping and then save as .PNG files (Web friendly). Save them with a name using targeted keywords you have chosen for the page or post where you are adding the image(s). When you upload the .png image to your site, add Alt text using the same targeted keywords.