There is now an option to shrink it in Customize > Header image. Though it’s also in pixels.
Percentages for the height don’t work in this case. It may seem logical that you can set it to 50% of the browser height, but that’s not how CSS works with elements with position: relative.
What you can do is set it in viewport relative units. This is how the header was built in the first versions of the theme, but we dropped it due to poor mobile support.
.has-banner,
.has-banner {
max-height: 50vh;
}
I guess you could also wrap it in a media query to avoid issues on mobiles.
I appreciate the response, and I’ll look into css media queries.
Now for a non-technical question: I’ve just got some feedback from two people on the site I’m building and both of them said “Uh….I don’t see any content.” I told one of them to scroll down, and then he started saying “Okay, so I’m seeing more stuff but I think it’s broken. Like, the picture isn’t scrolling with the text. That’s weird.”
So I’m wondering how many average web users, people who only look at ESPN and Amazon, are familiar with this kind of design. I’m befuddled by the fact that these two people didn’t think try to explore for more content. What have your observations been about how many people readily know what to do with this and how many don’t?
I totally love the design and I’m going to work on getting them to accept it. I’m hoping that shrinking the header will help them see that there’s more content below.
We’ve got a lot of users saying that due to the header being full screen, their visitors won’t know they have to scroll down. Though nobody reported it yet that actual visitors said they didn’t know they should scroll down.
I don’t really see this as an issue, but there is an even easier solution then messing with the header height: you can add a button in the header area, name it Click to scroll down and add #site-navigation in the URL field. So when its clicked it will scroll the website down smoothly to the menu.
Regarding the parallax images: nobody said yet that visitors consider parallax images to be broken. Parallax has been around for some time now so I don’t think many people get confused by it. It’s even in the Google Play thingy on Android when you go to an app’s page.
Forgot to mention, you can add the button I was referring to from Customize > Welcome area, in case you don’t have one already.
I guess I just have a special kind of user. 😉 And I don’t mean for my reports from users to be commentary on the design, just on the fact that there are users out there who have so little experience on the web that they don’t even try to look for more content, and I guess the group of people I asked for feedback from contains a high percentage of that kind of person.
However, the other person (not the one who already followed instructions to to scroll and then thought it was broken) just got back to me after following my instructions to scroll down and said “After scrolling I am IN LOVE with the feel of this website!”
Possibly because I’m having a bad attitude about people who can’t figure out that they should try to just scroll down, I’m reluctant to add anything that instructs people to scroll. However, I may do that, and I like the idea of a button more than text that says “Scroll down for more!”
Thanks again.
