5 Dec 2014

Bing Image Search replaces Clip Art - oh, the potential!

Today, I felt a pang. Right deep down in the Memorabilia Pit of my stomach. Microsoft is ditching Clip Art from Office! Wow, we've had that library since the Commodore 64 morphed into a PC almost overnight. Or at least Windows 95.

And even though loading Clip Art would cause our 256 MB Ram PC to freeze - often - we still loved it to death. Posters, certificates, D-I-Y marketing flyers - we used those sidebar images for just about everything.

But, lo! (in festive voice), the library has closed down. Or at least it has in the US. I've just gone to Insert ► Online Pictures on my Desktop and Clip Art is still there.

Insert Clip Art, Microsoft Word

But, yes. You can source an image for your Word document on desktop, royalty-free and served by Bing's image search.

As the screenshot prompts, Bing/Office is very clear in the action you must take next.

Do check that the image is in the Public Domain if you're going to use it online. Don't just assume that it is okay, just because it's in the results. Yep, a pain. But better safe than sorry.

Bing search for CC2.0 images in MS Word

Did Google's Announcement of Advanced Pixelation Detection Force the Issue?

I suppose it had to follow, though. Only last month, Google Research reported huge strides in image recognition by pixelation, only.

The upshot is that 'alt text' may (big may) at some point become redundant. What's alt text? It's the textual description of an image copywriters and webmasters use in a web page's HTML code.

It tells the page indexer and users with impaired vision what the picture is about. Here's my main domain Blavatar, as an example:

Featured image selections in WordPress
Search engines may otherwise use alt text as a way to confirm their algorithms' pixelated assessment of a digital image. This, in my opinion, would make more sense.

The guys and gals at the research lab will keep plugging away. Results aren't perfect, yet - but they're getting there.

But until Google is confident in the new tool, what an opportunity we have, though, eh?

Image Search - so underutilised

So. What do we know about Bing Image Search that we can use?

Microsoft Office will rely on CC1.0 Universal images gathered by Bing to replace its Clip Library. That's a massive data gathering tool, collecting images from the web.

Those images will then be displayed for MS Office users to add into their documents. Straight forward, right?

So, what if we could get images from our sites beamed into the offices of millions of, mm, Office users around the world!? There's no reason whatsoever why we can't, in theory.

Including an accurate description of your image is even more important following Microsoft's announcement. But even before this news, people were lax in alt text implementation and undervalued image search as traffic resource.

Am I just making all of this up? I am so not. Here's why.

This is a snapshot of stats for a WordPress blog post, a site to which I've not posted anything new in a year, or more. It gets regular trickles of traffic, all the same. And it's always the same source: image search drawing a huge proportion of the page's on-page views:

Screenshot showing traffic referrers, visits and target image of bikini wax


Okay - you can make up your own mind about what users are searching for. I've obfuscated it here, but it is clearer on the original web page. Swiftly moving on…

So, how do you include 'alt text' and a CC1.0 license in your HTML Markup?

I'm everso glad you asked. It's not obvious, because there seems no way to pull it off in HTML5 [citation needed]. But there is a way in RDFa.

There's a full and detailed guide on the Creative Commons Labs website, but this is all you need to know for now.

The rel= markup in HTML tells a web crawler the relationship between the entity you're wrapping in code to an off-site source. We want to tell Bing's crawler that our image is CC1.0 so that it can display the images on our site in Office, right? Darn tootin'!

To make sure their crawler knows what your image is and that they can use it, we need to insert two snippets of code into the HTML:
  1. rel="license" + URL of where the license lives;
  2. alt="description", which is the description of the image;
  3. width="XXX", set to the width of your template or narrower if wrapping image in text;
  4. and, of course, you have to link to the image source, be it on your CMS' server or online elsewhere.
First of all, the license information wraps around the image information. That's very important! Next, decide which license you want (and find its CC URL) and create an appropriate title for your image.

Next, get the URL of the image. If it's online, right-click the image and click "Copy Image URL".

You must ensure that you can redistribute this image and use the appropriate CC license! Or, if you're uploading via the dashboard, do so and pop into the HTML editor of your page.

You can then start building your code.

If you don't write code in any way, Creative Commons provides a tool that will create an embeddable Public Domain image HTML code.

If you are comfortable with HTML, at least a little, your code will look something like this:

screenshot of creative commons license in HTML image markup

That's the code in this post that I entered for the 'Stats/Bikini Wax' image, above. The wrapper is on the top line and finishes with </a> (end anchor).

The source of the URL, its alt text and width are in there, too. And, yes - you can put a separate 'title' in, too. And, Bing-go! It works.

Toolbox Tip: There is, of course, a pay off. If you're marking your images as in the Public Domain, you can't moan when other people use them.

That said, the image search feature in MS Word does allow users to filter images by license. If you don't want to waive all rights to your pictures, opt for CC2.0.

The odds are, images in the public domain will be generic. They'll not be a close enough representation of what the user wants if they want to look professional. That's great from a competition view for us, not so good for the user.

They may well then choose to search images by CC2.0 license, instead. This means they must attribute the image they use. If you'd prefer your images showing up in this search instead, in the markup, point the href to the Creative Commons CC2.0 URL, instead.

How do different CMS platforms handle images?

Screenshot - insert image, Blogger
If you're using Blogger, WordPress or Tumblr, each has their own way of allowing you to upload your picture.

You can add a picture via an online URL* or upload from your desktop or Google Drive (in the case of Blogger, left).

Each CMS will then prompt you for the alt text, or 'title', of the image.

In WordPress, they also offer the chance to choose a featured image, with a lengthier description for it. This is perfect for inclusion in the new Bing clip library. See my Blavatar of zebedeerox above for those details.

Screenshot insert image into Tumblr photo post*On Tumblr, it will depend upon the type of post you're creating - image, text, quote, etc.

One type will let you upload an image from your desktop. Others will let you include an image from a URL - that's using their image upload facility in the dashboard.

If you choose a Tumblr photo post, you have the choice of upload, URL or even taking a webcam shot to load into the post.

Of the three, I find Tumblr's visual editor the least user friendly to work with, so always write my posts in HTML.

Toolbox Tip: You can also set the "e-mail posts" facility to HTML by default in settings.

Do not see this as an opportunity to SPAM the search engines

One word of caution, though. Don't try to use this additional description space as a way to fit spammy keywords in. They've not said so yet, but if I know Google, they're planning something extra with the new pixelation technology.

You and I both know that Google wants its customers to have the best search experience, right? That covers all mediums - web, video, news and images. If you're trying to game search by cramming in keywords or using an inaccurate description of your image you will get punished!

Oh - and a secondary word of caution. As you've guessed, image search is becoming a lot more accurate. Owners of images and marketers and copyright standards can and do scan the web for illegal use of someone else's copyright.

As the Microsoft Office blog post warns us, always check the Creative Commons license on an image before you use it. Whilst Bing no doubt does everything it can to ensure it only serves Public Domain images, there will be oversights.

The onus is on you as the publisher of the content to give credit where it's due for any images you use. Now that Clip Art has hung up its brushes, don't try and pull any strokes, right?

all image credits: Jason Darrell/The Flying Feck