![steemitpost (1).png](https://steemitimages.com/DQmScAnQdRTF3DVoPe6PEd1KqSHSAHJkbXWu23Wy8rYdqwK/steemitpost%20(1).png) In this Post, we're going to discuss some Beginner Tips to consider in order to get the most optimized Steemit Post’s thumbnail ____ **Thumbnails** are reduced-size versions of pictures that are used as display on Steemit’s Homefeed. In the age of digital images, visual search engines and image-organizing programs normally tend use thumbnails, a term also used by graphic designers and photographers for a small image representation of a larger image

Optimized Steemit Post Thumbnail

Images directly uploaded on Steemit will be optimized for display, so specification like Image Dimension are important for automated customization since a Thumbnail is generated from a picture, which makes it even more important to use one that is the right size *After playing around with Steemit’s Post, I discovered that some sizes or Dimension are a better fit as a Thumbnail* ![steemitthumbnaildimension800x460.png](https://steemitimages.com/DQmQ1pw2RBi3LqmF6pUHTzb5u1BgfQZEs81E6hghwCLH9fw/steemitthumbnaildimension800x460.png) From my finding, the Size dimension of 800(Width)X460(Height), seems to be the minimum dimension to consider for a optimized Thumbnail. However it's not perfect, using photoshot to zoom in you'll notice that there is still a grey area boarder around the Thumbnail, there seems to be a 1 Pixel grey border using the hexadecimal color # EEEEEE. The Grey Boarder may only visible on a large enough screen, or for those with a sharp eyesight. Many may not actually noticed this and I personally don't noticed a grey boarder on mobile devices as screen's tend to be to small to display such fine detail ![download.png](https://steemitimages.com/DQmTiNdafbSeMCqagJiqrr5rWQcgQxKwWG8pai9FMU7SLiH/download.png) *It should however not be visible to the naked eye, by getting the dimension right you can minimize the shaded grey boarder* What about higher resolution images? In general, the larger the sensor, the larger your pixels, and the larger the pixels, the more light you can collect so usually the more pixel the better quality of the image. The more light you can catch, the better your image can be however since Thumbnails are generally small, you won’t notice such a big difference but I would definitely recommend using 1680 X 1292 dimension for larger Pictures ![THUMNAILSTEEMIT.png](https://steemitimages.com/DQmPsD6zeWNexDCsCuvDCdgZ354TfbqxiwPw6AYXy33wjSL/THUMNAILSTEEMIT.png)

Steem Post Thumbnail Tips

- The First Image used in the Post will end up being your Post Thumbnail - Thumbnail image should always be Horizontal - Image under 800 Width will be displayed according to it’s Size - Image above 800 Width will automatically become optimized to fit - The thumbnail also has a 1 Pixel Grey border - Editing your Thumbnail is possible, within 7 Day Post Period - Transparent Images will end up with Grey Background (Use JPG. with white Background) ______

The thumbnail image should always be horizontal (meaning that it is longer than it is taller)

Because Vertical images tend to not show properly as a Thumbnail when displayed on Steemit’s homepage. When uploaded to Steemit, Vertical will be optimized to fit the Thumbnail resulting in usually a cropped out image.

While horizontal images aren't quite spot on, Vertical Image are likely to become a problem because as you’ll noticed by now on Steemit, is that Post Thumbnails will be adjusted to the height of the image accordingly, resulting in cropped out Pictures

From experimenting around, I noticed that higher segments of a vertical image are used as Display

______

Steemit Thumbnail Result:

![vertical.png](https://steemitimages.com/DQmUn92Wr9E7Sr1Pqqu997kbNZzmsp6XyCMBFsFUMDHPQUu/vertical.png) For those completely new to Steemit, the 1’st Image used in the Post will end up being your Thumbnail, this is by default setting. This makes your first picture the most important as it will become the image header, so make it count by editing it. (There used to be Method to pick a Thumbnail among the various Images uploaded via a Post, if you do know this Trick leave a Comment below to Help others out) **Note:** If you rearrange 1st Image later on via Post editing, it will also automatically update the Thumbnail. This mean you can change your Thumbnail, if you decide to do so (for as long Post Editing is available: within 7day payout period) ![resolution.jpg](https://steemitimages.com/DQmbuDkcmbwwP12ZusY1Ro3xQgiYvHrQkyxFxiHugU3eeB8/resolution.jpg) Basically, if you’re planning on inserting an image, any picture that is automatically under 800 Pixels in Width will be posted without optimization. Meaning that any image that is measurement from side to side with less than 800 Pixels, will result in it being posted according to it’s size, so you’ll end up with exact dimension of your small picture, this applies to both the Post and Thumbnail Hence why, small & low resolution images are displayed on Steemit according to their size unlike large images that get automatically optimized. Using small pictures as your Thumbnail will create empty/unused space in your Image which would be default turn to a grey shaded area https://cdn.shopify.com/s/files/1/0070/7032/files/Top_Image_Optimization_Tips_Shopify_Blog.jpg?711 But if you insert a image more than 800 Pixels in width, Steemit Editor will automatically fit the optimized version but it does not crop or reduce the capacity of the image. For small screens, Steemit automatically downsizes larger images. This means that you don’t need to worry too much about end-result when cutting up the Thumbnail image, since Steemit will deliver a smaller image than your original to Mobile devices Also, try not to use Transparent Images (PNG) because Steemit won't recognize it and will replace transparent background with a grey one. If you wish to feature a Transparent Image, just upload it with a white background by simply saving it as JPG. File format ![Grey Silver.png](https://steemitimages.com/DQmU2XbQYctCFDtjUaw4rUxcBbBEfi9BDaMk2Y5h15Tu5DJ/Grey%20Silver.png) *Like it or not the thumbnail image on the Steemit Homefeed plays an important role on Steemit when it comes to grabbing the attention of many of the users* Don’t end up like some Users who treat Steemit like Reddit or Twitter, by posting content without use of Visual Content to capture the Audience attention. Not using any images will result in No Thumbnails, which makes your post less visually appealing on the Homefeed among the thousands of Blog Posts https://blog.algorithmia.com/wp-content/uploads/2016/10/smart-thumbnail-cropping-1.jpg *The number of users is constantly growing as it’s bound to become the World most popular Decentralized platform that rewards it’s users, so it actually pays to know how to fully edit your Posts* Steemit thumbnails are like book covers of the online world. Our decision whether to click on a Post often comes down to its thumbnail: an eye-catching image draws us in, while a boring or blurry one puts us off. # Do your best to create a Post Thumbnail that seals the deal by getting attention of Steemit's growing Audience 😎 _______ ______ ______

About @Steemitguide

[![FireShot Capture 444 - SteemitGuide (@steemitguide) — Steemit - https___steemit.com_@steemitguide.png](https://steemitimages.com/DQmboA3Ap4ur9oBXk79QP943uQvRwhoyMXdzqLp3rDEfpG9/FireShot%20Capture%20444%20-%20SteemitGuide%20(%40steemitguide)%20%E2%80%94%20Steemit%20-%20https___steemit.com_%40steemitguide.png)](https://steemit.com/introduceyourself/@steemitguide/crowdsourced-marketing-with-steemit-a-more-detailed-introduction-post-about-steemitguide-a-dedicated-malaysian-steemian) [![FireShot Capture 445 - SteemitGuide (@steemitguide) — Steemit - https___steemit.com_@steemitguide.png](https://steemitimages.com/DQmZmZA9AUb6bJtXooK1SiEBZswwde11jor5o6Rryce9iMm/FireShot%20Capture%20445%20-%20SteemitGuide%20(%40steemitguide)%20%E2%80%94%20Steemit%20-%20https___steemit.com_%40steemitguide.png)](https://steemit.com/steemit/@steemitguide/steemit-s-1st-south-east-asian-guest-house-to-accept-steem-dollar-and-steem-we-support-a-sharing-economy-and-you-should-to-book)

More Markdown & Educational Post

[![download.png](https://steemitimages.com/DQmWHigpjjvMZzWUdhGBUc6D26VT5HsVGuXNv8Box2hCEML/download.png)](https://steemit.com/steemit/@steemitguide/how-to-make-pictures-clickable-using-markdown-by-learning-to-embed-images-with-websites-url-links) [![FireShot Capture 438 - SteemitGuide (@steemitguide) — Steemit - https___steemit.com_@steemitguide.png](https://steemitimages.com/DQmYiJsmit5t1Ar4LkkMWF13hrPwAYPbeHEEjz1HjNujR9m/FireShot%20Capture%20438%20-%20SteemitGuide%20(%40steemitguide)%20%E2%80%94%20Steemit%20-%20https___steemit.com_%40steemitguide.png)](https://steemit.com/steemit/@steemitguide/editing-basic-fonts-steemit-markdown-beginner-level-1-learn-how-to-style-your-font-with-headers-bold-and-italic-text) [![FireShot Capture 441 - SteemitGuide (@steemitguide) — Steemit - https___steemit.com_@steemitguide.png](https://steemitimages.com/DQmVUHpPETJHJ75D6SzymGVgbhjvojV9FWA23eXjjmJbMcV/FireShot%20Capture%20441%20-%20SteemitGuide%20(%40steemitguide)%20%E2%80%94%20Steemit%20-%20https___steemit.com_%40steemitguide.png)](https://steemit.com/steemit/@steemitguide/a-complete-guide-on-steemit-permission-keys-posting-owner-active-memo-digital-passwords-with-unique-functionality-that-allows) [![FireShot Capture 440 - SteemitGuide (@steemitguide) — Steemit - https___steemit.com_@steemitguide.png](https://steemitimages.com/DQmcDenN66qpPVreDfo74dtuprzNsqp6qjU6ZzY5H5ftmsy/FireShot%20Capture%20440%20-%20SteemitGuide%20(%40steemitguide)%20%E2%80%94%20Steemit%20-%20https___steemit.com_%40steemitguide.png)](https://steemit.com/steemit/@steemitguide/become-an-expert-at-monitoring-your-financial-activity-on-steemit-by-using-handy-tools-to-keep-track-of-your-steem-steem-power) [![FireShot Capture 446 - SteemitGuide (@steemitguide) — Steemit - https___steemit.com_@steemitguide.png](https://steemitimages.com/DQmRvcwxqG9ruFrZymaTvjJDt7C4EHGCGKKn1hE7oMrwSiu/FireShot%20Capture%20446%20-%20SteemitGuide%20(%40steemitguide)%20%E2%80%94%20Steemit%20-%20https___steemit.com_%40steemitguide.png)](https://steemit.com/steemit/@steemitguide/how-to-contruct-a-2-or-3-column-table-using-steemit-s-raw-markdown-editor-tutorial-and-codes-for-beginners) [![FireShot Capture 443 - SteemitGuide (@steemitguide) — Steemit - https___steemit.com_@steemitguide.png](https://steemitimages.com/DQmSXxjDz21oLoFeFmprp58GynVmXwX5GccirD2EbttNWPn/FireShot%20Capture%20443%20-%20SteemitGuide%20(%40steemitguide)%20%E2%80%94%20Steemit%20-%20https___steemit.com_%40steemitguide.png)](https://steemit.com/steemit/@steemitguide/how-to-add-gif-using-steemit-s-raw-markdown-editor-and-more-guides-and-tutorials-to-help-you-edit-your-post-like-a-pro) [![FireShot Capture 448 - SteemitGuide (@steemitguide) — Steemit - https___steemit.com_@steemitguide.png](https://steemitimages.com/DQmd9LX31Tjgy21HcHKemxssraeyQDY79UDGGGxYgJYa2Ev/FireShot%20Capture%20448%20-%20SteemitGuide%20(%40steemitguide)%20%E2%80%94%20Steemit%20-%20https___steemit.com_%40steemitguide.png)](https://steemit.com/steemit/@steemitguide/how-to-insert-2-columns-and-edit-text-style-with-equivalent-html-tags-using-steemit-s-raw-markdown-editor) [![FireShot Capture 42 - SteemitGuide (@steemitguide) — Steemit - https___steemit.com_@steemitguide.png](https://steemitimages.com/DQmPfZousBV2xBL5x6jeoe9d32tNW8AJmSx6tBCFeUZUkUF/FireShot%20Capture%2042%20-%20SteemitGuide%20(%40steemitguide)%20%E2%80%94%20Steemit%20-%20https___steemit.com_%40steemitguide.png)](https://steemit.com/steemit/@steemitguide/ultimate-guide-and-cheat-sheet-for-smiley-and-icon-s-make-use-to-thousands-of-emoticons-recgonized-by-steemit-s-raw-html-editor)