[Overview Video] Export for Web

Discuss and share Pixelmator Pro resources such as templates, mockups, and tutorials.
User avatar

2018-06-01 11:12:32

With Pixelmator Pro, you have everything you need to prepare and optimize your images for the web.

User avatar

2020-04-10 21:19:53

The video is good but when I go to my design page to do the same it does not look the same - I do not know why. Also I do not know which format is the best to add to an e-mail.
User avatar

2020-04-14 16:10:40

Hey Greta, the two main formats you need are JPEG and PNG. PNG is uncompressed (higher quality) and supports transparency, so it's good for graphics/illustrations or anywhere where absolutely top quality is important. JPEG is good for photos or anywhere you need to have smaller files at the expense of a potential (but not necessarily visually noticeable) drop in quality. The other formats (GIF and SVG) are quite specialized and you'd probably know if you needed to use them. So if you're not sure, pick between PNG (higher quality/large size) or JPEG (potentially but not always lower quality/smaller size). If your images have transparent areas, then you should always go for PNG.
User avatar

2020-04-20 19:41:16

Ok, Thanks
User avatar

2020-06-13 08:47:30

Hi, when exporting I like to keep control of my dimensions. Photoshop allows me to export an image to exactly 1200 or 800 or whatever dimensions I choose for web. I don’t see that option in Pixelmator, correct? So when I have a 5.000 px large image, I won’t be able to quickly export it to less than 2.500 px (@50%) unless I change the dimensions of the original image. Is that right?
User avatar

2020-06-16 12:09:20

by Bart 2020-06-13 08:47:30 Hi, when exporting I like to keep control of my dimensions. Photoshop allows me to export an image to exactly 1200 or 800 or whatever dimensions I choose for web. I don’t see that option in Pixelmator, correct? So when I have a 5.000 px large image, I won’t be able to quickly export it to less than 2.500 px (@50%) unless I change the dimensions of the original image. Is that right?
That's right, for now, that's the way things work. We're aware of this, though, and we'll see if we can make some improvements in the future. :ok_hand:
User avatar

2020-06-24 11:06:00

by Andrius 2020-06-16 12:09:20
That's right, for now, that's the way things work. We're aware of this, though, and we'll see if we can make some improvements in the future. :ok_hand:
I'd like to se that added too... I really want my 6000px wide logo to export at 25%, but I cannot find a way to add that preset... weird. It'd be REALLY convenient if that'd be added soon! Thanks in advance!
User avatar

2022-02-06 22:31:39

I'd like this functionality too. In fact, I'm having trouble understanding the current functionality where the options are for .5x, 1x, 2x, and 3x. If I choose say 3x, is my image going to be upscaled 3 times and therefore loose quality at the bigger size?

I'm used to creating an image at the largest size that will be used and then scaling down the image for use on smaller devices. The options in Pixelmator seem to be for doing the opposite. Feels like I'm missing the gist of this.
User avatar

2022-02-07 14:35:17

by tmhudg I'd like this functionality too. In fact, I'm having trouble understanding the current functionality where the options are for .5x, 1x, 2x, and 3x. If I choose say 3x, is my image going to be upscaled 3 times and therefore loose quality at the bigger size?

I'm used to creating an image at the largest size that will be used and then scaling down the image for use on smaller devices. The options in Pixelmator seem to be for doing the opposite. Feels like I'm missing the gist of this.
Hi tmhudg. Resizing images for export is already possible in Pixelmator Pro. :raised_hands: If you choose File > Export, you'll see the Scale pop-up menu in the Export dialog. You can choose to scale your image by a specific percentage or by typing in the exact dimensions.
User avatar

2022-02-07 15:40:41

by Aurelija 2022-02-07 09:37:32
Hi tmhudg. Resizing images for export is already possible in Pixelmator Pro. :raised_hands: If you choose File > Export, you'll see the Scale pop-up menu in the Export dialog. You can choose to scale your image by a specific percentage or by typing in the exact dimensions.
Yes, that's true but this doesn't have the functionality of Export for Web of generating multiple images at different multiples of sizes all in one go.

And, this doesn't answer my question. In the Export for Web tool, what happens when I select an option to export at a size greater than my image? It seems like the upscaled image would be of lesser quality than the current image. Am I understanding that right? Why would I ever want to do that?
User avatar

2022-02-07 16:33:32

For raster images, the scaling options are, indeed, a bit more limited as they will lose quality when upscaled. However, you can still use Export for Web for downscaling. The 0.5x scaling, for instance, can be used to prepare an image version to be displayed on non-Retina displays. 2x and 3x scaling is dedicated more to scaling up vector graphics. Since vector layers (shapes and text) are resolution-independent, the quality of a vector graphic will not be affected when scaled up. As for adding the ability to enter a custom export size in the Export for Web options — we'll have to think about it. I've made note of your suggestion :pray: