How to prepare your images for website?
30.01.2022 20:00

If you work with content that lives on the Internet, you’ve probably given a significant amount of thought to the overall look and feel of what you’re creating. Text and visuals go hand-in-hand, and if one part doesn’t work, the whole project can look a little off. In this article, you can find 3 main things you have to concentrate on while working with images for web. Start learning about image optimization for web content below!

1 Choose file type

Depending on the type of image that you want to place on your site, you have to use different file types. Each has unique qualities that make it appropriate for specific scenarios and make images smaller in size. JPEG is most suitable for digital photography compression. If you are working with pixelated images: your portfolio or photos for your brand, it is best to use JPEG. PNGs are commonly used on the Internet for vector illustrations. If you don’t have a lot of colors and need transparency PNG is your go-to.

2. Size and Optimization

Whether you have a business website, portfolio, or online store, it pays to optimize each image you upload. Load times should be the most important thing on your mind when crafting anything for web. Most of what affects page load times is rooted in issues with images — especially the size of the images. Unoptimized images slow down websites. Slow websites = bad user experience, lower chances to rank in Google searches, and ultimately fewer inquiries and customers.

Before saving an image you need to know the correct size. For example, if your site has blog posts that are 800 pixels wide, you’ll want to adjust your images to make sure they’re also 800 pixels wide. More is unnecessary. It’s also important to monitor the number of kilobytes in your image. When you are working in Photoshop always use the “Save for Web” option. You can adjust the quality of the image and set the file size. It is best to find a middle ground between these two. Less than 250K is usually safe. If you don’t have Photoshop you can use online image optimization sites, like TinyPNG.

3. Naming Your Images

Every image that goes on your site needs a name if you want your page to rank well on search engines, which crawl your site not just for text, but also for keywords on images. When it comes to naming your images, think about how you would search for the image. Use simple detailed terms that describe it and separate each keyword with a hyphen, so that from an image name you can easily understand it.


a question?

Have a question?

Leave a message and we'll write you back.

Svit One - tools for business Made in Svit