Uncategorized
September 28, 2020

Optimizing images for your website: a guide for customers

We always strive to provide sites with clear quality images on all devices, ensuring each user’s engaging experience. Our design and development gurus have collaborated to produce the following article to help us achieve this goal. Based on the image-related questions they receive most from our clients, we offer some key ideas to help you make the most of your images and the overall website development experience. When it comes to your images, don’t be lazy to spend the extra time getting them right, this will help you achieve long-term professional results and a website that effectively converts users into customers.

Q. What Size Should My Images Be?

A. Providing your images in the most optimal ready-to-load format can not only save a lot of time back and forth in the development process but will help ensure that you achieve the desired result in terms of visual effect. It is also an important factor in considering further development if you plan to upload images to the website.

One of the most important aspects to consider is what the image will be used for, or more importantly, where it will be used. For example, is it a cover image, a banner, or perhaps a thumbnail or icon? A smaller image, taken on an iPhone, may look good in some areas of your site, but it probably won’t work as an enlarged image.

As a general rule, be sure to provide images to your development team in the highest resolution format possible, so that they can be resized appropriately for loading. At a minimum, you will want to make sure they are the exact size they should appear on your site. If they are smaller, they are likely to be too blurry or pixelated to use.

If you are managing the upload, we recommend a file size of less than 600 KB and dimensions in a range between 1500 and 2500 pixels wide for best results.

Q. Will My Images Affect The Upload Speed Of My Website?

A. Here is a rule – the larger the image size, the higher the display quality. However, it is crucial to keep in mind that uploading files that are too large can have a negative impact on the loading speed of your website. In turn, your users are likely to lose patience and generally leave your site. Compliance with the above file sizes and dimensions will help you avoid problems in this area.

Q. How Should I Save My Image Files?

A. When you deliver your image files, please make sure that your images are saved as a .jpg (for photos) or .png (for graphics) file, and remember that the following is not recommended to use for images in website designing

.pdf

.pds

.tff

.Doc

Image names can act as alternative text on your site where no other text is provided, and help search engines determine what the image is about, making it more likely to appear in search results.

Give your files clear, descriptive, short names (usually eight words or less) that make it easy for others to reference and adhere to simple letters, numbers, underscores, and hyphens. Try to avoid using unauthorized characters as question marks or percentage signs, as these can be incorrectly loaded or cause unexpected gallery behavior.

For example: if the name of your image is IMG_00345.jpg, change it to something descriptive like red-cotton-jumper-01.

Q. Should I Consider Things Like Orientation Or Aspect Ratio?

A. Providing images with a constant aspect ratio (height:width) is not essential, but it can help make development work easier as it will be much simpler to understand how the images will be cropped. You can also pay extra attention to image rotation rules whenever it’s necessary to make sure they are oriented the way they should be visible on the website.

Q. Why Have My Images Been Cropped?

A. It is highly recommended that some of the images you display on your website will need to be cropped to fit into the available space. This is particularly relevant when it comes to your mobile design. For example, a large banner image on your desktop design can be cut in half its original size to fit correctly on a mobile screen.

Q. How Should I Supply My Logo Or Similar Graphics?

A. When supplying your logo or similar graphics files for use on your website, they must be provided as vector files. Vector images are independent of zoom and resolution, which means that quality and clarity will be maintained no matter what size the graphic displays throughout the site.

Conclusion  

Do not underestimate the importance of the size and quality of the images you upload to your site. Poor quality images on your website may devalue your brand and services or cause your site to load so slowly that users won’t even get to the page they were looking for in the first place.

When it comes to your images, do not be lazy to spend extra time on their proper design, it will help you to achieve long-term professional results and a website that effectively turns users into customers.