Mobile app version of vmapp.org
Login or Join
Gloria169

: What is the ideal URL format to use for images served at multiple sizes I am building responsive image functionality for a site (written ASP.NET MVC, although that is almost irrelevant here).

@Gloria169

Posted in: #Images #ResponsiveWebdesign #Seo

I am building responsive image functionality for a site (written ASP.NET MVC, although that is almost irrelevant here). My question is not technical, but about the most semantic way to serve images at different resolutions.

I would be uploading the maximum resolution images to the blog and then it will dynamically re-size depending on the format of the requested image URL. I want to know what is the most semantic / SEO friendly format of URL to use. Say my original image has the url example.com/picture.jpg Some ideas are:
example.com/picture.jpg?w=300&h=150 www.example.com/picture-300-150.jpg example.com/picture-w300-h150.jpg www.example.com/300/150/picture.jpg example.com/picture.jpg/300/150

10.01% popularity Vote Up Vote Down


Login to follow query

More posts by @Gloria169

1 Comments

Sorted by latest first Latest Oldest Best

 

@Becky754

You could also handle sizing this way and make your image names simpler:

<img srcset="small.jpg 256w,
medium.jpg 512w,
large.jpg 1024w"
sizes="(max-width: 30em) 30em, 100vw"
src="medium.jpg"
alt="keyword image" />


Or you could use a responsive image service like Cloudinary to handle the manipulation. In any case, make sure that you have your keyword in your alt text for the image and if possible in your image title and caption. Adding the keyword to your image metadata will improve SEO.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme