2

From a design perspective is it more common to use different size images for say desktop and mobile or is it more common to use the same image for each and display them in different size using css or otherwise. What are the pros and cons of each approach?

Improve this question
4
  • 1
    Hi C_B, this question is best asked on Stack Overflow. you'll get super informed, relevant and current answers on best implementation practices there.
    – Mike M
    Apr 22, 2019 at 2:42
  • This hasn't any aspect related to design or UX. Using different size images helps only performance. If it is not necessary to have an image in a high resolution, it is better to not load it on mobile.
    – Madalina Taina
    Apr 22, 2019 at 4:29
  • 1
    I'll have to disagree with comments, but this looks like a real UX question. OP isn't asking about how to implement this, but the pros and cons from an UX perspective. And visual quality and performance time are common UX heuristics factors
    – Devin
    Apr 22, 2019 at 17:54
  • Could a mod move this to SO?
    – C_B
    Apr 23, 2019 at 0:32

1 Answer 1

Reset to default
1

The first approach is the best for the user experience as it saves energy, time and sometimes money. Also its a common practice.

Energy consumption: The overall energy needed to download, process, and finally display an image is less. For small processing units (like telephones) this is very important.

Waste of time: The time a user needs to spend to see an image is less. Sometimes is impossible to see an image if its not pre-processed according to the first approach.

Monetary cost: In several cases the telecommunication providers charge by the amount of transferred data. The spendings on energy bills are less.

Further readings:
Designing for Sustainability

Data Traffic Costs and Mobile Browsing User Experience

Improve this answer
2
  • 1
    "Energy, time, and money" seem vague here, what is being saved? Do you mean the users time until page load, money for data bills, and energy like phone power? Or maybe developers time and energy creating the different image versions and money for saving server costs?
    – DasBeasto
    Apr 22, 2019 at 19:14
  • Thanks @DasBeasto , you are correct.. I did update the answer. The answer is for the end user of the system. The first approach (delivering optimized images), as you rightly mention, is the best and for other system users.
    – cameraman
    Apr 23, 2019 at 9:01

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