Fixed Header vs Scrolled header

Forum Moderators: not2easy

Message Too Old, No Replies

Fixed Header vs Scrolled header

what is best?

ogletree

6:58 pm on Nov 11, 2016 (gmt 0)

Anybody do any A/B testing on fixed headers on mobile ecommerce sites? I personally hate them but would like to know the pros and cons and if it affects conversions.

I bought a big phone so I could see it better. If somebody has a fixed header that essentially takes away part of my screen I'm not happy.

If they are good what is the best height? At what height does it cease to be a benefit?

I have a client that the fixed header takes up 1/3 of the screen. I would imagine that everybody would agree that is a bad idea for mobile. I would like to tell them to get rid of it but if it is best to have a fixed header what height should I tell them to use?

ergophobe

3:42 am on Nov 26, 2016 (gmt 0)

No testing yet... interesting test though.

>> fixed header takes up 1/3 of the screen

That's simply crazy. One pattern that I sort of like is the header that reduces when you scroll - so logo disappears or gets small, so you have the nav available, but not much else.

Marshall

12:12 pm on Nov 26, 2016 (gmt 0)

On any screen a fixed header that takes ups 1/3 of the page is way too much. Regardless, when I use fixed headers, 99% of the time it is only on large screen displays. I occasionally used a fixed menu or even a fixed search box, but only if it is small.

After re-reading the OP, does the fixed header do any thing, e.g. menu? If not, it is truly a waste of space.

lucy24

6:52 pm on Nov 26, 2016 (gmt 0)

what height should I tell them to use?

One line of ordinary-sized type (100%, 1em, or �medium�) plus necessary padding.

Hypothesis: Some mobile devices don't show an address bar once you've scrolled down. (My iPad behaves this way and it annoys the ### out of me.) So a fixed header provides an alternative way of telling/reminding the user what site they're on.

ergophobe

7:16 pm on Nov 26, 2016 (gmt 0)

@Marshall and @lucsy24 - that's what I meant by a minimized header - just enough to show whatever you need to invoke the nav (i.e. hamburger if that's your mobile menu) and minimal branding so people know where they are.