Optimize an image for the web

Optimize an image for the web

Images play a massive part of traditional on site SEO, and optimizing images is not rocket science, just use your common sense and follow some pretty simple to follow principles.

One of the biggest and most common mistakes I see when somebody with little experience creates, or takes control of their website is images, however, even professional web design companies make this mistake.

So, below is a few basics to ensure that your images are optimize :

Good Quality Images

Always use the best images possible and never use two images that are of the same subject on a single page; it may seem obvious but ensure you use relevant images, it’s really important.

Image File Size

Make sure that the file you are uploading is as small as possible, but maintains high quality. The simplest way to think about it is if you are uploading a few images, that equate to 2/3MB, imagine how long that would take on a weak 3G signal when users are using mobile, even if your website is super responsive the images are going to take an age to appear, or worse the browser will quit and broken images will appear.
My rule of thumb is to never exceed 350kb on a single web page. There are a number of tools to help you reduce your file size – Photoshop is the most obvious, however, software such as Pixlr or gimp is just as good and is free and easy to use.
If you are using WordPress, use smushit software to ensure that your files are compressed even further once uploaded.

Image Alt and title tags

I see a lot errors with alt tags and title tags. The first issue is no tags at all; every image uploaded should have an alt and title tag.
Don’t upload an image and allow the tags to be taken from the file name, which is straight from the camera – for example DSC_0001.jpg – this is quite common in CMS based websites where alt and title tags are automatically assigned via the name of the file, which goes on to another issue: file names, make sure you name your file descriptively, it’s good for your organization.

Another common issue is when every tag is named the same; make sure you mix the tags. If your image summarizes a subject use the subject, along with the local area, however dont keep on repeating these tags in all of your images . The last thing a user with a visual impairment who is using a screen reader wants to hear is “Plumbers Bath” repeated, and believe it or not, this is not what Google wants to hear either, so to improve your SERP chances make sure you get your image alt and title tags correct.

Declare a Width to the Image

Either set a pixel or percentage to ensure that your image is loaded perfectly: this is an issue you will see if you run your website through the w3c validator and it is so easy to fix.
Stock Free Images
When possible try not to use stock images, this might sound a bit rich coming from me, but my stock images will be replaced shortly when I get time to set up a shoot. Real images are easily set apart from stock, and users like to be able to see faces and examples – any company can buy stock images that look nice, so setting yourself a part by using “real” images is worth the effort.

Finally, don’t think that you have to pay £1000’s for a good camera or photographer, most smart phones can take good shots, just make sure you research how to set a scene and composition up, there are lots of tutorials on YouTube to do this, here is a few channels:

Di Casia Film
That Nikon Guy
Snap Snap Snap

Thanks for reading, if you have any questions please get in touch.

Rob @ Developed Web

What to expect in the Developed Web blog

So this blog is going to be my place to talk about a number of topics – these will include what is happening in the local community, Web design and SEO practices that I follow and WHY, case studies from clients, and other misc items.

I will also be doing tutorials on general SEO and web design practices and I will be asking for people to suggest what they want to see. Subjects will range from how to optimize an image, how to install WordPress and set up multisite,and  ensuring that you know the basics of local SEO – and WHY it is so important. The subjects will be quite varied and I intend to make them simple to understand; I am hoping to do some more advanced tutorials too.

The blog will also feature posts about what is happening in the SEO world, telling you what to look out for and how it could impact your website.


Rob @ Developed Web

New Website

Welcome to my new website Developed Web – here I will be writing about what is happening in the web design and SEO world – trying to make it as simple as possible for you to understand.

So keep an eye out and if you have any questions please feel free to ask.