How to know if the link you’re sharing on Twitter will produce an in-tweet image preview

tl;dr – check if the link you’re sharing can produce an inline image preview by running it though Twitter’s Card Validator. If it doesn’t you can cheat by manually uploading or pasting in an image.

The order and type of links in your tweet can affect things: pasting in a link to a tweet always displays that tweet regardless of other links involved or their order but for any two (or more) non-tweet links included in your tweet the last one is displayed. You can prevent a link from displaying an image by converting it to an is.gd shortened link (not bitly though), or override by adding an image to the tweet.

Instagram is a law unto itself and linking your Twitter & Instagram won’t display your Insta posts, you need a third party app for that.

In my previous post, How the order of links in tweets determines which one gets its accompanying image displayed, I played around with the order (in a tweet) of links that either do or don’t produce an inline image preview.

This is what an inline image looks like.

Screenshot 2019-02-17 08.59.42

The picture below the text appears automatically after I shared a link (the link itself becomes hidden and is replaced with the image) to a post on this blog about Instagram images. Instagram doesn’t support Twitter cards so letting Instagram autopost your Insta posts to Twitter doesn’t work in terms of displaying an image, you need a third party app to do that – details in that post I’ve just linked to.

  1. For an inline image to appear the site being linked to must have Twitter cards set up correctly [technical info for web developers].
  2. You can check if any given link will work by plugging it into Twitter’s Card Validator (note that the S in HTTPSΒ may be important so try that first if you’ve copied over an HTTP address).
  3. If (2) doesn’t work and you aren’t able to set up (1) you can always cheat by just uploading an image or pasting in a screenshot of the image you’d like to appear. The link you share won’t disappear (it’ll show up as a clickable link) but hardly anyone will notice this workaround πŸ™‚

If you include links to two or more posts that have Twitter cards working then the last one mentioned in your tweet will have its image preview shown. If you include a Twitter-card link alongside a non-card link then the card link will always show its image and the order of the links doesn’t matter. For an enjoyably pedantic (YMMV) examination of the effect of the order of links have a look at my earlier post: How the order of links in tweets determines which one gets its accompanying image displayed.

Note that if you include in your tweet a link to another tweet (even if included with a link that would normally produce an inline image) it seems that the link to the tweet will always take precedence and show up, regardless of the order you write them in your tweet. In the example below (using my testing account) I’ve reversed the order of two links, one to a post on this blog about getting rid of ‘your friend liked this tweet‘ notifications, the other to a tweet of mine about a Wikipedia page I created.

Screenshot 2019-02-15 23.25.19

Advertisements

List of resources for finding Public Domain, Creative Commons or otherwise free images

I’ve been using Pixabay for a while ever since a colleague told me about it, it’s amazing. I also came across Pexels and periodically gather other things together. I’ve known about NASA images and CDC PHIL for years and Flickr of course as resources of images but I keep finding more. This excellent blog post (10 Sites for Free Stock Photos (Updated for 2018) by Sean Filidis) lists a whole load of ones I’d not heard of.

I’ve added some extra ones to Sean’s list (mine are asterisked) but you should definitely go and look at Sean’s post because he says a bit more about what each site offers.

Further reading at the end πŸ™‚

  1. * CDC PHIL (Public Health Image Library) – public health image library (example of CDC’s request for acknowledgement “This image is in the public domain and thus free of any copyright restrictions. As a matter of courtesy we request that the content provider be credited and notified in any public or private usage of this image.NB these include medical images and search results may not be suitable for children.
  2. * Creative Commons search
  3. * Flickr Advanced Search – change the ‘Any licence’ option to suit. The obvious white search bar in the middle is, curiously, not the actual search bar despite the cursor arriving there first. The minute you start typing in it the secondary grey search bar at the top will immediately take over, so you might as well write there anyway. I cannot account for it!

    Flickr advanced search showing where to access licence options Screenshot 2018-10-16 14.23.53.png

  4. * Freebies Gallery (formerly Public Photo)
  5. * Google Images (handy tip: use -pinterest in your search, then adjust the licence you want, Tools Β» Usage rights)

    Google Image search for flowers showing Tools and Usage rights aka License options Screenshot 2018-10-16 14.20.35.png

  6. Gratisography
  7. Morguefile
  8. * NASAΒ – I think almost all US Government department images, when taken as part of publicly-funded work, are free to use though they might like credit too. Here are NASA’s media-use guidelines.
  9. Picjumbo
  10. Pexels
  11. Pikwizard
  12. PixabayΒ <– I’ve used this one a lot
  13. * Public Domain Review – a collection of collections, eg this lovely one on comets aka Flowers of the Sky.
  14. Rawpixel
  15. Reshot
  16. * Science Museum Group collection – use freely, but only for non-commercial projects. Images are from the Science Museum in London, Railway Museum etc
  17. Stockvault
  18. Unsplash
  19. * Wellcome Collection images – free to use with attribution (credit) but check for individual photos

An * just means I’ve added this resource to Sean’s list (also reordered alphabetically).

1. What terms mean and how you can use images

Images that are labelled as Public Domain (or CC0) can be used for any purpose including commercial and you don’t need to credit the person who took it (but it’s still nice if you do) or pay for it. Creative Commons-labelled images have different ‘levels’ of how they can be used – they don’t cost money but you may have to credit the author, and you may not be able to use them on commercial projects. Some image repositories (like Pixabay) share images that can be used under a very relaxed license but also include a tip jar so that you can ping the author the equivalent of a cup of coffee.

See also Best practices for (Creative Commons) attribution

2. Embedding images into blog posts (for example)

Obviously if you’re printing a brochure you’d need to be able to download a high-res image and attribute as appropriate (or not needed if CC0, or no attribution requested).

Flickr, for example, generally takes care of attribution itself.

  1. Autoembedding from link: For a WordPress.com blog like this one simply pasting the link into the post will result in the image appearing, already linking back to its page on Flickr for people to find out who took it.
  2. Embed code: For Blogger.com sites this auto-embedding doesn’t work so for things like that you’d use the embed code. The code carries attribution info and a link back so is just another way of doing (1)
  3. Downloading: You can save a copy of the image then upload to your site – doing this means it will no longer carry any info about author attribution (beyond the filename, unless you change it). You would need to add a caption or find some other way of referencing it appropriately.

3. Further reading

How to add alt-text descriptions to pictures on Twitter for visually impaired people

I’ve seen a couple of tweets and Twitter threads in the last couple of days that have gone a bit viral, highlighting that everyone can set something up in their Twitter settings to make things easier for visually impaired users. If you switch ON the option to be able to caption your photos then, whenever you upload a pic to Twitter, you can click on the image and add a text description. This description doesn’t show up in your tweet (it doesn’t impinge on your character limit) but is useful for those using voice software.

  1. History
  2. How to set it up
  3. Write good descriptions

1. History: Twitter rolls out the ability to add alt text in 2016, initially just for phone apps I think, then later it rolls out to everything.

2. How to set it up

Full info in How to make images accessible for people but for desktop users (like me) the steps look like this, below.

a) Go to https://twitter.com/settings/account and scroll to the bottom of the panel on the left, click on Accessibility.

Screenshot 2018-01-06 00.12.14

b) Make sure there’s a tick next to ‘Compose image descriptions’

Screenshot 2018-01-06 00.14.00

Example of what it looks like when you upload a picture to desktop

Screenshot 2018-01-06 00.41.22

Click anywhere on the image to Add description and write your text in the box that appears.

Screenshot 2018-01-06 00.41.55

3. Write good descriptions: Lovely thread from RobotHugsComics (h/t ScottKeir) with suggestions of what to actually write in the description window.