{"id":12521,"date":"2017-01-21T08:00:59","date_gmt":"2017-01-21T13:00:59","guid":{"rendered":"http:\/\/blog.shareaholic.com\/?p=12521"},"modified":"2017-11-16T14:02:17","modified_gmt":"2017-11-16T19:02:17","slug":"how-to-use-images-on-your-blog","status":"publish","type":"post","link":"https:\/\/www.shareaholic.com\/blog\/how-to-use-images-on-your-blog\/","title":{"rendered":"The Definitive Guide to Using Images on Your Blog"},"content":{"rendered":"<div id=\"attachment_12567\" style=\"width: 310px\" class=\"wp-caption alignright\"><a href=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/4787412161_6e208f425c_b.jpg\"><img aria-describedby=\"caption-attachment-12567\" decoding=\"async\" loading=\"lazy\" class=\"size-medium wp-image-12567\" alt=\"Photo Credit: Www.CourtneyCarmody.com\/ via Compfight cc\" src=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/4787412161_6e208f425c_b-300x230.jpg\" width=\"300\" height=\"230\" \/><\/a><p id=\"caption-attachment-12567\" class=\"wp-caption-text\"><em>Photo Credit: <a href=\"http:\/\/www.flickr.com\/photos\/41185766@N03\/4787412161\/\">Www.CourtneyCarmody.com\/<\/a> via <a href=\"http:\/\/compfight.com\">Compfight<\/a> <a href=\"http:\/\/creativecommons.org\/licenses\/by\/2.0\/\">cc<\/a><br \/><\/em><\/p><\/div>\n<p>The internet is becoming more and more visual every day. On social media, we\u2019ve seen <a href=\"https:\/\/www.shareaholic.com\/blog\/2012\/09\/pinterest-traffic-data-august\/\">Pinterest\u2019s traffic skyrocket<\/a>, Facebook\u2019s Edgerank <a href=\"http:\/\/lp.wildfireapp.com\/rs\/wildfire\/images\/EdgeRank%20and%20Your%20Brand%20-%20An%20Analysis%20of%20Messaging%20Engagement%20on%20Facebook%20by%20Business%20Category%20Ch1.pdf?mkt_tok=3RkMMJWWfF9wsRoisqnKZKXonjHpfsX64%2BUuXa62lMI%2F0ER3fOvrPUfGjI4ESMJnI\">favor photos<\/a>, and Twitter and Instagram <a href=\"http:\/\/bits.blogs.nytimes.com\/2012\/12\/05\/twitter-loses-ability-to-properly-display-instagram-photos\/\">go head to head<\/a> over Twitter cards. All the content that people read online is increasingly more focused on being visually appealing.<\/p>\n<p>And your blog isn\u2019t the exception. Even if you\u2019re a master wordsmith, you should always be using images on your blog to engage your readers and make it easy for them to share your content on visually oriented social networks. To help you figure out how to effectively create and use images on your blog, here are some tips:<b>\u00a0<\/b><\/p>\n<h3 class=\"sub header\">Creating Images<\/h3>\n<p>If you want to have original images on your blog, but you\u2019re not a first-class photographer, you\u2019re in luck. There are a ton of tools out there that anyone can use. Here are my favorites:<\/p>\n<ul>\n<li><strong>PowerPoint &#8211;<\/strong> I\u2019ve professed my love for PowerPoint in a<a href=\"https:\/\/www.shareaholic.com\/blog\/2012\/09\/top-blogging-tools-pinterest\/\"> previous post<\/a>, but I thought it still deserved its own bullet point since we use it all the time at Shareaholic.\u00a0We\u2019ve created pins, Facebook cover photos and even <a href=\"https:\/\/www.shareaholic.com\/blog\/the-definitive-guide-to-related-content-ebook\/?utm_campaign=rec_ebook\">an eBook<\/a> with PowerPoint\u2014it\u2019s incredibly easy-to-use <i>and<\/i> the images you create still look very professional <strong>(see an example of what you can make below!)<\/strong>. I\u2019d recommend using PowerPoint for creating graphics, icons or badges\u2014if you\u2019re looking to do high-quality photo editing, it\u2019s not the right tool for you. If you want to learn how to use PowerPoint to create images for your blog, check out this\u00a0<a href=\"http:\/\/blog.hubspot.com\/blog\/tabid\/6307\/bid\/34017\/How-to-Create-Top-Notch-Visual-Content-in-PowerPoint-Tutorial.aspx\">awesome tutorial by HubSpot<\/a>.<\/li>\n<\/ul>\n<p style=\"text-align: center;\"><img decoding=\"async\" loading=\"lazy\" class=\"size-full wp-image-12464 aligncenter\" alt=\"blog sidebar\" src=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/blog-sidebar.png\" width=\"296\" height=\"296\" \/><\/p>\n<ul>\n<li><strong>PicMonkey<\/strong> &#8211; If you <em>are<\/em> trying to edit high-quality photos, create collages or just to hide a blemish or two, you have to check out <a href=\"http:\/\/www.picmonkey.com\/\">PicMonkey<\/a>. They have a ton of free options to help you create beautiful photos for your blog. (If you\u2019re constantly editing photos for your blog, you might think of paying for the premium features.) The best part about this tool is its interface\u2014like PowerPoint, PicMonkey is incredibly easy to use. Here\u2019s an example of something you can make with the tool:<\/li>\n<\/ul>\n<div id=\"attachment_12525\" style=\"width: 490px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Jays-Birthday.jpg\"><img aria-describedby=\"caption-attachment-12525\" decoding=\"async\" loading=\"lazy\" class=\" wp-image-12525\" alt=\"PicMonkey\" src=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Jays-Birthday.jpg\" width=\"480\" height=\"363\" srcset=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Jays-Birthday.jpg 1000w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Jays-Birthday-528x400.jpg 528w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Jays-Birthday-300x227.jpg 300w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Jays-Birthday-768x581.jpg 768w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Jays-Birthday-396x300.jpg 396w\" sizes=\"(max-width: 480px) 100vw, 480px\" \/><\/a><p id=\"caption-attachment-12525\" class=\"wp-caption-text\"><em>Just a quick picture we made with PicMonkey to celebrate our founder&#8217;s birthday on our <a href=\"https:\/\/www.facebook.com\/shareaholic\">Facebook page<\/a>!<\/em><\/p><\/div>\n<ul>\n<li><strong>Iconify.it<\/strong><b> &#8211; <\/b>Ever want to make a quick logo or icon for your blog? I recently stumbled upon <a href=\"http:\/\/Iconify.it\">Iconify.it<\/a>\u2014they have free vector downloads that are\u00a0<i>perfect<\/i> for making logos, header images, social connection icons or anything else you may need. Vector images are flat images that can be resized to any size and still maintain their shape and resolution. Using them can be a great way to appear professional without having design chops.<\/li>\n<\/ul>\n<div id=\"attachment_12885\" style=\"width: 476px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/iconify-copy.png\"><img aria-describedby=\"caption-attachment-12885\" decoding=\"async\" loading=\"lazy\" class=\" wp-image-12885\" alt=\"iconify copy\" src=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/iconify-copy.png\" width=\"466\" height=\"287\" srcset=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/iconify-copy.png 582w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/iconify-copy-300x185.png 300w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/iconify-copy-400x247.png 400w\" sizes=\"(max-width: 466px) 100vw, 466px\" \/><\/a><p id=\"caption-attachment-12885\" class=\"wp-caption-text\"><em>Icons by <a href=\"http:\/\/iconify.it\/\">Iconify.it<\/a><\/em><\/p><\/div>\n<h3 class=\"sub header\">Finding Images<\/h3>\n<p>You don\u2019t always have to create an image for your blog posts\u2014there are already a ton of images online that are free to use.<\/p>\n<p><strong>The catch? You have to make sure you are only using images that you have permission to use.<\/strong> This means that you need to be buying stock photos or using <a href=\"http:\/\/creativecommons.org\/\">Creative Commons images<\/a> (free photos and graphics that have been licensed by their creators to be reused, reworked or shared).<\/p>\n<p>I\u2019d highly recommend the second option when you are building up your blog presence\u20149 times out of 10, you\u2019re going to find what you need for free with a Creative Commons tag. That being said, if you\u2019re using Creative Commons images, you need to be sure to properly attribute them to their author.<\/p>\n<p><strong>Enter, <a href=\"http:\/\/compfight.com\/\">Compfight<\/a>, one of my <em>absolute<\/em> favorite blogging tools.<\/strong> You can search for Creative Commons images and easily filter the results by the type of license.<\/p>\n<p style=\"text-align: center;\"><a href=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Compfight-example.png\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter  wp-image-12531\" alt=\"Compfight example\" src=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Compfight-example.png\" width=\"533\" height=\"257\" srcset=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Compfight-example.png 1269w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Compfight-example-700x337.png 700w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Compfight-example-300x144.png 300w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Compfight-example-768x370.png 768w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Compfight-example-1024x493.png 1024w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Compfight-example-400x193.png 400w\" sizes=\"(max-width: 533px) 100vw, 533px\" \/><\/a><\/p>\n<p>Once you find a photo you want to use, they even put together the attribution for you to use\u2014all you have to do is copy and paste it in the image caption. It couldn\u2019t be easier to find photos for your blog.<\/p>\n<h3 class=\"sub header\">Placing Images on Your Blog<\/h3>\n<p>Once you\u2019ve found an image to use or made one yourself, you&#8217;re still not done&#8211;you still have to get it up on your blog. Though it may seem like you could just upload an image and place it anywhere you like, there are some best practices around image placement:<\/p>\n<ul>\n<li><strong>Place one image above the fold. <\/strong>You want to grab your readers\u2019 attention immediately with a relevant and engaging image, so make sure your image is fully visible without having to scroll.<\/li>\n<li><strong>Align images to the center or right of your post. <\/strong>This will make it easy for your readers to follow along. If you left-align your images, you\u2019re breaking up the left margin (your readers\u2019 point of reference) and it\u2019s much harder to follow along with the text. See what I mean?<\/li>\n<\/ul>\n<p style=\"text-align: center;\"><b><a href=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Screen-Shot-2013-01-21-at-5.54.01-AM.png\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter  wp-image-12535\" alt=\"Example of left aligned picture\" src=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Screen-Shot-2013-01-21-at-5.54.01-AM.png\" width=\"481\" height=\"374\" srcset=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Screen-Shot-2013-01-21-at-5.54.01-AM.png 601w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Screen-Shot-2013-01-21-at-5.54.01-AM-514x400.png 514w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Screen-Shot-2013-01-21-at-5.54.01-AM-300x234.png 300w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Screen-Shot-2013-01-21-at-5.54.01-AM-385x300.png 385w\" sizes=\"(max-width: 481px) 100vw, 481px\" \/><\/a><\/b><\/p>\n<p>Ultimately, your images should enhance the content on your blog, not distract from it.<\/p>\n<h3 class=\"sub header\">Optimizing Your Site for Images<\/h3>\n<p>There are also a bunch of little tweaks you can make to your images, posts and layout to get even more engagement. Here are some rules you should always follow:<\/p>\n<ul>\n<li><strong>Set the image\u2019s alt tag to be found by search engines. <\/strong>Alt tags assign text to describe your image\u2014if your browser can\u2019t load the image, the alt tag will show up. This is also a small, but important, part of your <a href=\"https:\/\/www.shareaholic.com\/blog\/2012\/01\/how-to-optimize-your-blog-posts-for-seo\/\">SEO activities<\/a>\u00a0since alt tags allow the images to be found by search engines. If you&#8217;re on WordPress, you can set the alt tag here:<\/li>\n<\/ul>\n<p style=\"text-align: center;\"><a href=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2012\/01\/alt-attribute-example.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter  wp-image-3579\" alt=\"alt attribute example\" src=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2012\/01\/alt-attribute-example.jpg\" width=\"381\" height=\"354\" srcset=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2012\/01\/alt-attribute-example.jpg 476w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2012\/01\/alt-attribute-example-430x400.jpg 430w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2012\/01\/alt-attribute-example-300x279.jpg 300w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2012\/01\/alt-attribute-example-322x300.jpg 322w\" sizes=\"(max-width: 381px) 100vw, 381px\" \/><\/a><\/p>\n<ul>\n<li><strong>Upload the exact file size you need to cut down on load time.<\/strong> There\u2019s no point in uploading a 1000 x 1000 pixel image if you only need it at 300 x 300. Before uploading a photo, make sure it\u2019s the size you want. Larger files increase your page&#8217;s load time, which could mean a reader exits your site because it&#8217;s taking too long to load.<\/li>\n<li><strong>Brand your images with your blog\u2019s URL or logo.<\/strong> Though you know that you need to properly attribute images, not everyone on the internet does. By branding your images with your URL or logo, you will be credited with the photo no matter where it appears online. Here&#8217;s an example of a branded image we used in our <a href=\"https:\/\/www.shareaholic.com\/blog\/2013\/01\/html-101-for-bloggers\/\">HTML 101 post<\/a> recently:<\/li>\n<\/ul>\n<p style=\"text-align: center;\"><a href=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Slide1.png\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter  wp-image-12241\" alt=\"opening and closing tags 2\" src=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Slide1.png\" width=\"555\" height=\"243\" srcset=\"https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Slide1.png 694w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Slide1-300x131.png 300w, https:\/\/www.shareaholic.com\/blog\/wp-content\/uploads\/2013\/01\/Slide1-400x175.png 400w\" sizes=\"(max-width: 555px) 100vw, 555px\" \/><\/a><\/p>\n<ul>\n<li><strong>Use featured images on your blog\u2019s homepage. <\/strong>Using featured images on your home page is a great way to hook your readers in right away. They also are pulled into social media when people share your posts\u2014Facebook, LinkedIn, Twitter, Google+ and Pinterest all pull images from your post. Not sure how to get featured images set up on your blog? <a href=\"https:\/\/www.shareaholic.com\/blog\/2012\/10\/featured-images\/\">Check out this post.<\/a><\/li>\n<li><strong>Make it easy for them to share to visual social networks with share buttons.<\/strong> Whether you put them <a href=\"https:\/\/www.shareaholic.com\/blog\/image-share-buttons\/\">directly on the image<\/a> or at the bottom of your post, you should always make it easy for your readers to share your post to visual social networks like Pinterest. Though a <em>bit<\/em> biased, I\u2019d highly suggest Shareaholic&#8217;s\u00a0<a href=\"https:\/\/www.shareaholic.com\/publishers\/sharing\/\">share buttons<\/a>. Not only are they easy to install and use, but they also come with other blogging tools you would like\u2014<a href=\"https:\/\/www.shareaholic.com\/publishers\/recommendations\/\">Recommendations<\/a> (a related content widget), <a href=\"https:\/\/www.shareaholic.com\/publishers\/analytics\/\">Shareaholic Analytics<\/a>, and <a href=\"https:\/\/shareaholic.com\/publishers\">more<\/a>!<\/li>\n<\/ul>\n<p>Having images on your blog on your blog is incredibly important to your success, but it&#8217;s not always as easy as it seems. Now, you\u2019re prepared to have some awesome images on your blog that can help drive you traffic and engagement on your posts\u2014so go get started!<\/p>\n<p><em><strong>How do you use images on your blog? Share your tips and tricks for creating, finding and optimizing images on your blog in the comments!<\/strong><\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>The internet is becoming more and more visual every day. On social media, we\u2019ve seen Pinterest\u2019s traffic skyrocket, Facebook\u2019s Edgerank favor photos, and Twitter and&hellip;&nbsp;<br \/><a class=\"continue-reading\" href=\"https:\/\/www.shareaholic.com\/blog\/how-to-use-images-on-your-blog\/\">Continue Reading<\/a><\/p>\n","protected":false},"author":40,"featured_media":12567,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[606,522],"tags":[295,358,541,542],"_links":{"self":[{"href":"https:\/\/www.shareaholic.com\/blog\/wp-json\/wp\/v2\/posts\/12521"}],"collection":[{"href":"https:\/\/www.shareaholic.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.shareaholic.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.shareaholic.com\/blog\/wp-json\/wp\/v2\/users\/40"}],"replies":[{"embeddable":true,"href":"https:\/\/www.shareaholic.com\/blog\/wp-json\/wp\/v2\/comments?post=12521"}],"version-history":[{"count":0,"href":"https:\/\/www.shareaholic.com\/blog\/wp-json\/wp\/v2\/posts\/12521\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.shareaholic.com\/blog\/wp-json\/wp\/v2\/media\/12567"}],"wp:attachment":[{"href":"https:\/\/www.shareaholic.com\/blog\/wp-json\/wp\/v2\/media?parent=12521"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.shareaholic.com\/blog\/wp-json\/wp\/v2\/categories?post=12521"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.shareaholic.com\/blog\/wp-json\/wp\/v2\/tags?post=12521"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}