What is the correct way to upload and store multiple image sizes on the server?

Question

Database

How is it done correctly?
Different sizes of one image, for example, for different phone screen sizes.
(And it's also not quite clear yet how to do so many sizes ...)
I'm trying to come up with it like this:
- One picture is loaded (of the largest size)
- Processed on the server, into several images of other sizes
- All are saved in different folders (as well as I don’t understand yet)
- Create an additional table in the database to store links to all these images
- OR one table with the name of the path, and then somehow correctly generate the output of the desired image
Then you need to somehow correctly determine the size and return the image from the server or give everything you have, and process on the client ...
Вобщем у меня опыта и фантазии к сожалению не хватает придумать, как это работает.
Можете помочь алгоритмом действий или примером, пожалуйста.

Answer 1

Подключаете GM модуль, обрабатываете все урлы с картинками, размер для отдачи определяете по query параметрам, например www.cite.com/image/001?w=800&h=600 Конвертируете, отдаете картинку, результат кешируете, чтобы каждый раз не конвертировать заново. Храните как вам удобно, хоть в базе, хоть в папках.

Answer 2

width: 100%;
Задав данный CSS класс изображению, оно всегда будет вписываться в область просмотра.