In web design , it's usually needed to design an image for example in Photoshop and then use multiple sizes of it.

but I don't understand something here :
When I resize the image (PNG or JPG) and reduce the dimensions of that in Photoshop , the image quality extremely gets reduced and the edges become messy while resizing the image in a simple software like Microsoft Paint gives a really better output!

So what's the reason ? Is there a trick in Photoshop for image resizing which I've missed?

Thanks for your help.

UPDATE: I resize in this way : image > image size , then enter new dimensions , all of checkboxes are checked , and have tried all of resample modes including Bicubic sharper