Introduction to the Website Image Optimization Tutorial
How can I optimize the images on my website? If you’re a blogger, then you probably already know how important it is to add relevant, high-quality images to your posts. Photos, illustrations, and other images help make your content more appealing and break down blocks of text well. You should always use at least one image per post, and if your post is long, you should use multiple images. Images not only make your content more interesting, but they can also help you with on-page SEO. In this article, you’ll learn how to make sure that all the images you use on your website are in the file name, size, alt text (very important!). ), topic relevance, location, etc. have been optimized. If you prefer video tutorials, check out the following tutorial by Bjorn of WPLearningLab. WordPress Image SEO for Better Search Engine Rankings | WP Learning Lab In this comprehensive step-by-step tutorial, you’ll learn everything you need to know to properly optimize your website’s images for SEO. Let’s get started, shall we?
Choose the right image
Relevance is key: if you’re going to write a story about a puppy, use pictures of cute puppies.
How can I optimize the images on my website? Before you can start optimizing your images, you first need to find the right image for your post (or page). A good image will have the same theme as your blog post, helping to emphasize your writing and effectively enhance your reader experience. If you’re a decent photographer and are able to capture images that are relevant to what you’ve written, go ahead and shoot your own work. If not, just look online for images that match your written content. There are many websites that offer free image galleries that you can use, including:
- Flickr (Extensive Creative Commons Collection)
- pexels
- pixabay
- unsplash
- stockvault
- FREEIMAGES
- public domain archive
You can also use Google’s advanced image search and perform a variety of searches to narrow down your search: all of these words; This exact word or phrase; any of these words; None of these words. I usually just type my search term into all those word boxes and it seems to work just fine. Next, you can further narrow down the results by: image size; Aspect ratio; colors in the image; image type; Region; sites or domains; SafeSearch (you can use it to filter out explicit results); File types (.jpeg, . png、. gifs, etc.); Finally, there is the right to use. Under usage rights, you want to filter the results by “Free to use or share, even commercial” or “Free to use, share or modify, even commercial”.
How are website images optimized? This is a very useful tip for finding high-quality images that can be downloaded, resized, and used in blog posts. For some search terms, you may not be able to find images that you can freely reuse commercially. It really depends on what you’re looking for. Note: Before you reuse content found on your site through Google Advanced Image Search, check that its license is legal and read the full reuse terms. In some cases, the license may require you to provide credit (in the form of a link or otherwise) to the original image creator.
Choose the best file format
Image SEO Step-by-Step Guide: There are a few different file formats you can use when resizing images for the web. I almost always use JPEG or PNG files, but have also created several animated GIFs in my days. When choosing the most appropriate file format for your images, you should choose the one that makes the file size smallest. In general, JPEG files will be smaller than PNG files, but this is not always the case. My job: Using Adobe Photoshop, I resize an image based on the width of the content area of a post or page and select “Save for Web and Devices”. Once in that window, I switched between JPEG-High and PNG-24 and saw which one generated the smallest file type. For photos, JPEGs are always smaller and should be used. For graphic text or other images, PNGs are typically smaller.
Mix it up
How are website images optimized? When looking for website images (and often in life), try to keep an open mind. Don’t just look for photos, but try to mix them up by using various types of artwork on your website. Use the perfect combination of the following types of images:
- Illustrations, paintings, and drawings
- Charts, graphs, and tables
- Infographics or other graphics of your own design
- Animated GIFs
- Screenshots (these are especially useful for tutorial posts)
By changing the type of images you use, you can make your content more visually appealing and therefore more interesting to visitors (assuming your written content is of high quality).
Use a descriptive file name
How can I optimize the images on my website? When you save images for use on your website, you should take care to name them in a descriptive way. You want to make sure you use keywords that are relevant to the images and content you’re writing about. Keywords should always appear in a natural way, whether in file names, alt text, blog posts, or page titles. Never stuff keywords in any of your content as it won’t do anything good and may even lead to Google penalties. If you have an image of a smiling child, then naming the file smile-child.jpg is much better than simply keeping the original file name (e.g. _DSC0428.jpg). Make sure to separate words (name-your-file-like-this.jpg) with dashes when naming your files, as this dash is interpreted by Google (and Bing) as a space. Naming images accurately is one way to help Google find them more easily. This means that your website has better overall visibility in search engines. All of these optimized images add up to help your website run better.
Write subtitles when needed
You can also use headlines on images, but only if they are included to provide valuable information for your readers. When people go through your posts, they tend to look at the image and read the caption below the image. Make sure you use this opportunity to grab their attention by writing engaging, informative headlines for your images. Don’t worry about including a title for every image you use in your blog post. Some are for illustrative purposes only and absolutely do not require a title. For each image you use, consider whether the title will provide value to your site visitors. If the answer is no, then you don’t need one.
Website Image Optimization Tutorial: Make sure to use alt text
Alt text, or alt text for short, is a property that is added to HTML image tags. It appears inside the image container and helps describe the image to search engines when it can’t be displayed. Screen readers also use alt text to help visually impaired people navigate the internet more easily. The descriptive alt text (bold) in the following image links helps identify images from search engines (do people really use anything other than Google?). ） <img src=” https://mlgulxlroqec.i.optimole.com/5ojBCQs.2M5G~1aa2a/w:auto/h:auto/q:90/https://www.example.com/wp-content/uploads%20/babe-ruth-original-new-sepia.jpg”%20alt=”Add a sepia tone to an image in Adobe Photoshop” /> So, make sure to add descriptive alt text to the images on your website and include keywords in a natural way.
Pay attention to image placement
How are website images optimized? When adding images to your post, make sure to place them near relevant text content. I’m used to using multiple subheadings and placing relevant images near all of them. It’s a great way to split text and help make blog posts easier to read and more visually appealing.
Resize the image correctly
Image SEO Step-by-Step Guide: Website speed plays an important role in both SEO and user experience, so your website must be fast for visitors. Images play an important role in how fast your website loads, so make sure to size them correctly. If you upload images that are 4288 x 2848 pixels in size and display them to 600 x 400 pixels by adjusting the source code, it will severely slow down your site (and take up a lot of server space unnecessarily). Do your website visitors a favor and save your images at the right size to fit your content area. Since you’re using WordPress, all the images you upload are responsive by default. This means that you should resize your images based on the content width of your desktop site and will serve them to visitors on all devices, including tablets and smartphones, in smaller sizes. This is a great feature introduced by WordPress in version 4.4 to ensure that unnecessarily large files are not loaded on devices with smaller screens.
That’s what I did
I use Adobe Photoshop to resize my image, then select Save for Web & Devices and select jpg or png, depending on what type of image it is and which file type is smaller. I then use EWWW Image Optimizer to further compress my image files. It’s a free plugin that works well and even lets you optimize your images in bulk.
Compress files
How can I optimize the images on my website? Once the images are formatted properly, you can further reduce the file size by compressing them. There are a few different ways to do this, and since you’re using WordPress, you can simply use plugins. There are many different plugins available, including:EWWW Image Optimizer – This is my go-to for compressing image filesplugin, I highly recommend it. Any images you upload to your media library will be automatically optimized, and you can use their bulk optimization tool to compress any files uploaded before installing and activating the plugin. You can choose between different degrees of lossless and lossy compression, or even no compression. I don’t know why they don’t have a compression option, but I don’t use it and certainly don’t claim to know everything. Something is a mystery. Smush Image Compression & Optimization – WP Smush offers both free and premium versions. It also automatically compresses all images uploaded to your media library and has a batch optimization option that allows you to optimize 50 files at a time using the free version. The free version of WP Smush uses lossless compression, but if you purchase the pro version, you can use lossy compression (known as Super-Smush), which further reduces file size while minimizing image quality loss. Kraken.io – Kraken’s API allows you to optimize .png, . jpg and .gif files. In order to set up the plugin, you must first sign up for a free account with kraken.io. Once you’ve signed up, you’ll receive an API and key that you can use on multiple WordPress sites. Kraken’s default settings ensure that your images are compressed using Smart Lossy Compression, which is designed to dramatically reduce file size without drastically degrading image quality. You can manually enable lossless compression in the settings. Compress JPEG and PNG images – Unlike the other plugins already mentioned, this one only offers lossy compression methods. It doesn’t offer many configuration options in the settings, but it allows you to choose the maximum resolution for the uploaded image and choose exactly the image size you want to compress (e.g. thumbnail, large size, etc.). In addition, you can choose to keep some of the metadata associated with the image, including copyright, creation date, and GPS location. This is not recommended because this information increases the file size, and the whole idea behind compressing images is to make them smaller, not bigger (nonsense). Why should I compress my website images?
- Your website pages will load faster and delight your visitors. Faster website speeds can also increase revenue, especially if you’re running an eCommerce store.
- Site backups will take less time due to smaller file sizes.
- You’ll save 100 kilobytes per image, so you’ll use less bandwidth.
Please note: Lossy image compression methods will help you create smaller file sizes, but you’ll need to compress some images to check image quality before batch optimizing your entire media library. Make sure that the image quality is good enough for your needs and that there are no obvious flaws in the compressed file. In addition to the plugins I mentioned above, you can also use a variety of online image compression tools, including:
Summary of the website image optimization tutorial
- ImageResize.org
- TinyPNG
- compressor.io
- ResizeMyImg
As you learned in this image SEO step-by-step guide article, optimizing images for SEO involves many steps and things to consider. Take the time to properly prepare images on your website and let search engines easily index them. How can I optimize the images on my website? In summary, here are a few things you need to keep in mind:
- Choose the right image type for your content.
- Choose the correct file format (JPEG, PNG, or GIF).
- Use a unique mix of images (photos, illustrations, charts, infographics, etc.).
- Use a descriptive file name with keywords and dashes between each word.
- Insert image captions, but only if they add value to the reader. You don’t have to use them all the time.
- Make sure to enter alt (or alt) text for the image. Interpret images with keywords in a natural way. Never stuff keywords anywhere!
- Keep image placement in mind. In a short post, place the image at the top. If your post is long, consider placing an image near each subheading.
- Resize the image based on the content width of the post/page. Don’t upload large files just to display them in a small size.
- Use a plugin or online tool to compress your image file and make it smaller.
I hope this article has provided you with useful information that you can use to easily optimize all the images on your website. Don’t stop there, make sure you optimize all of your site’s posts and pages for SEO as well. Follow this WordPress SEO checklist to get started. If you have any questions or comments, please leave them below. I will do my best to help you.
