As Alex Blackwood pointed out in the comment above, it sounds as if your PNGs are using Index color. When ever you resize with this color mode, the colors get out of alignment and you get noise. 

What you need to do before attempting to resize is go to Image > Mode > RGB Color

Why does resizing PNG with alpha transparency make edges gray?
My web designer tells me that in a web page, the empty margins or padding should always be multiples of a standard. For example 6 px, 12px, 18px. This should produce nicely balanced lay-outs. I would like to learn a little bit more about it:

Should one really not violate this at all?

Should the standard be the same horizontally and vertically?
