> For the complete documentation index, see [llms.txt](https://support.agentfire.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://support.agentfire.com/faqs-and-general/common-questions/articles-2181446-how-to-optimize-images.md).

# Optimize Your Images and Videos for Your Site

The right size, file type and weight for photos and videos on your website, and how to shrink them.

Big photo and video files make your pages load slowly, and visitors leave slow sites. A few minutes preparing your files before you upload keeps your site fast and your photos sharp.

## The upload rules

* **Photos must be under 4 MB.** Bigger files are rejected with "exceeds the maximum upload size for this site".
* **Use JPG or PNG.** WebP files are rejected with "this file type is not permitted". Save or export your photo as JPG instead.
* **Videos can't go in the Media Library.** See [Videos](#videos) below.

![The upload screen showing the 4 MB limit, a file that's too big, and a WebP file that isn't allowed](https://2039430885-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fq65vhH2v4k5rpDOha9Vm%2Fuploads%2Fgit-blob-ee43afe4093d2cb493036dcfbed3943e533fa82f%2Fimg-1-upload-limits.png?alt=media)

4 MB is the most the site accepts, not a good size. Aim much smaller.

## What size to use

There are two separate things to get right:

* **Width in pixels** decides how sharp a photo looks. Too small and it looks blurry when stretched; too big wastes space.
* **File size (KB)** decides how fast it loads. Shrink it with a compression tool (see below).

| Where the photo goes                   | Width         | Aim for under |
| -------------------------------------- | ------------- | ------------- |
| Full-width banners and backgrounds     | About 1920 px | 350 KB        |
| Photos inside a section or column      | About 1200 px | 200 KB        |
| Small photos, like headshots and logos | 400 to 600 px | 100 KB        |

{% hint style="info" %}
If a photo looks blurry, the original is usually too small for the space, for example a 600 px photo stretched across a full-width banner. Compressing won't fix that. Use a larger original instead.
{% endhint %}

**Blog photos:** blog cards show your featured photo in a wide shape (twice as wide as it is tall) and trim the edges to fit. A photo around **1200 x 600 px** with the subject in the middle works well.

## How to shrink a photo

{% stepper %}
{% step %}

### Open a free compression tool

Go to [tinypng.com](https://tinypng.com/). It works in your browser with no account.
{% endstep %}

{% step %}

### Drop in your photos

Drag your JPG or PNG files onto the page. It shrinks them in a few seconds and shows how much smaller each one got.
{% endstep %}

{% step %}

### Download and check

Download the smaller files and open one to make sure it still looks good. Then upload it to your site. See [How to Change an Image on a Page](/spark-editor/spark-editor/how-to-change-an-image-on-a-page.md).
{% endstep %}
{% endstepper %}

Need to make a photo narrower first? Most photo apps can resize: on a Mac, open it in **Preview** and use **Tools** > **Adjust Size**. On Windows, open it in **Photos**, click **...** and choose **Resize image**.

## Videos

**Header (background) videos:** these play silently behind the text at the top of a page. Our team adds them for you. Email <support@agentfire.com> with:

* An **MP4** file, **32 MB or smaller**, ideally 720p
* No sound (we can remove it if you can't)
* The page you'd like it on

**Videos inside a page or blog post:** upload the video to YouTube, then paste the YouTube link into a **Video** widget on your page.

{% hint style="warning" %}
An **Unlisted** YouTube video doesn't show on your channel or in YouTube search, but anyone with the link can watch and share it. It isn't private.
{% endhint %}

If your header video is over 32 MB, a free tool like [videosmaller.com](https://www.videosmaller.com/) can shrink it and remove the sound in one go.

## Common Questions

<details>

<summary>Can you raise my upload limit?</summary>

No. The 4 MB photo limit is the same for every site. Shrink the photo first with the steps above, or email us the photos and where they go and we'll handle it.

</details>

<details>

<summary>Can I use WebP images?</summary>

Not as uploads. Save the photo as a JPG and upload that.

</details>

<details>

<summary>My video looks blurry after compressing it. What can I do?</summary>

Start from the best quality original you have, and try a lighter compression setting. For videos inside a page, YouTube usually gives the best quality since it handles playback for you.

</details>

<details>

<summary>Will smaller photos fix my page speed score?</summary>

They help, but they're only one part. Other things on the page, such as maps and social feeds, also affect the score.

</details>