Sticky headers. Please don't

Sticky (or “fixed") headers are everywhere. It feels that every web designer’s first attempt to site’s navigation starts with a sticky header. I hate it.

Interestingly, even Apple uses sticky headers on their website. On the main page of apple.com the navigation is the same dumb bar, that hangs at the top all the time and eats a good chunk of the screen.

main page on apple.com

But let’s go one page down:

product page on apple.com

The navigation bar still floats around but it blends with the page. It’s contextual. It doesn’t distract you from looking at the product.

When the purpose of the page is to provide you with reading materials and doesn’t require any actions from you, the bar just disapears from the design:

text page on apple.com

Now, it’s only you and the text.


For contrast, this is how Google does it:

somewhere on cloud.google.com

Yes, these are three sticky bars; one under another. No, I can’t believe there is a need for them to be on the screen all the time.

Or, this is the current design of pkg.go.dev (Google again), whose goal is to become the default documentation portal for Go modules and packages:

pkg.go.dev

I’m sure these two bars at the page’s top are very important but I doubt they are more important than the content of this page.