Is there a neat way to get attribution for a background image in the presentation layer?

I have a CC-BY image that I'm using as a background, brought in by CSS. This image is purely there for its looks, and definitely not content. I need to put attribution on this image somewhere, and obviously it would be nicest to make this attribution a link to the kind person who provided the image. However, I don't really want to put link text into my HTML as that breaks the separation of actual content and presentation (the attribution link is really part of the presentation, I would say, since if you viewed the page without the background image, you wouldn't really want to see it).

Is there any way I can get my separation of presentation and content right here?

My current code for this looks something like

<div class='backgrounded'>
  <div class='content'><h1>Some stuff here</h1></div>开发者_运维百科;
  <div class='attribution'>
    Image from <a href='http://example.com/image'>Lovely CC-BY person</a>
  </div>
</div>

And the CSS:

div.backgrounded {
    background: url(/images/an_image.jpg);
}
div.attribution {
    color: #ffffff; 
    float: right;
}

This has the attribution in the content, where I'd rather not have it.

Other things I've considered include:

• Putting the attribution in the image itself. This solves the code separation problem, but my image is a nice wide one positioned to the left so there is enough background for a wide browser window. The bottom right of the image is almost always out of view. I don't see how I can make this attribution a link.

• Making an image containing the attribution text and putting that where the current attribution is, again in the background, but on top I guess I could make it a link using JavaScript. This seems like a lot of fiddling about.

Is there a way out of this where my image is only referred to in the CSS? Or failing that, what's the best way to keep things nicely separated, so that, for instance, the image could be replaced without editing the HTML?

You can leave a comment in the CSS itself:

div.backgrounded {
    background: url(/images/an_image.jpg); /*Image provided by [name]*/
}

Then the attribution is in the CSS, but it won't be visible on the actual page.

The relevant bit of the CC-BY license (readable version) is

Attribution — You must attribute the work in the manner specified by the author or licensor (but not in any way that suggests that they endorse you or your use of the work).

Which leads me to believe that unless a manner is specified your discretion is acceptable. I think it eminently reasonable to do for a background image as is done on this page: at the bottom you will find a discreet

 site design / logo © 2011 stack exchange inc;

which easily conforms to the spirit of CC-BY. Having put a number of creations out on the web as CC-BY, my personal intent was "just please don't pretend that you created it", which I think is a common use of that license.

Since you must, by definition, have the attribution information, take the easy route and just ask the creator "is this ok?".