I have recently designed a website with no img tags, only one big fat CSS sprite with everything in it. Though, when I try to publish that website on Facebook, it won't show a preview thumbnail — probably because it doesn't find any images on the markup. Any suggestions? I'd still like to keep it a super fast img-less website, nevertheless.
Facebook uses a proprietary link type called
<link rel="image_src" href="location/of/image" />
Just insert that in your
<head> and Facebook should be able to pick up on the image.
If you're also interested, Facebook also recognizes two other
video_src. See here for more.
I would suggest this reading
Google is your friend :)
It all resumes to add a meta info to your code as:
<link rel="image_src" href="http://site.com/website-thumb.jpg" />
and try not to make that image more than 250px wide.
<html> tag with
<html prefix="og: http://ogp.me/ns#">
Add the given meta tag inside your head tag.
<head> <meta property="og:title" content="TITLE TO BE DISPLAYED"/> <meta property="og:image" content="IMAGE URL"/> <meta property="og:description" content="DESCRIPTION"/> </head>
Title and description are optional in your case. This will work for sites utilizing open graph protocol.