There are several key components that help create a successful website. Everyone is familiar with the basics: clean and simple navigation, readily available contact information, responsive design, relevant content, and site speed. However, one of the biggest things that many site owners overlook is the quality of their images. While it is often the content that attracts a user to your site, they will quickly make a decision to remain on your site within the first 10-20 seconds of viewing.
If they like what they see, they’ll give in to their curiosity. If they don’t like what they see, you may have lost a potential customer for good. You may have even drilled into your conscious mind that well-written content is what grabs the attention of users. In part, that’s true. However, without compelling visual elements their attention may be directed elsewhere—and elsewhere will usually not be on the same site. So, your website visual elements will have to walk a fine line between being helpful or abusive.
The Hate-Love Relationship of Website Images
Load-time, otherwise known as “site speed,” is important when considering website architecture. It’s critical, no matter what device is being used to search the Internet. Most people are unaware that stock photos are images that aren’t optimized for regular websites. While the images may be high-quality, they are often large and heavy. “Heavy” is often determined by the sheer number of image pixels.
Possible Reasons Why Images Are Slowing Down Your Website
Heavy images take a long time to load. The chances are you’re well aware that people hate images that take all day to load. There’s just a natural assumption, on their behalf, that a responsive website already has these elements under control.
Your image dimensions may be off. Image scaling is important. An image that is 1000 x 1000 pixels, even scaled down to 100 x 100 pixels, may cause a user’s browser to load ten times more than necessary. Complex file formats can also make life difficult for users. Of course, some file formats are naturally larger than others. It’s easier for browsers to load JPG, PNG, and GIF images quickly. However, heavier formats like BMP and TIFF can eat up huge chunks of load time. Graphics, visuals, that contain text may take longer to load compared to those with simple fonts.
Possible Solutions for Fixing Images
1. Make it a point of downloading smaller versions of images and save your images in Photoshop with an option of “saving for the web” if possible.
2. Consider a plugin that allows you to automatically compress your images.
3. You can also specify any image sizes that you want loaded in your CMS. A developer can also accomplish the task if its beyond your pay grade.
4. It may also be best to avoid using text graphics. Rather, position text with CSS over the image. This is good for both SEO and load time.
Tip: Read Optimizing Images for SEO and User Experience to dive deeper into this topic.
Optimize Your Images for Windows Computers
The goal of formatting images is to always find the balance between quality and the lowest file size. Compress images before uploading them to your website. You can also go the route of using image sizing software. There are some excellent software products on the market which include the following for Windows:
- NX Power Lite Desktop 7 – Optimize your JPEG images along with Word, PowerPoint, and Excel documents. The software reduces images considerably and allows for the balance of quality and compression ratio.
- Compressor.io is an online tool that allows you to choose between two types of compressions: lossy or lossless. Use lossless to optimize your photo’s size and to maintain image quality. Lossy will compress photos well enough, but you may lose image quality. Lossy works well with PNG, SVG, GIF, and JPEG images.
Optimize Your Images for Mac Computers
Squash for Mac also takes into consideration that images need to load fast. Squash can also help reduce the size of images in files that you send. There are numerous people unaware that some Internet hosts will reject large attachments in email. If you need to send a PSD file to a client but cannot launch Photoshop, no problem. Drop the file into Squash and it will convert immediately for you to send. If you enjoy using Twitter or Facebook, Squash will quickly compress and upload your files.
Page loading time is important for users, but it’s also important for search engine ranking. All too often site owners allow the element of site speed to slide, all in the hope of accommodating a more attractive site design. Stay on point and make sure that your website images aren’t chasing business away.