ToolSahla, Tools Sahla

How do I lighten portfolio images for Mostaql or Khamsat without making my designs look cheap?

Reduce the dimensions first to what the site actually displays, then compress at a high quality between 85 and 90, and check gradients, thin lines and text in the preview. In a portfolio, how the design looks matters more than the last few kilobytes, so aim to sit comfortably under the platform's upload limit, not to reach the smallest possible file.

Published · 3 min read

Why portfolio images differ from product photos

A client browsing your portfolio judges your skill from the image itself. Any haze around lettering, banding in a gradient, or specks around a logo can read as weak design, not weak compression. So the rule is reversed here: quality first, and the size only needs to be acceptable. Upload limits vary between platforms and can change, so check what Mostaql and Khamsat currently state on the add-work form.

What a high quality gets you

Worked example

A 1600×1200 design showcase image of 689.5 KB, compressed in Chrome:

JPEG at quality 88 with dimensions unchanged: 347.1 KB, 49.7% smaller.

Reduced to 1200×900, then JPEG at quality 90: 217.5 KB, 68.4% smaller.

The second option is clearly lighter at a higher quality, because the saving came from pixels the site never displays, not from detail. That is the smart way to lighten portfolio images.

Step by step

  1. Open one of your works on the site and note the width the image is shown at on the work page. There is no need for an image much wider than that.
  2. Reduce the dimensions in the Image resizer with the ratio locked, saving the output as PNG so nothing is lost before compressing.
  3. Add the images to the Image compressor and choose JPEG at quality 88 or 90.
  4. If your design has a transparent background, pick a background color that suits the display, because JPEG cannot store transparency.
  5. Zoom the preview into three places: a gradient, the thinnest line in the design, and the smallest text. If you see bands or halos, raise the quality.
  6. Download, upload, then open the work page on your phone and check how it looks.

Mistakes that hurt a portfolio

  • Uploading a screenshot of the design instead of exporting it, so blur is baked in before any compression.
  • Crushing the quality to hit a tiny size the platform never asked for.
  • Using a copy that was already compressed, such as an image you sent a client in a chat, instead of the original export.
  • Mixing images of uneven size and quality, which makes the portfolio look untidy. Compress all your works with the same setting.

Common questions

Should I upload WebP images?

First make sure the platform accepts them. If you are not sure, choose JPEG.

Should I watermark my work?

That is your call. If you do, add it before compressing with the watermark tool, then compress once.

Are my unpublished designs uploaded to any server while compressing?

No, compression happens inside your browser.