Here’s couple of wild ideas which you could try, if you’re feeling adventurous.
1) Write some conditional logic with $_SERVER to detect if the user’s browser is the right type and high enough version, that would probably support the WebP format.
Try using $_SERVER ['HTTP_USER_AGENT'] and see also https://stackoverflow.com/questions/13252603/how-does-http-user-agent-work
2) Add the WebP and fallback image urls as data attributes and use js for the browser detection and to set the WebP or the fallback image as the background-image.
e.g. <div data-webp-bg="some-img-url" data-fallback-bg="another-img-url"></div>
p.s. I don’t know how well these would work, but I’m just feeling creative at the moment.
EDIT 22.10.2018
Here’s couple of leads you could follow and research more, if you want to come up with working solutions to my wild ideas.
For php take a look at https://github.com/hisorange/browser-detect (originally for Laravel I guess, but I think you could use elsewhere too) or https://github.com/cbschuld/Browser.php for example.
For js, this old thread could prove useful https://stackoverflow.com/questions/5916900/how-can-you-detect-the-version-of-a-browser. See also https://developer.mozilla.org/en-US/docs/Web/API/Window/navigator
Couple of minutes of googling gave me these related articles, https://artisansweb.net/detect-browser-php-javascript/ and https://medium.com/creative-technology-concepts-code/detect-device-browser-and-version-using-javascript-8b511906745
p.s Sorry for all the links and no code. The links are here just to provide nudge to the right direction and to promote own research and learning. This is a learning experience for me too.