Today I bring a trick for bloggers to improve the image quality in their blog posts. I am not talking about optimizing the images, but I am talking about the quality of the images which normally distort after uploading the pictures in blog posts. Blogger’s image uploader never shows up the images in their original size we wanted it to be. And if we try to resize it, then it lost their quality. I found a solution that will help us to maintain the quality of images we upload to our blog posts. Let’s learn this trick practically. But before I start the tutorial, you may be interested to check a demo of the difference you can get after applying the trick on your blog.
Before
After
Have you noticed the difference in both the images? This is what we normally face in blogger. So, it’s time to learn how we can improve image quality in blogger.
Improving Image Quality in Blogger Post
The reason of poor quality is high compression ratio which is used to create the thumbnail. Once we insert a picture in our blog post, we have several options to resize it like Small, Medium, Large, X-Large and Original Size. But I like to resize it manually in HTML. Follow below steps to improve quality of your images in blogger.
- Upload an image in blog post.
- Now switch the post editor view to HTML mode.
- Search for the image source code something like below.
- The above source code is the URL of a thumbnail and if we try to resize it, then it will lose its quality. To gain image quality back, simply delete s320/ from the image source code. Deleting this code will force the browser to display a scaled image with high definition.
- If you want to display image in its original size, then simply edit its height and width.
- That’s it.
<img src=”https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilsJJQx0U3rD01L5WIFQmoECDra929esUsiyPi2We9HoRqc8KvUcNTdmk75iYveh_2ibw_M22jh7CeZ0gg0YzzHxsUWQH2Ut56f6G6w-5Qfp_dxbKCVsR6N7vv1SA69v6WDAhiI0_kSTOt/s320/image-quality.jpg” height=”120″ width=”320″ />
0 comments:
Post a Comment