Here is yet another option, which looks fine for HTML output, suggested under "adding a logo". The code below (which you can place below the top level heading) presumably goes direct through the knitting process and inserts itself in the final html. The issue is that the image doesn't make room for itself and ends up over the first text. Is there some simple html/css to sort this out?
<img src="https://i.imgur.com/GiViTbA.png" style="position:absolute;top:0px;height:100px;" />
EDIT
Yes it's a hack, but I've added some space for the image to go by coding this into the yaml:
title: |
.
.
.
.
site: bookdown::bookdown_site
EDIT
I have summarised all currently available options that I am aware of here at stackoverflow with their disadvantages. None of those are great, so I have opened a github issue here
EDIT 2
A workable enough hack now at stackoverflow for html output, so the github issue closed unless others are interested later. If you are interested in pdf output, with images at the front, try this, or including cover pages from other pdfs, you might like to look at this.
The last option is also an answer to this post