Quickly resize, crop, and compress your images online for free.
How to quickly size your images and compress them for your website
For this tutorial we will be using two free online services.
The first is is our image editing platform. It’s called “BeFunky”.
Please go to: https://www.befunky.com
Image resizing steps
- Once you are there, click the button that says, “Get Started”.
- When the popup opens asking you what you would like to do, click the button that says, “Edit a Photo”.
- The next step is to open the photo you want to edit. I have a free photo that I downloaded from Unsplash that I will be using as an example.
- After you open the photo, the first thing we will do is “resize” it. In the toolbar, click on the ‘Resize’ icon.
- All projects should have some sort of image requirements (width and height). For this particular lesson, we want our image to be 1920 x 1080.
- Inside the width box, type in 1920. Make sure the ‘Lock Aspect Ratio’ checkbox is checked and hit enter. As you can see, the width is now set to 1920px, but the height is at 1281px. We’ll fix the height in the next step. Click “Apply”.
- In the toolbar, click on the ‘Crop’ icon. The Aspect Ratio should be set to “Freeform”.
- Drag the corners out until you see our required 1920px width.
- Drag the top or bottom handle until the height equals 1080px and click “Apply”.
- Now click Save, and save it to your computer.
- Give the image a proper name using lowercase letters only, and hyphens between the words. Make sure the format is set to JPG, and click Save.
- Exit the program. You image has been resize.
Image compression steps
The next step is to compress the image. You need to compress the image(s) to decrease the file size and download time.
- Let’s head on over to our online image compression program. Please go to: https://tinypng.com
- Once you are there, upload the file you just resized.
- When it is done compressing, click download.
- Rename the file.
- This image is now ready to be loaded into your website.