Select WPM
Three, two, one. GO! How to look great on Social Media and retain your SEO ranking written by Ruud van Lent. When you look at your Facebook and Twitter timeline or the Linkedin feed you can’t help but notice that it is all about the image now a days. When you have no image or a bad quality image (to small or scaled up), your message will just get ‘overrun’ by all the other posts. That is a shame because you have a message in your blog that you want to get across to as many as readers as possible! So you need high quality images and not only that, you also want to have the image itself have a clear call to action. The image is what stands out, not the title or the description text. This ideal situation bares two conflicts in it. 1. The SMO (Social Media optimization) conflict So you want a call to action on your image when shown on Twitter or Facebook, but you don’t want to show that call to action on the image in your blog: there is no sense in asking people to click to your blog when they are already in your blog. Just for demonstration purposes, this is the image that is used when you share this web page on a Social media platform: 2. The SEO and Google PageSpeed conflict Google ‘forces’ you to keep your images as small as possible. When you have the ideal image on your web page for Facebook to show on the timeline e.g. 900x600px and you show that image on your blog scaled down to 300x200px, then Google will (potentially) ‘punish’ you for not having optimized your site: the image ‘load’ is 9 times (!!!) to high and therefore not optimized. How to avoid these conflicts The best way to optimize your blog for sharing on Social Media and have optimized images for Google on your web site is to create different images for each purpose.The image that you want to show in your web page should be optimized for the template you are using: if the image will be shown at a resolution of 300x200 px, use an image that has an actual resolution of 300x200 px: Google will love you (and your website) for it! The image that you want to use for sharing on Facebook, Twitter, Linkedin must be a separate image. Resolution can be as high as you would like: no penalty here as the Social media platforms will scale down the image to the best size for the purpose.This image you need to refer to in your web page with the OpenGraph meta tags (og:image), or Twitter Card meta tags (twitter:image) Implement for your web site? There are a lot of plugins that will add OpenGraph and / or Twitter Card meta tags to your website and that will fill the image meta tags automatically with your web page’s image. When choosing a solution make sure that it has the possibility to select a custom image that will be set as the image meta tag. Joomla? Here comes ochOpenGraph On this Joomla! web site I of course use ochOpenGraph to do the job. It has all the features you need to have a professional appearance on Social Media: It can automatically add the article image as image meta tag: the first image in the text, the intro image or the full text image. You can specify the order in which these images should be used: e.g. first use the full text image, but when not found use the intro image, etc. {New in Joomla! 3.7] It can add custom images based on filename logic or on Joomla! Custom article Fields. What this enables you to do is to add e.g. a Custom article field of the type media to your articles. You, or your author (depending on the rights you assign to this field), can then add the custom image via this field. In the image priority you can then give this image the highest priority: so when this image is set, it will be used in the image meta tags. It differentiates between og:image images and twitter:image images. What this enables you to do is that you can have different images for Facebook (linkedin, Google+, etc) and Twitter. It has the possibility of a fall-back image: when the image in your article is below a set resolution, the the fall-back image will be used. This way when sharing your web page you always have an image accompanying it Do you have any tips and tricks that will make your web page look awesome on Social media and that will positively affect your SEO ranking?

How to look great on Social Media and retain your SEO ranking

Web Hosting

smo and seo social sharingWhen you look at your Facebook and Twitter timeline or the Linkedin feed you can’t help but notice that it is all about the image now a days.

When you have no image or a bad quality image (to small or scaled up), your message will just get ‘overrun’ by all the other posts. That is a shame because you have a message in your blog that you want to get across to as many as readers as possible!

So you need high quality images and not only that, you also want to have the image itself have a clear call to action. The image is what stands out, not the title or the description text.

This ideal situation bares two conflicts in it.

1. The SMO (Social Media optimization) conflict

So you want a call to action on your image when shown on Twitter or Facebook, but you don’t want to show that call to action on the image in your blog: there is no sense in asking people to click to your blog when they are already in your blog. Just for demonstration purposes, this is the image that is used when you share this web page on a Social media platform:

smo and seo social sharing metatag

2. The SEO and Google PageSpeed conflict

Google ‘forces’ you to keep your images as small as possible. When you have the ideal image on your web page for Facebook to show on the timeline e.g. 900x600px and you show that image on your blog scaled down to 300x200px, then Google will (potentially) ‘punish’ you for not having optimized your site: the image ‘load’ is 9 times (!!!) to high and therefore not optimized.

How to avoid these conflicts

The best way to optimize your blog for sharing on Social Media and have optimized images for Google on your web site is to create different images for each purpose.
The image that you want to show in your web page should be optimized for the template you are using: if the image will be shown at a resolution of 300x200 px, use an image that has an actual resolution of 300x200 px: Google will love you (and your website) for it!

The image that you want to use for sharing on Facebook, Twitter, Linkedin must be a separate image. Resolution can be as high as you would like: no penalty here as the Social media platforms will scale down the image to the best size for the purpose.
This image you need to refer to in your web page with the OpenGraph meta tags (og:image), or Twitter Card meta tags (twitter:image)

Implement for your web site?

There are a lot of plugins that will add OpenGraph and / or Twitter Card meta tags to your website and that will fill the image meta tags automatically with your web page’s image. When choosing a solution make sure that it has the possibility to select a custom image that will be set as the image meta tag.

Joomla? Here comes ochOpenGraph

On this Joomla! web site I of course use ochOpenGraph to do the job. It has all the features you need to have a professional appearance on Social Media:

  • It can automatically add the article image as image meta tag: the first image in the text, the intro image or the full text image. You can specify the order in which these images should be used: e.g. first use the full text image, but when not found use the intro image, etc.
  • {New in Joomla! 3.7] It can add custom images based on filename logic or on Joomla! Custom article Fields. What this enables you to do is to add e.g. a Custom article field of the type media to your articles. You, or your author (depending on the rights you assign to this field), can then add the custom image via this field. In the image priority you can then give this image the highest priority: so when this image is set, it will be used in the image meta tags.
  • It differentiates between og:image images and twitter:image images. What this enables you to do is that you can have different images for Facebook (linkedin, Google+, etc) and Twitter.
  • It has the possibility of a fall-back image: when the image in your article is below a set resolution, the the fall-back image will be used. This way when sharing your web page you always have an image accompanying it

Do you have any tips and tricks that will make your web page look awesome on Social media and that will positively affect your SEO ranking?

Web Hosting


Interesting blog? Like it on Facebook, +1 on Google, Tweet it or share this article on other bookmarking websites.

Written by
Pro-Blogger Top Blogger

With a solid background in ICT (operational, tactical and strategic) and years of experience in the community life, I see in communities and community thinking the future for companies.

This future requires another way of thinking and doing; both for executives and employees. It's not about me; it's about you. Your wellbeing and your (personal) growth.

'What comes around - goes around'

In the world of communities, the old 'management laws' no longer work and are even counterproductive.

I coach leaders and organizations in their quest for how new and servant leadership can contribute to communities and community thinking, and as a result to the growth of the organization.

I do this from the following initiatives:

 


Discuss this article

INFO: You are posting the message as a 'Guest'

Log In or Sign Up

Forgot your password? / Forgot your username?

Or login / register with one of the following Social Media accounts:

Stay tuned and follow us on Twitter: