In posting an article, you certainly won't be far from the business of photos or pictures. Because images also really support the blog so that it can look prettier.
What is the size of a good and ideal blog post image? Does it have to fit a certain size and dimensions? Does the length and width have to follow the rules? Alright, I'll review a little about the best image formats and sizes for blog articles.
Usually novice bloggers rarely care about this problem, as long as there is an image that fits and is appropriate then it will be uploaded directly to the blog. Regarding the size of the blog post image for recent affairs, as a result the image will look untidy and if it has a large size it will slow down the loading of the blog itself.
Also pay attention if you are going to take a picture on the internet and post it for a blog, make sure the image is copyright-free so that no party claims ownership of the image. Even better if we use our own image.
What is the ideal image format?
There are various types of image formats available such as JPEG (JPG), PNG and GIF. Mostly, we use JPEG file format but sometimes we tend to use PNG and GIF as well.
- JPEG Format – The JPEG format is best used for digital photography blogs and this is the most widely used format because it displays images in the form of photos, but it is also often used for blogs and portals other than photography. Examples of blogs that use the JPEG format a lot are travel blogs, travel blogs, recipe blogs and so on.
- PNG Format - The most widely used PNG format on blogs in general, because this type of PNG image format can be edited and compressed to the lowest size (around 70%) without reducing the quality of the original image. The PNG format is usually used for blogs that prioritize performance and loading speed, such as tutorial blogs.
- GIF Format – This type of format usually supports small image sizes, such as logos and the like.
What size should images be for Blogger blog post?
We can adjust the post image size (dimensions) according to each blog template, while the most ideal sizes are as follows.
- Template 1 Column Can use a photo or image with a size of 700 x 360 pixels or 600 x 400 pixels
- Template 2 columns Can use photos or images with a size of 600 x 400 pixels or 600 x 320 pixels
- Template 3 columns Can use images or photos with a size of 300 x 250
What if the image dimensions don't match the sizes above? We can edit the image using an image editor software such as Photoshop or Microsoft Office Picture Manager or other image editor software, make the size according to your template.
What is the ideal size for images?
Before we upload images in blog posts, it would be nice if the images were compressed first. So as not to make the blog loading slow. We can overcome this method through an image compression tool, the ideal image capacity size is 65 – 115 kb. But if possible for a smaller size, the better, as long as the image is still clear.
This is a simple explanation of the ideal blog post image size, besides that we can optimize images so that they are SEO friendly and easy for search engines to track. Photos or images generate nearly 35% of searches on search engines, by utilizing and optimizing images, it will also increase traffic/visitors to our blog.
Title and Alternate Text
One more thing, after editing the size of the photo, also edit the name of the photo file. What used to be IMG.JPG or DSCN.IMG, for example, change it to --for example-- landscape.jpg or write.jpg, according to the condition of the photo and relevant to the title, topic or keywords of the blog post.
Also, after uploading, don't forget to "click" the uploaded photo, then click "Properties". Fill in the "title" and "alt text" fields. You can fill it with copy and paste the post title.
Thus a review of the correct photo or image size for a blog or website. First, edit the file name and image size, then install the image.
How do I make an image resize automatically in HTML?
Alright, just go straight to the tutorial, as usual, please log in to the blogger home page. After logging in, go to your blog's homepage and open the edit html menu. On the edit html page, please find the code below:
]]></b:skin>
If you found the above code, please add the css code below just above the ]]></b:skin> code then save your template settings.
.post img { vertical-align:bottom; max-width:100%; max-height:100% }
After the settings are saved, please create a new post and upload an image with dimensions above 900px or that exceeds the page width of your blog post. Then change the size to x-large then preview and see what happens. Yep, the image is right in the middle of the post with 0% left and right margins left.
Then try changing the size of your image to the original size and preview, how about that? the image remains in the center, not even though the setting is original size. If you change the image size to large, normal, and small, the image will be smaller, but the maximum image limit will still be 100% (right and left remaining 0% respectively).
I have set the image above with a width of 100% in CSS so you can change the numbers in the width and height as you wish, I used the number 100% because the width matches the blockquote in this template.
That's the simplest, most effective and easiest way to deal with image sizes in blog posts, I hope this article can be useful and useful. Press ctrl + d to bookmark this page, don't forget to read other interesting articles.