Currently using thumbnail image 180*110 size for album and same image but separate size 80*55 for playlist. Now, my questions are the following:

  1. For SEO purpose need to optimizing for image can i use same 180*110 album image for playlist image 80*55 using css to resize.
  2. If i use same image any loading time reduce or increased
  3. Same alt tag for thumbnail and small thumb images
  • CSS only changes the display size and does not change the file size therefore using a larger image and displaying it smaller does not reduce download time or traffic. If you are trying to increase download speed, then you do want smaller optimized images where appropriate.
    – closetnoc
    Feb 17, 2017 at 17:14

2 Answers 2

  1. SEO: Using the same file and css to reduce the resolution will not impact your SEO.
  2. SPEED: Using the same file will reduce the server-side requests which will speed up your server and save bandwidth for your users. However... if the big and small thumbnail images do not appear on the same page as one another then for slower devices the smaller images would be more preferable since the bigger the image the more memory it uses on the device and would increase on a bigger playlist.
  3. ALT TAG: If the image is the same then the alt tag should remain the same too... remember, alt tags are for impaired users first and then search engines.

Personally... I'd go with the easiest method to administrate... devices that slow down with such size thumbnails would have to be dog old and bandwidth is hardly an issue nowadays unless your catering to countries with slower broadband.

  • You bring up important thoughts I forgot about. Cheers!!
    – closetnoc
    Feb 17, 2017 at 17:15

Since CSS does not change the file size of the image, then you are displaying a smaller version, but not actually providing responsive images. For SEO, no impact as long as your ALT TAG is set to something descriptive for impaired users. Using appropriate keywords in the text can boost SEO some, but only if they fit the description. Such as "front panel Cisco xxx switch", it is descriptive for users and contains keywords Cisco and switch. Don't force it though. Organic is better.

Now speed is another issue. The image sizes you list would not be excessively large unless you render them in really high definition. If you've come to a compromise between file size and quality, say a medium sized image, then loading speed is not impacted. And for thumbnails you do not need high definition. For the human eye, unless your image has fine details or is a high quality photo, users will not detect differences in quality between the majority of pixel resolutions. Only the very, very low quality would produce a noticeable pixelation. And sending a very high quality image as a thumbnail to a mobile user is a waste of bandwidth. You could consider creating actual responsive images, so that users on a variety of devices will all have a high quality experience. You can generate multiple resolutions and have your web server display the appropriate one after determining device type and connection speed. There are also image services which will do this for you and most, like Cloudinary, have a free tier.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.