Having great images can actually add to your responsive website design making it more aesthetic and clear to its objectives. After all, pictures help people understand and visualize better thus, they aid in marketing your product/service better. A bonus tip: 1 picture on each page can greatly reinforce the message and catch the reader’s eye.
Do you own an online store? Have a website or a blog? Then this is for you. If you take few moments out of your time to optimize the images that you upload to the website, it would really pay!
Image optimization refers to two instances; to make sure they are indexed and crawled on search engines and to ensure they look good and enhances the beauty of your website.
The tools that you will be using are pretty simple to use, without any help of Photoshop. This means that you don’t have to be a pro to be able to optimize images for your website design.
Incorporating high-quality images
Who says you have to be a professional photographer to get the right pictures for the job? With so many websites out there providing stock photos, you can easily download photos for the commercial use from there. They have a good quality and serves the purpose. Look at these for example:
- Little Visuals
Stock photos may not work in the case if you want to show your team in it. For everything else, they are readily available. Looking for logo designs? Check out 99designs.
Using the right file type
When you choose images, you will see that they come in 2 variations: JPEG (JPG) or PNG. Although both have their differences but to tell you the basics, just remember the following:
- Photographs should be saved as JPEGs and uploaded as same as it makes the color quite manageable.
- If you have infographics, images with text, or logos, PNGs can work their magic for they have a better quality that plays with well with a mix of colors and text. The quality remains even if you zoom in. Save the PNGs as “24 bit”, they have a richer array of supported colors as compared to “8 bit”.
Striking the right balance in file size and resolution
If you want to make your images web-friendly, you will have to strike the right balance between the file size and resolution. Turn up the resolution high to make it look better but it will increase the file size, causing a slower experience for the user.
Remember this cheat sheet to manage your image size:
- Full-screen background images or any other large images should not exceed the size of 1MB.
- Small web graphics can range from 200 to 300KB.
- If you “Save for Web”, it can help your image become better in terms of web-friendly resolution.
Remain consistency in style and sizes
It is best to remain consistency in terms of style or size of the images you are uploading for your web. If they vary too much, it may look like a disarranged and disorganized page in all. Arrange them in a column, with text to support if need be. Remember, no stuffing, just put the images where they really need to be.
Helping the SEO by naming the file correctly
Now that you have the perfect photos, it is best to wisely name them. Don’t just leave as Photo3.jpg or DSC4500879. If you name them correctly, it will certainly give your SEO a boost for Google may not see the image, but can read its name and interpret accordingly. File name is also a part of the URL for your image. Make navigation easier by naming the file appropriately to improve SEO results.
Bonus Tip: Don’t forget to fill out any captions and alternative text. Additional information can give you that additional SEO juice!
Make use of these tips by Dubai Monsters and end up with great designs and SEO leads. Happy image optimizing!