Any ideas how to save a JPG (or any similar - small (KB) size Format) image with the size of 300px/300px in Photoshop - to scale it up to 600px/600px with using css in a webpage, without loosing "Quality"? I try to figure out wich settings are doing well... And how I can save the images in small sizes (KB)
1. Saving JPG in Photoshop in 300x300px
2. Scaling up with CSS to 600 x 600px
There is no way to scale up an image without losing quality.
In that case, you should scale your image down.
So instead of saving it as 300x300, save it as 600x600. Search for good optimization / compression methods, maybe use PNG instead (because sometimes a PNG-8 compressed can be smaller than a JPEG). You probably need to use a different tool to optimize the PNG file (search the web for "PNG image optimizer")
Better yet, I'd save it as a size in between 300px and 600px, so it's both smaller than 600 and has better quality than 300. You might need to try a few different sizes to find the right balance between quality / file size.
More to complement Luciano's answer than counter it:
Another thing to take into account is connection speed and bandwidth - you don't want to be firing a massive image over the web if you can get away with it. One option is to have two versions of the image, one acting as a thumbnail and the other as the full-sized image.
Though JPEGs have compression, it's still important to remember: though it seems like you're only doubling the size of the image, you're actually quadrupling it. E.g. 600 x 600 = 360,000 pixels, 300 x 300 = 90,000 pixels (then multiply that by 3 or 4 depending on the number of bytes per pixel).
