What's the correct way to hide the <h1> tag and not be banned from Google?
You should be fine with visibility: hidden.
That said, if your image is part of the content (and I would dare to say that a company logo is content, not presentation), and you care about accessible html, you should consider changing your code to include the image as a img element with title and alternate text, instead of a css background-image.
Additionally, if you hope to attract search engines to the keywords inside the <h1> element, you might want to include those words more than once in the page. The page title is a much more relevant place than the h1 element, for example.
The easiest, foolproof, best for SEO solution would be
<h1><img src=logo.png alt="Something.com | The best something ever"></h1>
set the image as the background of your h1 (set the width/height so it fits) then set your text-indent to something crazy like -9999px. That way when css is disabled (such as being crawled) the bot will see the text in the header instead of the background.
example:
CSS
#myHeader {
width:200px;
height:50px;
background: url('lcoation/of/the/image.jpg') top left no-repeat;
text-indent:-9999px;
}
HTML
<body>
...
<h1 id='myHeader'>HELLO WORLD</h1>
...
</body>