1. COLOR ISSUE: Your original was in Adobe RGB. This can be seen by looking at the 4th screen shot you posted, ie, the one that shows the "Save As" dialog box. Down near the bottom of that dialog box, you can see that the working color space that you used for that image was Adobe RGB.
Within the last couple of years, most popular browsers and image viewers have been updated to correctly handle color spaces such as Adobe RGB, so when you inspect the image using one of these, it will look fine.
However, the reason the colors in your image looked better in Spotify when you used "Save for Web" and "convert to sRGB" is almost certainly because the Spotify upload software does not properly display any color space except sRGB. They likely need to get with the program and update their software.
From your point of view, the simplest solution for you is to do exactly what Ged suggested and use the "Save for Web (sRGB)" option.
If the images you are working on in PS usually wind up on the web (ie, not as paper prints), then set the preferences in your copy of PS so that the working space is sRGB, not Adobe RGB, and this problem will disappear, and you can use either the ordinary "Save As" or a "Save For Web" command interchangeably.
2. SHARPNESS ISSUE: One of the most common but mysterious reasons that images get blurry is because the user (knowingly or not) changed the dimensions of the image in pixels multiple times. Every time you do this, you introduce a small bit of blur. For example, if you send a 1280x857 (width by height)image to a website (eg, Spotify) whose images are, say, displayed 1000 pixels wide, the website's software will automatically resize your image down to 1000 pixels. This will soften it slightly. If the forum's software needs a larger version, it will attempt to up-rez your image and up-rez'ing (ie, increasing the number of pixels) will DRAMATICALLY soften it.
The problem is often even more complex than the above paragraph would suggest because some websites will resize your image differently to fit different areas on their pages, so, in this case, you can not simply do an exact downsizing yourself. In this case, your best option is to supply the website to which you are contributing, a version of the image that is at least several times larger (in pixel dimensions) than the largest version they will need. When down-rez'ing from a much larger image, the loss of sharpness is minimized.
This is probably what you did when you changed the resolution, but without knowing more details about the exact process you used, it's hard to tell. The bottom line is: for web use, just ignore any reference in Photoshop to the dimensions of your image in physical (ie, inches or cm) units, and only pay attention to its dimensions in numbers of pixels, and then submit the largest (in number of pixels) they will accept.
HTH,
Tom M