Recommended image sizes online
- File size
- Images should be no larger than 1 MB, and most small images can be 300 KB or less. Larger images can slow down your website’s load time.
- Image dimensions
- The size of an image depends on its intended use:
- Background images: For desktop, a background image should be 2560 x 1400 pixels. For mobile, it should be 360 x 640 pixels.
- Hero images: For desktop, a hero image should be 1280 x 720 pixels. For mobile, it should be 360 x 200 pixels.
- Website banners: For desktop, a website banner should be 1200 x 400 pixels. For mobile, it should be 360 x 120 pixels.
- Blog images: For desktop, a blog image should be 1200 x 800 pixels. For mobile, it should be 360 x 240 pixels.
- Logos: For logos, a square ratio of 1:1 or a rectangle format of 2:3 is recommended. For desktops, logos should have a maximum height of 100 pixels.
convert images from .heic to .jpg extension
for file in *.[Hh][Ee][Ii][Cc]; do sips -s format jpeg "$file" --out "${file%.*}.jpg"; done
Change image size with python image processing library, PIL/Pillow
pip3 --version
pip3 install Pillow
python3 // start a python shell
from PIL import Image // verify Pillow installation
//if not
pip3 install pillow //install pillow library
//or
brew install pillow
create a python script
import os
from PIL import Image
# Define the folder containing the images
folder_path = '/path' # Change this to your folder path
# Define new dimensions
target_size = 1500
# Loop through all files in the directory
for filename in os.listdir(folder_path):
if filename.endswith(('.jpg', '.jpeg', '.png', 'JPG)): # Add more extensions if needed
file_path = os.path.join(folder_path, filename)
# Open the image file
with Image.open(file_path) as img:
# Check the orientation and calculate new dimensions
if img.width > img.height:
# Horizontal: Set width to target size, adjust height
new_width = target_size
new_height = int((new_width / img.width) * img.height)
else:
# Vertical: Set height to target size, adjust width
new_height = target_size
new_width = int((new_height / img.height) * img.width)
# Resize the image
img = img.resize((new_width, new_height))
# Save the resized image (you can overwrite or save with a new name)
img.save(os.path.join(folder_path, f'resized_{filename}'))
print("Resizing complete!")
run the python script
$python3 filename.py
convert images from .jpg to .webp extension
.webp
and .avif
image files are generally preferred over .jpeg
and .png
files because they offer high quality while being compressed, making them lighter and optimizing speed. By installing cwebp
on our local machine, we can easily create .webp
files.
$brew install webp
/*** get to your directory ***/
$cd path/to/your/folder
/*** run this bash command, in this folder, all files with .jpg create .webp files ***/
$for file in *.[Jj][Pp][Gg]; do cwebp "$file" -o "${file%.jpg}.webp"; done