Image best practices.
A big factor in site loading time/site speed are your images (and other types of media). They can also affect UX (User Experience) and SEO. Here are some basic image optimization practices that you should follow–being consistent with this checklist will make a huge difference in how people interact, how your business is portrayed, and how your site functions.
Picture Perfect
Choose images that are on-brand, professional, and high-res. That’s a given, right? These can be images you’ve taken, you’ve purchased the rights to use, or the amazing head-shots or action shots by the professional photographer you hired.
Big take aways here are that 1) You have obtained the rights to use on your website or else where; 2) The images are high-res, professional looking, and on-brand.
Photo Sourcing:
Crop & Size
Use appropriately sized images. Meaning, don’t use a 2,500 pixels wide image if you only need the image to be 400 px wide (for a certain spot on your site). Not only does this help with site optimization, it also helps with image rendering.
Photo Cropping Tools:
File Types
Save images in the appropriate format. PNG for times when you need a transparent background, or JPG, WEBP, (convert to/from WEBP), and SVG for logos or other graphics (you may need to install and activate the “SVG Support” plugin).
Naming
Name images appropriately. Give them names that describe exactly what the image contains. Something that makes sense using SEO-friendly names such as “chateaubleu.jpg”; not file12345.jpg. Bonus: Helps with organization and with accessibility.
Optimizing
After you’ve sized/cropped as needed, run your images through an image optimizer such as ILoveImg.com, Shortpixel.com, TinyPNG, or Squoosh.app.
This will help to make sure your site size size stays under control. Images you add to your site (in most cases) should no larger than 240kb max.
Bonus tip:
Once you’ve added your images to your website, don’t forget to add descriptive Alt Text explaining what the image or graphic is about. Full sentences are fine. This is important for accessibility (screen readers) and your SEO. Example: “Two dogs chasing a ball at the dog park”.
Pretty as a picture.
Your images tell a story. Using image finesse (next level best practices) can boost visibility, guiding search engines through your content, provide visitors with a first impression, and help ensure that everyone can experience your visual wonders. It’s the key to inclusivity.
Ready to “Next-Level” your website’s images, design, functionality, and more? Let’s chat!
À bientôt !
Janet
EVALUATE YOUR WEBSITE CONVERSION POWER
Website Audit Checklist: 4 Essential Elements For A Website That Converts
Use with this simple, but comprehensive checklist to help you identify where improvements are needed and help your site work to its full potential!
Hi, I'm Janet
Web designer, developer, and digital strategist for growing businesses. Learn more about how I can help you keep moving forward with a transformative, conversion-focused website that works wonders for your business and helps you go from stuck to strategic.