For a while now I have resized images that I will use for uploading to the web a certain way, which is to size it in photoshop at 1236 pixels on the long side, and then take a screen shot of the image. I have tried "save as" with those dimensions & compared but the quality of screen shot is much better (especially in the eyes, they don't get pixelated). Anyways, it saves the screen shot as a PNG on my mac, but I never noticed until today that it converts it from an sRGB (how I had it in photoshop) to a CMYK color. I didn't know what that is so I researched it, and to my understanding CMYK is not for web, only for print, because it overly-saturates the images? On my screen when I open the sRGB and screenshot image the colors look the same. When I upload online I only notice the screen shot image to be a tiny bit more saturated, but I don't know if this is just my monitor? I know everyone's monitors are calibrated differently so we might not all see the same, but I just want to know how most of the people see it
Here on the left is an image saved in sRGB as a JPEG sized
at 1236pixels in height and 114DPI. (Don't mind the actual photo
& composition, it's a trashed image & I cropped it randomly to
just use as test)
1236pixels in height and 114DPI sRGB in photoshop, and then took
a screenshot that saved on my computer as a PNG in CMYK color.
I do notice there's a bit more vibrance in the screenshot image, but I never thought of it to be overly saturated, but I don't know if it's just my screen?
Maybe I'm just making a bigger deal out of this than it should be...But it just bothers me not understanding something I'm trying to understand

Which one do you think looks better? is the right one too saturated? How important is it to have it in sRGB instead of CMYK in this case?