Guide to Preparing Photos for the E-shop
Learn how to properly prepare your product images before uploading them, ensuring top-notch appearance and maximum speed in WooCommerce.
A professional product presentation requires consistency and speed. When you upload photos directly from your phone or camera without editing them, the e-shop “slows down,” pages take a long time to load, and customers abandon their shopping carts. Follow the 4 simple steps in our guide for perfect results.
Correct Proportions and Dimensions
To ensure your photos don't appear “cropped” or uneven in product listings, they must all have the same dimensions.
The recommended dimensions for WooCommerce are:
- Square images (1:1 aspect ratio): 800 x 800 pixels or 1000 x 1000 pixels (The best option for most online stores).
- Vertical images (Clothing/Fashion – 2:3 aspect ratio): 800 x 1200 pixels.
[ Screenshot: Example of proper square product layout in an e-shop ]
File Naming Conventions for SEO
Google reads the photo's file name to figure out what it shows. Never upload images with names like IMG_4922.jpg.
The rule: Rename the file on your computer using lowercase Latin letters and dashes (-) instead of leaving blanks, when describing the product.
Example: red-women's-dress-silk.jpg
Compression and File Size (Weight)
This is the most critical factor. A photo taken with a modern cell phone is about 3MB to 6MB in size. In the e-shop, each photo **must not exceed 100KB to 150KB**!
Before uploading them to WordPress, use free online compression tools such as TinyPNG or the ILoveIMG. Just drag and drop your photos there, and the tool resizes them down to 80% without any loss of quality, and you can download them ready to use.
Use .jpg for all standard product photos. These files are much lighter. Use .png **Only** if your photo has a transparent background. If you upload a simple photo with a white background in .png format, it will be three times larger than the corresponding .jpg file for no reason!
[ Screenshot: The TinyPNG homepage with the drag-and-drop box ]
Entering Alternative Text (Alt Text) When Uploading
Once you’ve uploaded the finished image to WooCommerce, click on it in the “Media Library.” On the right side of the screen, you’ll see the field Alternative Text (Alt Text).
Write a short phrase in Greek there in a natural way (e.g.,. Red silk women's dress). This helps people with visual impairments, but it also helps Google display your images in the Google Images, bringing even more free traffic to your store.
At Skynetix, we often install special plugins that automatically convert your images to WebP (the new format required by Google). However, these plugins serve as a safety net and can’t work miracles if you upload a huge 10MB photo directly from a professional camera. Proper preparation on your computer is always essential!
[ Screenshot: The “Alternative Text” (Alt Text) field in the WordPress media library ]
Are you having problems with the speed of your online store?;
If you’ve uploaded hundreds of uncompressed photos in the past and your site is now running slowly, you don’t need to fix them one by one manually. At Skynetix, we can perform a complete Speed Optimization & Bulk Image Overhaul. We’ll clean up your database, bulk-compress all existing images, and set up advanced caching mechanisms, delivering an e-shop that “flies”!