Thread Rating:
  • 0 Vote(s) - 0 Average
Share Thread:
How to you guys Optimize your Image posts?
#1
How to you guys Optimize your Image posts?
#2
Start with high-quality images
Use the right file type: JPEG or PNG
Resize images to optimize page speed and appearance
#3
When optimizing images for the web, your goal is to reduce the file size as much as possible, without sacrificing too much in terms of image quality.
#4
Start with high-quality images
Use the right file type: JPEG or PNG
Resize images to optimize page speed and appearance


Newspaper Ad Agency in Delhi
#5
Tips for image optimization are:

Always use Alt tag with images. The alt tag is most probably the most important image optimization factor. The text in the alt tag is displayed in place of the image if the image can not be shown or take time to load.

Image size is also very crucial factor for optimization of image. Because images can make your page heavy.

Add link to images and remember to use a title tag whenever linking your images.
#6
I usually optimize all images for the article before uploading to server. I'm using this site to optimize images: compressor.io

Hope this helps!
#7
Share images in various social profiles and use alt text in your images to help optimize them better in search engines. Use proper optimization techniques will help to rank your images higher in search engines.
Cheapest VPS | $1 VPS Hosting
Cheap Dedicated Servers | Free Setup and IPMI | Unmetered Bandwidth
#8
The primary goal of formatting your images is to find the balance between the lowest file size and an acceptable quality. There is more than one way to perform almost all of these optimizations. One of the most popular tools ways is to simply compress them before uploading to WordPress. Usually, this can be done in a tool like Adobe Photoshop or Affinity Photo. Some of these tasks can also be performed using plugins, which we will go into more below.

The two primary things to consider are the file format and type of compression you use. By choosing the right combination of file format and compression type you can reduce your image size by as much as 5 times. You’ll have to experiment with each image or file format to see what works best.

Choose the Right File Format
Before you start modifying your images, make sure you’ve chosen the best file type. There are several types of files you can use:

PNG – produces higher quality images, but also has a larger file size. It only uses lossless compression.
JPEG – uses lossy and lossless optimization. You can adjust the quality level for a good balance of quality and file size.
GIF – only uses 256 colors. It’s the best choice for animated images. It only uses lossless compression.
There are several others, such as JPEG XR and WebP, but they’re not universally supported by all browsers. Ideally, you should use JPEG (or JPG) for images with lots of color and PNG for simple images.

Compression Quality vs Size
Here is an example of what can happen you compress an image too much. The first is using a very low compression rate, which results in the highest quality (but larger file size). The second is using a very high compression rate, which results in a very low-quality image (but smaller file size). Note: The original image untouched is 2.06 MB.
As you can see the first image above is 590 KB. That is pretty large for one photo! It is generally best if you can keep a webpage’s total weight under 1 or 2 MB in size. 590 KB would be a fourth of that already. The second image obviously looks horrible, but then it is only 68 KB. What you want to do is find a happy medium between your compression rate (quality) and the file size.

So we took the image again at a medium compression rate and as you can see below, the quality looks good now and the file size is 151 KB, which is acceptable for a high-resolution photo. This is almost 4x smaller than the original photo with low compression. Typically simpler images like PNGs should be under 100 KB or less for best performance.

Lossy vs Lossless Optimization

It is also important to understand that there are two types of compression you can use, lossy and lossless.

Lossy – this is a filter that eliminates some of the data. This will degrade the image, so you’ll have to be careful of how much to reduce the image. The file size can be reduced by a large amount. You can use tools such as Adobe Photoshop, Affinity Photo, or other image editors to adjust the quality settings of an image. The example we used above is using lossy compression.

Lossless – this is a filter that compresses the data. This doesn’t reduce the quality but it will require the images to be uncompressed before they can be rendered. You can perform a lossless compression on your desktop using tools such as Photoshop, FileOptimizer, or ImageOptim.

It’s best to experiment with your compression techniques to see what works best for each image or format. If your tools have the option make sure you save the image for web. This is an option in many image editors and will give you the quality adjustments so you can perform optimal compression. You’ll lose some of the quality, so experiment to find the best balance you can without making the images ugly.
Image Optimization Tools and Programs
There are a lot of tools and programs out there, both premium and free, that you can use to optimize your images. Some give you the tools to perform your own optimizations and others do the work for you. We are personally big fans of Affinity Photo, as it is cheap and gives you almost identical features to that of Adobe Photoshop.

Resizing Images to Scale

In the past it was very important that you upload images to scale and not let CSS resize them. However, this is no longer as important since WordPress 4.4 now supports responsive images (not scaled down by CSS). Basically, WordPress automatically creates several sizes of each image uploaded to the media library. By including the available sizes of an image into a srcset attribute, browsers can now choose to download the most appropriate size and ignore the others. See an example of what your code actually looks like below.
So with more and more HiDPI displays nowadays, it can be good to find a happy medium. Say 2x or 3x your website’s column or div size, but still less than the original size. The browser will show the correct one based on the resolution of the device.

The WordPress media library creates thumbnails based on your settings. However, the original is still retained and untouched. If you want to resize your images and save disk space by not saving the original, you can use a free plugin like Imsanity.
#9
Use the right image
Optimize your images for the web
Use informative file names
Pay attention to alt text
Separate your thumbnails from main pictures
Create image sitemaps
Don’t rely on third-party image hosting
#10
Tips for image Optimization are:

Try to Place Alt Text because the ALT Text will appear in the place of image if the page or image takes time to load, and the search engines cant read / crawl images so they will crawl alt text and description.


Try to place HD images and select JPEG or PNG formatr images.

Try to compress / optimize the images so that the page can load faster.


Forum Jump:


Users browsing this thread: 1 Guest(s)
[-]
Ad

[-]
Top Articles
100+ Social Bookmarking Sites List
55+ Image Submission Sites List

[-]
Recent Posts
What is the Best Tool for X?
looking for paid options?smartscraper — 10:47 AM
What is Link Baiting?
Link baiting is a strategy for creating pages and digital content that attract natural, h...Alex Jones — 04:32 PM
ClickDealer - Join the Leaders of Affiliate Marketing!
If you want to break your monthly revenue records, start setting up a Temu campaign right...ClickDealer — 04:25 PM
What are the top digital marketing tools..?
Google Analytics - Ahrefs - Mailchimp - Semrush - HubSpotAlex Jones — 04:01 PM
What is the Best Tool for X?
What is the Best Tool for X auto posting and auto follow back?Alex Jones — 03:58 PM

[-]
Follow us on Facebook